Inquirer.js: Number type in CLI can not be deleted.

[lvjiaxuan]

const inquirer = require('inquirer');
inquirer.prompt([
  {
    name: 'age',
    message: 'please input',
    type: 'number',
    validate(value) {
      return +value > 18 ? true : 'test';
    }
  }
]

When input an invalid value like 10 or 'test', I couldn't delete it in the command line.I think it should return as a string type.But I can't pass the ci/pr.

class NumberPrompt extends Input {
  filterInput(input) {
    if (input && typeof input === 'string') {
      input = input.trim();
      // Match a number in the input
      let numberMatch = input.match(/(^-?\d+|^\d+\.\d*|^\d*\.\d+)(e\d+)?$/);
      // If a number is found, return that input.
      if (numberMatch) {
        // return Number(numberMatch[0]);
        return numberMatch[0];
      }
    }

    // If the input was invalid return the default value.
    // return this.opt.default == null ? NaN : this.opt.default;
    return this.opt.default == null ? 'NaN' : this.opt.default;
  }
}

[SBoudrias]

validate isn't supposed to prevent or replace input.

That being said, it's possible something is wrong when we end up printing the number on the terminal.

I do not think this is related to the type of NaN, but it might be how the prompt renders the input (I'm not sure anymore if it processes it before printing it out. If that's the case, then it's possible NaN prevents the type from becoming valid again.)

[letanure]

I got the same error, after fails validation, the cli shows NaN and I cant delete.

my code:

const inquirer = require("inquirer");

const getTourId = async (inputs = []) => {
  const prompts = [
    {
      type: 'number',
      name: 'value',
      message: "Tour Id?",
      validate: function(value) {
        var pass = Number.isInteger(value)
        if (pass) {
          return true;
        }
        return 'Please enter a valid tour ID';
      }
    },

  ];
  const answers = await inquirer.prompt(prompts);
  return answers.value;
};


const main = async () => {
  const tourId = await getTourId();
  const answers = {
    tourId,
  }
  console.log(answers);
};

main();

[letanure]

quick fix, just change the type to "input" and validate

const getTourId = async (inputs = []) => {
  const prompts = [
    {
      type: 'input',
      name: 'value',
      message: 'Tour Id?',
      validate: function(value) {
        var pass = !isNaN(value)
        if (pass) {
          return true
        }
        return 'Please enter a valid tour ID'
      },
    },
  ]
  const answers = await inquirer.prompt(prompts)
  return answers.value
}

[c100k]

@letanure I've just got the same error and ended up doing the same as you said => Switching from type: 'number' to type: 'input'.

However, your answers ends up being :

{
    value: '150'
}

instead of

{
    value: 150
}

So it is necessary to cast manually the values to have numbers when the prompt is done. Because I tried filter with a parseInt() and ended up with the same NaN that can't be deleted from the prompt.

[rryter]

I just ran into this problem too. I couldn't delete it, but i could get rid of it via the up and down arrows. 👍

[navarrojandg]

As @SBoudrias mentioned, the issue is that after the validation fails, the user input is still NaN therefore will cause the error prompt to show again. NaN input => show error => input is still NaN => show error => repeat.

My fix was to filter the input and return string if input is NaN.

const { qty } = await prompts({
    type: 'input',
    name: 'qty',
    message: 'How many ?',
    default: '1',
    validate: value => isNaN(parseInt(value)) ? 'Not a number!': true,
    filter: value => isNaN(parseInt(value)) ? v : parseInt(value, 10)
 });
console.log(qty);