diff --git a/src/js/select2/selection/search.js b/src/js/select2/selection/search.js index 353c5621..78997d3e 100644 --- a/src/js/select2/selection/search.js +++ b/src/js/select2/selection/search.js @@ -90,6 +90,12 @@ define([ } }); + this.$selection.on('click', '.select2-search--inline', function (evt) { + if (self.$search.val()) { + evt.stopPropagation(); + } + }); + // Try to detect the IE version should the `documentMode` property that // is stored on the document. This is only implemented in IE and is // slightly cleaner than doing a user agent check. diff --git a/tests/selection/search-tests.js b/tests/selection/search-tests.js index 43345d72..439b7ed6 100644 --- a/tests/selection/search-tests.js +++ b/tests/selection/search-tests.js @@ -188,4 +188,90 @@ test('the focus event shifts the focus', function (assert) { $search[0], 'The search did not have focus originally' ); +}); + +test('search box without text should propagate click', function (assert) { + assert.expect(1); + + 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); + + $selection.on('click', function () { + assert.ok(true, 'The click event should not have been trapped'); + }); + + var $search = $selection.find('input'); + $search.trigger('click'); +}); + +test('search box with text should not propagate click', function (assert) { + assert.expect(0); + + 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); + + $selection.on('click', function () { + assert.ok(false, 'The click event should have been trapped'); + }); + + var $search = $selection.find('input'); + $search.val('test'); + $search.trigger('click'); +}); + +test('search box with text should not close dropdown', function (assert) { + assert.expect(0); + + 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); + + container.on('close', function () { + assert.ok(false, 'The dropdown should not have closed'); + }); + + var $search = $selection.find('input'); + $search.val('test'); + $search.trigger('click'); }); \ No newline at end of file