From ca0fd7c195655ad4ef5906f8ed3f2c1c6a65da1d Mon Sep 17 00:00:00 2001 From: Kevin Brown Date: Mon, 9 Nov 2015 17:33:08 -0500 Subject: [PATCH] Properly disable `input` handlers in IE Previously we were only disabling the `input` handler when it was triggered, which caused a race condition within the `keyup` handlers which also was triggered by the `input` event. This fixes the issue by also unbinding the `input` handlers within the `keyup` handler, to avoid running into the race condition. Thanks to @Eckankar for pointing out the race condition that still existed in https://github.com/select2/select2/commit/66ae2ad1d5a5b6c983b17a342550c61d9cd15a82 This closes https://github.com/select2/select2/issues/3300 --- src/js/select2/selection/search.js | 25 +++++++++++++++++-------- 1 file changed, 17 insertions(+), 8 deletions(-) diff --git a/src/js/select2/selection/search.js b/src/js/select2/selection/search.js index 8fa2ef0b..92808a68 100644 --- a/src/js/select2/selection/search.js +++ b/src/js/select2/selection/search.js @@ -85,6 +85,14 @@ define([ } }); + // 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. + // This property is not available in Edge, but Edge also doesn't have + // this bug. + var msie = document.documentMode; + var disableInputEvents = msie && msie <= 11; + // Workaround for browsers which do not support the `input` event // This will prevent double-triggering of events for browsers which support // both the `keyup` and `input` events. @@ -92,17 +100,10 @@ define([ 'input.searchcheck', '.select2-search--inline', function (evt) { - // 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. - // This property is not available in Edge, but Edge also doesn't have - // this bug. - var msie = document.documentMode; - // IE will trigger the `input` event when a placeholder is used on a // search box. To get around this issue, we are forced to ignore all // `input` events in IE and keep using `keyup`. - if (msie && msie <= 11) { + if (disableInputEvents) { self.$selection.off('input.search input.searchcheck'); return; } @@ -116,6 +117,14 @@ define([ 'keyup.search input.search', '.select2-search--inline', function (evt) { + // IE will trigger the `input` event when a placeholder is used on a + // search box. To get around this issue, we are forced to ignore all + // `input` events in IE and keep using `keyup`. + if (disableInputEvents && evt.type === 'input') { + self.$selection.off('input.search input.searchcheck'); + return; + } + var key = evt.which; // We can freely ignore events from modifier keys