(fix)<MultiSelect> - Fix missing call to onManuallyInput when no options exists (#1804)

* Fix missing call to onManuallyInput when no options

* clarify README

Author: Erez Makavy

src/MultiSelect/MultiSelect.js

@@ -117,8 +117,8 @@ class MultiSelect extends InputWithOptions {
     }
 
     if ((event.key === 'Enter' || event.key === 'Tab' || delimiters.includes(event.key)) && value.trim()) {
+      this._onManuallyInput(this.state.inputValue);
       if (options.length) {
-        this._onManuallyInput(this.state.inputValue);
         const unselectedOptions = this.getUnselectedOptions();
         const visibleOptions = unselectedOptions.filter(this.props.predicate);
         const maybeNearestOption = visibleOptions[0];

src/MultiSelect/MultiSelect.spec.js

@@ -211,6 +211,18 @@ describe('multiSelect', () => {
     expect(onManuallyInput.mock.calls[0][0]).toBe('custom value');
   });
 
+  it('should call onManuallyInput after delimiter is pressed given no options', () => {
+    const onManuallyInput = jest.fn();
+    const {driver, inputDriver} = createDriver(<MultiSelect onManuallyInput={onManuallyInput} value="custom value"/>);
+
+    driver.focus();
+    inputDriver.enterText('custom value');
+    driver.pressCommaKey();
+
+    expect(onManuallyInput).toHaveBeenCalled();
+    expect(onManuallyInput.mock.calls[0][0]).toBe('custom value');
+  });
+
   it('should call onRemoveTag when removing tags', () => {
     const tagId = 'SweetHome';
     const tags = [{id: tagId, label: 'Alabama'}];

src/MultiSelect/README.md

@@ -10,7 +10,7 @@
 | onChange | func | - | + | A callback function to be called when the input value changed|
 | value | string | - | - | The value of the current input |
 | onSelect | func | - | - | Callback function called whenever the user selects a single option or multiple options (with copy paste). The function receives array of values as an argument. |
-| onManuallyInput | func | noop | - | Callback when the user pressed the Enter key or Tab key after he wrote in the Input field - meaning the user selected something not in the list |
+| onManuallyInput | func | noop | - | Callback when the user pressed the Enter key or Tab key (or any given delimiter) after he wrote in the Input field - meaning the user selected something not in the list |
 | onRemoveTag | func | - | + | A callback function to be called when a tag should be removed|
 | tags | array of objects | - | + | The tags. tags are just set of selected suggestions|
 | placeholder | string | - | - | the placeholder for the input|