Fix lost input focus after remote search

public/assets/scripts/choices.js

@@ -1,4 +1,4 @@
-/*! choices.js v9.0.1 | © 2019 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
+/*! choices.js v9.0.1 | © 2020 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
 		module.exports = factory();
@@ -1603,6 +1603,7 @@ function () {
       this._addEventListeners();
 
       this.input.enable();
+      this.input.element.focus();
       this.containerOuter.enable();
     }
 
@@ -3577,7 +3578,7 @@ function () {
   };
 
   Choices.prototype._generatePlaceholderValue = function () {
-    if (this._isSelectElement) {
+    if (this._isSelectElement && this.passedElement.placeholderOption) {
       var placeholderOption = this.passedElement.placeholderOption;
       return placeholderOption ? placeholderOption.text : null;
     }

public/index.html

@@ -247,23 +247,6 @@ <h2>Multiple select input</h2>
           </optgroup>
         </select>
 
-        <p>
-          <small
-            >If the following example do not load, the Discogs rate limit has
-            probably been reached. Try again later!</small
-          >
-        </p>
-
-        <label for="choices-multiple-remote-fetch"
-          >Options from remote source (Fetch API) &amp; limited to 5</label
-        >
-        <select
-          class="form-control"
-          name="choices-multiple-remote-fetch"
-          id="choices-multiple-remote-fetch"
-          multiple
-        ></select>
-
         <label for="choices-multiple-rtl">Right-to-left</label>
         <select
           class="form-control"
@@ -618,18 +601,25 @@ <h2>Form interaction</h2>
           placeholder: true,
           placeholderValue: 'Pick an Strokes record',
           maxItemCount: 5,
-        }).setChoices(function() {
-          return fetch(
-            'https://api.discogs.com/artists/55980/releases?token=QBRmstCkwXEvCjTclCpumbtNwvVkEzGAdELXyRyW'
-          )
-            .then(function(response) {
-              return response.json();
-            })
-            .then(function(data) {
-              return data.releases.map(function(release) {
-                return { value: release.title, label: release.title };
+        });
+
+        var remoteSearchElement = document.querySelector(
+          '#choices-multiple-remote-fetch'
+        );
+        remoteSearchElement.addEventListener('search', function(event) {
+          multipleFetch.setChoices(function() {
+            return fetch(
+              'https://api.discogs.com/artists/55980/releases?token=QBRmstCkwXEvCjTclCpumbtNwvVkEzGAdELXyRyW'
+            )
+              .then(function(response) {
+                return response.json();
+              })
+              .then(function(data) {
+                return data.releases.map(function(release) {
+                  return { value: release.title, label: release.title };
+                });
               });
-            });
+          });
         });
 
         var multipleCancelButton = new Choices(

src/scripts/choices.ts

@@ -353,6 +353,7 @@ class Choices {
     if (this.containerOuter.isDisabled) {
       this._addEventListeners();
       this.input.enable();
+      this.input.element.focus();
       this.containerOuter.enable();
     }
 
@@ -627,7 +628,6 @@ class Choices {
     if (typeof choicesArrayOrFetcher === 'function') {
       // it's a choices fetcher function
       const fetcher = choicesArrayOrFetcher(this);
-
       if (typeof Promise === 'function' && fetcher instanceof Promise) {
         // that's a promise
         // eslint-disable-next-line compat/compat