In jQuery 3.4.0+ in IE a focus-blur-focus sequence doesn't leave the element focused #4856
Comments
mgol
added
Bug
Event
Discuss in Meeting
|
OK, the relevant UI test (dialog: core: focus tabbable): |
|
That's the assertion code that's failing: https://github.com/jquery/jquery-ui/blob/e31cf579a0f3e64250af2e7269eef2e6c6e3d8fb/tests/unit/dialog/core.js#L121-L129 |
mgol
added a commit
to mgol/jquery-ui
that referenced
this issue
Mar 11, 2021
In IE in jQuery 3.4+ a sequence: ```js $( inputNode ).trigger( "focus" ).trigger( "blur" ).trigger( "focus" ); ``` doesn't end up with a focused input. However, in this test we only want to check that the last focusedinput receives the focus back when `_focusTabbable()` is called which in reality doesn't happen so quickly so let's avoid the issue by waiting a bit. Ref jquery/jquery#4856
mgol
added a commit
to mgol/jquery-ui
that referenced
this issue
Mar 14, 2021
In IE in jQuery 3.4+ a sequence: ```js $( inputNode ).trigger( "focus" ).trigger( "blur" ).trigger( "focus" ); ``` doesn't end up with a focused input. However, in this test we only want to check that the last focused input receives the focus back when `_focusTabbable()` is called which in reality doesn't happen so quickly so let's avoid the issue by waiting a bit. Ref jquery/jquery#4856
This was referenced Mar 14, 2021
timmywil
removed
the
Discuss in Meeting
|
We'll look at addressing focus issues in 3.6.1. |
mgol
added a commit
to jquery/jquery-ui
that referenced
this issue
Mar 16, 2021
In IE in jQuery 3.4+ a sequence: ```js $( inputNode ).trigger( "focus" ).trigger( "blur" ).trigger( "focus" ); ``` doesn't end up with a focused input. However, in this test we only want to check that the last focused input receives the focus back when `_focusTabbable()` is called which in reality doesn't happen so quickly so let's avoid the issue by waiting a bit. Ref jquery/jquery#4856 Closes gh-1951
gibson042
added a commit
to gibson042/jquery
that referenced
this issue
Jun 11, 2021
gibson042
added a commit
to gibson042/jquery
that referenced
this issue
Jun 11, 2021
jwmerrill
added a commit
to desmosinc/mathquill
that referenced
this issue
Nov 12, 2021
jQuery 3.x has introduced a bunch of different focus bugs in the process of attempting to migrate to using native focus events in more cases, some of which remain unfixed in the latest version (3.6.0). Examples: * jquery/jquery#4859 * jquery/jquery#4856 * jquery/jquery#4950 * jquery/jquery#4867 Some unknown bug in this general class can make it so that Mathquill public api focus calls stop working because using jQuery to programatically trigger focus breaks. Work around this by switching to triggering native focus events instead of jQuery focus events.
jwmerrill
added a commit
to desmosinc/mathquill
that referenced
this issue
Nov 16, 2021
jQuery 3.x has introduced a bunch of different focus bugs in the process of attempting to migrate to using native focus events in more cases, some of which remain unfixed in the latest version (3.6.0). Examples: * jquery/jquery#4859 * jquery/jquery#4856 * jquery/jquery#4950 * jquery/jquery#4867 Some unknown bug in this general class can make it so that Mathquill public api focus calls stop working because using jQuery to programatically trigger focus breaks. Work around this by switching to triggering native focus events instead of jQuery focus events.
gibson042
added a commit
to gibson042/jquery
that referenced
this issue
Jan 24, 2022
gibson042
added a commit
to gibson042/jquery
that referenced
this issue
Jan 24, 2022
3 tasks
3 tasks
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 13, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronouslu. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Also, simplify `leverageNative` - With IE now using `focusin` to simulate `focus` and `focusout` to simulate `blur`, we don't have to deal with async events in `leverageNative`. Fixes jquerygh-4856 Fixes jquerygh-4859
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 13, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronouslu. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Fixes jquerygh-4856 Fixes jquerygh-4859
3 tasks
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 14, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronouslu. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Fixes jquerygh-4856 Fixes jquerygh-4859
|
It looks like we can fix this via simulating the async PRs for: |
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 14, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronouslu. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Fixes jquerygh-4856 Fixes jquerygh-4859
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 14, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronouslu. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Fixes jquerygh-4856 Fixes jquerygh-4859
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 14, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronouslu. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Fixes jquerygh-4856 Fixes jquerygh-4859
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 14, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronously. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Fixes jquerygh-4856 Fixes jquerygh-4859
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 14, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronously. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Fixes jquerygh-4856 Fixes jquerygh-4859
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 15, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronously. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Fixes jquerygh-4856 Fixes jquerygh-4859
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 15, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronously. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Fixes jquerygh-4856 Fixes jquerygh-4859
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 17, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronously. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Fixes jquerygh-4856 Fixes jquerygh-4859 Fixes jquerygh-4950
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 17, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronously. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Fixes jquerygh-4856 Fixes jquerygh-4859 Fixes jquerygh-4950
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 20, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronously. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Fixes jquerygh-4856 Fixes jquerygh-4859 Fixes jquerygh-4950
mgol
added a commit
to mgol/jquery
that referenced
this issue
Mar 20, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronously. In other browsers, all those handlers are fired synchronously. Simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. Fixes jquerygh-4856 Fixes jquerygh-4859 Fixes jquerygh-4950
mgol
added a commit
that referenced
this issue
Mar 27, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronously. In other browsers, all those handlers are fired synchronously. Asynchronous behavior of these handlers in IE caused issues for IE (gh-4856, gh-4859). We now simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. This also let us simplify some tests. This commit also simplifies `leverageNative` - with IE now using `focusin` to simulate `focus` and `focusout` to simulate `blur`, we don't have to deal with async events in `leverageNative`. This also fixes broken `focus` triggers after first triggering it on a hidden element - previously, `leverageNative` assumed that the native `focus` handler not firing after calling the native `focus` method meant it would be handled later, asynchronously, which was not the case (gh-4950). Fixes gh-4856 Fixes gh-4859 Fixes gh-4950 Closes gh-5223 Co-authored-by: Richard Gibson <richard.gibson@gmail.com>
mgol
added a commit
that referenced
this issue
Mar 27, 2023
In IE (all versions), `focus` & `blur` handlers are fired asynchronously but `focusin` & `focusout` are run synchronously. In other browsers, all those handlers are fired synchronously. Asynchronous behavior of these handlers in IE caused issues for IE (gh-4856, gh-4859). We now simulate `focus` via `focusin` & `blur` via `focusout` in IE to avoid these issues. This also let us simplify some tests. This commit also simplifies `leverageNative` - with IE now using `focusin` to simulate `focus` and `focusout` to simulate `blur`, we don't have to deal with async events in `leverageNative`. This also fixes broken `focus` triggers after first triggering it on a hidden element - previously, `leverageNative` assumed that the native `focus` handler not firing after calling the native `focus` method meant it would be handled later, asynchronously, which was not the case (gh-4950). To preserve relative `focusin`/`focus` & `focusout`/`blur` event order guaranteed on the 3.x branch, attach a single handler for both events in IE. A side effect of this is that to reduce size the `event/focusin` module no longer exists and it's impossible to disable the `focusin` patch in modern browsers via the jQuery custom build system. Fixes gh-4856 Fixes gh-4859 Fixes gh-4950 Ref gh-5223 Closes gh-5224 Co-authored-by: Richard Gibson <richard.gibson@gmail.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
and others
Description
Invoking:
leaves input focused in all browsers except IE.
I discovered it while working to fix the remaining jQuery UI issues when tested against Core 3.6.0+. Interestingly, the relevant UI issue doesn't manifest itself in 3.4 & 3.5, I'm not sure why.
A relevant UI test run: http://swarm.jquery.org/result/3963629. That's the "dialog: core: focus tabbable" test.
Link to test case
https://jsbin.com/zoyowez/1/edit?html,js,output
Changing the jQuery version to 3.3.1 makes it work again.
The text was updated successfully, but these errors were encountered: