React-select: [V2] Creatable crashes with values without `toLowerCase` in prototype

Created on 20 Aug 2018  路  4Comments  路  Source: JedWatson/react-select

This issue is very similar to https://github.com/JedWatson/react-select/issues/2953 and the same lines are affected here.

When using Creatable you're limited to only using values who's type's prototype has the toLowerCase method which causes the entire component/application to crash if you're using int's for values which i can only imagine im not the only one doing this.

Example: https://codesandbox.io/s/18w2ymppql

Reproduce steps:

  1. visit example
  2. open dropdown
  3. type anything
  4. watch the fireworks
issubug-unconfirmed issuhas-pr issureviewed

Most helpful comment

@JedWatson sorry to ping you but this seems like a pretty gaping issue, atm it's blocking us from updating to v2 :(

All 4 comments

@JedWatson sorry to ping you but this seems like a pretty gaping issue, atm it's blocking us from updating to v2 :(

I am seeing the same issue, but only when I create an optimized build. Locally I do not experience the issue, which makes it difficult to debug.

Any updates on this issue? I can confirm @jsarman's statement, it only happens in production with an optimized build. Seems like compareOption function is transpiled differently in production.

Production build:

var compareOption = function compareOption(inputValue, option) {
  var candidate = inputValue.toLowerCase();
  return option.value.toLowerCase() === candidate || option.label.toLowerCase() === candidate;
};

While correctly transpiled one in dev is as follows:

var compareOption = function compareOption() {
  var inputValue = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
  var option = arguments.length > 1 ? arguments[1] : undefined;
  var candidate = String(inputValue).toLowerCase();
  var optionValue = String(option.value).toLowerCase();
  var optionLabel = String(option.label).toLowerCase();
  return optionValue === candidate || optionLabel === candidate;
};

@JedWatson any thoughts?

Greetings @th3fallen and others,

This was fixed in v2.3.0 / 2019-01-18
https://github.com/JedWatson/react-select/releases/tag/v2.3.0

To verify, I forked your codesandbox containing version 2.0.0-beta7 and updated react-select to latest v2 (2.4.4). The error is no longer present.
https://codesandbox.io/s/react-select-tolowercase-fixed-4rexs?file=/example.js

As this no longer appears to be an issue, I will close this ticket. If there are other concerns or questions, please feel free to reply and if necessary this issue can always be reopened.

Was this page helpful?
0 / 5 - 0 ratings