Inquirer.js icon indicating copy to clipboard operation
Inquirer.js copied to clipboard

Number type in CLI can not be deleted.

Open lvjiaxuan opened this issue 6 years ago • 10 comments

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;
  }
}

lvjiaxuan avatar Nov 25 '19 13:11 lvjiaxuan

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.)

SBoudrias avatar Nov 25 '19 14:11 SBoudrias

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 avatar Dec 20 '19 11:12 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
}

letanure avatar Dec 21 '19 12:12 letanure

@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.

c100k avatar Feb 12 '20 14:02 c100k

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. 👍

rryter avatar Apr 22 '20 05:04 rryter

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);

navarrojandg avatar May 10 '20 03:05 navarrojandg

This is a pretty major bug IMHO that will bite any user that types anything other than a number in response. Would be great if this could be addressed since its been open so long. The only solution seems to be to not use the 'number' type.

grempe avatar Mar 17 '21 21:03 grempe

Whats the tentative timeline for this issue , when will this be picked. The issue is been open for more than 4 years.

kunj-bosamia avatar Apr 08 '24 10:04 kunj-bosamia

A possible approach--> If the type is set as number user should not be allowed to press any other keys. only number inputs should be taken and be printed on the command line interface. If a user presses any other non number key just ignore it don't take it in the input string.

The problem users are facing is that sometimes by mistake user presses some other non number key and presses enter it gives nan output when we cannot be removed from the cli by pressing backspace key

kunj-bosamia avatar Apr 08 '24 10:04 kunj-bosamia

PR to fix this is welcomed, the code itself is pretty short https://github.com/SBoudrias/Inquirer.js/pull/663

number as a prompt was removed from the latest version (@inquirer/prompts) due to the bad UX it has. New version release announcement over here #1214, and we're considering re-adding number with the modern API over at #1383.

SBoudrias avatar Apr 08 '24 18:04 SBoudrias