Bug of find element with empty attribute in v3.4

[hiz8]

Description

Hi.
After updating jQuery to 3.4, I encountered strange behavior on Edge and IE11.

Finding elements with empty attributes was successful in v3.3.
But, v3.4 and later will fail on Edge and IE11.

<div id="test">
    <input name="">
</div>

var $input = $("#test").find("[name='']");

console.log($input.length); // This will return 0, only on Edge and IE11 after updating to v3.4

Link to test case

https://jsbin.com/jitatiduqi/1/edit?html,css,js,output

If this is a bug, I'm glad if a fix is ​​considered.
Thanks.

[timmywil]

We should look into the behavior change, but it's not surprising as Edge and IE often fill in undefined attributes with empty string, making them difficult to differentiate.

[dmethvin]

Probably related to #3550

[mgol]

I added an update at #3550. @hirofumii can you check if your issue still exists with https://code.jquery.com/jquery-git.js instead of your current copy of jQuery?

[timmywil]

I checked this against jquery-git in IE11 on browserstack and it's still failing.

[timmywil]

Ok, I figured out the difference. It seems it's due to a recent optimization in Sizzle where we tried to avoid manipulating the DOM when it wasn't necessary. Turns out you get the right result if you add the ID of the context to the selector: https://jsbin.com/vasufuv/1/edit?html,js,console,output

[hiz8]

Thanks, @mgol.

I tested it in my environment just in case, but unfortunately the problem was not solved.
Apparently there is another cause (surely Sizzle?).

[timmywil]

@hirofumii See my comment above. It is indeed Sizzle.

[hiz8]

@timmywil Oh, sorry! I saw the comment and intended to add 😄, but not...

[mgol]

Sizzle PR: jquery/sizzle#450

EDIT: This wasn't a PR for this issue.

[mgol]

@timmywil Oh, that's weird that an ID would help here. Given that observation, should we just revert the optimization (both in Sizzle & jQuery master), adding a relevant unit test? After my recent PRs, all browsers except for IE & Edge don't get the temporary ID added in most cases and, as we see, IE/Edge may need it anyway.

Also, from what I see the patch at jquery/sizzle@71fe25c is not entirely correct as it skips the temporary ID for sibling selectors, pushing a selector with a leading combinator to qSA directly which crashes and goes to a slower Sizzle route.

[mgol]

I though about all this, my conclusions:

1. The workaround is worth to keep even for modern browsers as it avoids tokenizing in simple cases like elem.find( ".clazz1.clazz2" ) which are most likely the vast majority of what happens in the wild. Plus, the impact in IE is significant and that's a slow browser.
2. Prefixing with an ID selector is one way to work around the issue but it doesn't help for global selectors which we can't prefix and which don't work in IE/Edge as well.
3. One workaround I've found is adding to the document & immediately removing an input with an empty name; suddenly those selectors then work. The problem is how to write a support test for it - such a test would require adding a temporary input with an empty ID to documentElement & in my testing that fixes the issue in IE, making the test true... Perhaps we could accept that we'll only fix the issue in jQuery 4.0 where we can just apply the workaround in IE in setDocument() as we'll most likely drop EdgeHTML support in this version.

See a PR implementing that last suggestion: #4510

Let's talk it through at the next meeting.

[mgol]

It looks like applying the workaround once fixes it even for other frames and the workaround even survives browser refreshes. Therefore, we'll just apply it in all browsers unconditionally; hopefully that will resolve the issue.

Two PRs are available:

• to jQuery master (for jQuery 4.0): Selector: Make empty attribute selectors work in IE again #4510
• to Sizzle (for jQuery 3.5): Selector: Make empty attribute selectors work in IE 11/Edge again sizzle#461

[mgol]

Sizzle PR landed: jquery/sizzle#461.

Reopening as we still need to update Sizzle for this to be fixed in jQuery.

[mgol]

The fix for jQuery 4.0 landed in 05184cc. Re-opening as we still need to update Sizzle for jQuery 3.5.0.

[mgol]

Sizzle update merged in #4641. The issue is now fixed both on master & on 3.x-stable.