Add test for 698fe7b

kevin-brown · kevin-brown · commit 88503d2c67dc · 2015-06-21T21:42:06.000-04:00
This adds the test that ensures that the search focus is still
focused, even after the selection is updated (for whatever reason).
Note that we are not triggering the `change` event here, and are
instead just re-calling `update` on the selection adapter. This is
because we do not bind the `change` event in tests, so the selection
is never re-rendered and the tests will pass. The `update` method
is triggered during the `change` cycle anyway, so this has the
same effect while supporting cases where the selection is re-rendered
without the selected values changing.
diff --git a/tests/selection/search-tests.js b/tests/selection/search-tests.js
@@ -0,0 +1,51 @@
+module('Selection containers - Inline search');
+
+var MultipleSelection = require('select2/selection/multiple');
+var InlineSearch = require('select2/selection/search');
+
+var $ = require('jquery');
+var Options = require('select2/options');
+var Utils = require('select2/utils');
+
+var options = new Options({});
+
+test('updating selection does not shift the focus', function (assert) {
+  var $container = $('#qunit-fixture .event-container');
+  var container = new MockContainer();
+
+  var CustomSelection = Utils.Decorate(MultipleSelection, InlineSearch);
+
+  var $element = $('#qunit-fixture .multiple');
+  var selection = new CustomSelection($element, options);
+
+  var $selection = selection.render();
+  selection.bind(container, $container);
+
+  // Update the selection so the search is rendered
+  selection.update([]);
+
+  // Make it visible so the browser can place focus on the search
+  $container.append($selection);
+
+  var $search = $selection.find('input');
+  $search.trigger('focus');
+
+  assert.equal($search.length, 1, 'The search was not visible');
+
+  assert.equal(
+    document.activeElement,
+    $search[0],
+    'The search did not have focus originally'
+  );
+
+  // Trigger an update, this should redraw the search box
+  selection.update([]);
+
+  assert.equal($search.length, 1, 'The search box disappeared');
+
+  assert.equal(
+    document.activeElement,
+    $search[0],
+    'The search did not have focus after the selection was updated'
+  );
+});
diff --git a/tests/unit.html b/tests/unit.html
@@ -79,6 +79,7 @@
     <script src="selection/containerCss-tests.js" type="text/javascript"></script>
     <script src="selection/multiple-tests.js" type="text/javascript"></script>
     <script src="selection/placeholder-tests.js" type="text/javascript"></script>
+    <script src="selection/search-tests.js" type="text/javascript"></script>
     <script src="selection/single-tests.js" type="text/javascript"></script>
     <script src="selection/stopPropagation-tests.js" type="text/javascript"></script>
 
