Cannot read property 'option' of undefined

[thezanke]

Problem

If you try to use arrow keys in a Select with zero options after tabbing to it it throws TypeError Cannot read property 'option' of undefined.

Demo

https://plnkr.co/edit/CYKgXtDCN8N3F16StNTq?p=preview
Steps to reproduce:

1. Focus the top input element
2. Tab to the Select element
3. Push up or down arrow key

[tsechingho]

I encounter this issue and bug me very much.

the fix by @thezanke could work but it is not yet accepted.

if anyone looks a workaround, you could try to use cache to resolve, like

    <Select.Async
      name='business[city_name]'
      placeholder='City'
      autoload={true}
      cache={{ '': [{ label: '', value: null, disabled: true }] }}
      value={cityName}
      loadOptions={loadCityOptions}
      onChange={onCityChange}
      searchPromptText='Type > 3 charaters to search'
    />

[L30Yu]

if you don't need searchable, you can set Select component with searchable={false}

If you read the source code of the react-select.es.js

before it reaching the undefined this.input bug, there are couple places able to return. Therefore, I tried set searchable to false, and it avoid this bug happen.