Skip to content

Commit ca0fd7c

Browse files
committed
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 select2@66ae2ad This closes select2#3300
1 parent 6be96cf commit ca0fd7c

1 file changed

Lines changed: 17 additions & 8 deletions

File tree

src/js/select2/selection/search.js

Lines changed: 17 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -85,24 +85,25 @@ define([
8585
}
8686
});
8787

88+
// Try to detect the IE version should the `documentMode` property that
89+
// is stored on the document. This is only implemented in IE and is
90+
// slightly cleaner than doing a user agent check.
91+
// This property is not available in Edge, but Edge also doesn't have
92+
// this bug.
93+
var msie = document.documentMode;
94+
var disableInputEvents = msie && msie <= 11;
95+
8896
// Workaround for browsers which do not support the `input` event
8997
// This will prevent double-triggering of events for browsers which support
9098
// both the `keyup` and `input` events.
9199
this.$selection.on(
92100
'input.searchcheck',
93101
'.select2-search--inline',
94102
function (evt) {
95-
// Try to detect the IE version should the `documentMode` property that
96-
// is stored on the document. This is only implemented in IE and is
97-
// slightly cleaner than doing a user agent check.
98-
// This property is not available in Edge, but Edge also doesn't have
99-
// this bug.
100-
var msie = document.documentMode;
101-
102103
// IE will trigger the `input` event when a placeholder is used on a
103104
// search box. To get around this issue, we are forced to ignore all
104105
// `input` events in IE and keep using `keyup`.
105-
if (msie && msie <= 11) {
106+
if (disableInputEvents) {
106107
self.$selection.off('input.search input.searchcheck');
107108
return;
108109
}
@@ -116,6 +117,14 @@ define([
116117
'keyup.search input.search',
117118
'.select2-search--inline',
118119
function (evt) {
120+
// IE will trigger the `input` event when a placeholder is used on a
121+
// search box. To get around this issue, we are forced to ignore all
122+
// `input` events in IE and keep using `keyup`.
123+
if (disableInputEvents && evt.type === 'input') {
124+
self.$selection.off('input.search input.searchcheck');
125+
return;
126+
}
127+
119128
var key = evt.which;
120129

121130
// We can freely ignore events from modifier keys

0 commit comments

Comments
 (0)