Skip to content

Exception when typing after clearing PhoneInput with null value #390

@jordanmkoncz

Description

@jordanmkoncz

I am using the feature where you pass null as the value of the PhoneInput, in order to clear out the currently selected country in the country dropdown. In some scenarios, this is not working correctly and causes an exception.

Here are the steps to reproduce:

  1. Start with input value being a string (either empty string or non-empty string)
  2. Set PhoneInput value to null (in my case I have a button which I press that does this)
  3. Choose a country in the country dropdown
  4. Set PhoneInput value to null again
  5. Do not choose a country in the country dropdown, and instead start typing a value in the input

At this point an exception occurs:

TypeError: Cannot read property 'length' of undefined

PhoneInput.handleInput
src/components/PhoneInput/index.js:556
  553 | // we don't need to send the whole number to guess the country... only the first 6 characters are enough
  554 | // the guess country function can then use memoization much more effectively since the set of input it
  555 | // gets has drastically reduced
> 556 | if (!this.state.freezeSelection || selectedCountry.dialCode.length > inputNumber.length) {
      | ^  557 |   if (this.props.disableCountryGuess) {newSelectedCountry = selectedCountry;}
  558 |   else {
  559 |     newSelectedCountry = this.guessSelectedCountry(inputNumber.substring(0, 6), country, onlyCountries, hiddenAreaCodes) || selectedCountry;

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions