mirror of
https://github.com/jquery/sizzle.git
synced 2025-12-28 04:43:44 +00:00
Selector: Stop relying on CSS.supports( "selector(...)" )
`CSS.supports( "selector(...)" )` has different semantics than selectors passed to `querySelectorAll`. Apart from the fact that the former returns `false` for unrecognized selectors and the latter throws, `qSA` is more forgiving and accepts some invalid selectors, auto-correcting them where needed - for example, mismatched brackers are auto-closed. This behavior difference is breaking for many users. To add to that, a recent CSSWG resolution made `:is()` & `:where()` the only pseudos with forgiving parsing; browsers are in the process of making `:has()` parsing unforgiving. Taking all that into account, we go back to our previous try-catch approach without relying on `CSS.supports( "selector(...)" )`. The only difference is we detect forgiving parsing in `:has()` and mark the selector as buggy. Fixes jquery/jquery#5194 Closes gh-493 Ref jquery/jquery#5098 Ref jquery/jquery#5206 Ref jquery/jquery#5207 Ref gh-486 Ref w3c/csswg-drafts#7676
This commit is contained in:
parent
248b59c008
commit
15a1238f51
@ -356,27 +356,6 @@ function Sizzle( selector, context, results, seed ) {
|
||||
}
|
||||
|
||||
try {
|
||||
|
||||
// `qSA` may not throw for unrecognized parts using forgiving parsing:
|
||||
// https://drafts.csswg.org/selectors/#forgiving-selector
|
||||
// like the `:has()` pseudo-class:
|
||||
// https://drafts.csswg.org/selectors/#relational
|
||||
// `CSS.supports` is still expected to return `false` then:
|
||||
// https://drafts.csswg.org/css-conditional-4/#typedef-supports-selector-fn
|
||||
// https://drafts.csswg.org/css-conditional-4/#dfn-support-selector
|
||||
if ( support.cssSupportsSelector &&
|
||||
|
||||
// eslint-disable-next-line no-undef
|
||||
!CSS.supports( "selector(:is(" + newSelector + "))" ) ) {
|
||||
|
||||
// Support: IE 11+
|
||||
// Throw to get to the same code path as an error directly in qSA.
|
||||
// Note: once we only support browser supporting
|
||||
// `CSS.supports('selector(...)')`, we can most likely drop
|
||||
// the `try-catch`. IE doesn't implement the API.
|
||||
throw new Error();
|
||||
}
|
||||
|
||||
push.apply( results,
|
||||
newContext.querySelectorAll( newSelector )
|
||||
);
|
||||
@ -672,29 +651,22 @@ setDocument = Sizzle.setDocument = function( node ) {
|
||||
!el.querySelectorAll( ":scope fieldset div" ).length;
|
||||
} );
|
||||
|
||||
// Support: Chrome 105+, Firefox 104+, Safari 15.4+
|
||||
// Make sure forgiving mode is not used in `CSS.supports( "selector(...)" )`.
|
||||
//
|
||||
// `:is()` uses a forgiving selector list as an argument and is widely
|
||||
// implemented, so it's a good one to test against.
|
||||
support.cssSupportsSelector = assert( function() {
|
||||
/* eslint-disable no-undef */
|
||||
|
||||
return CSS.supports( "selector(*)" ) &&
|
||||
|
||||
// Support: Firefox 78-81 only
|
||||
// In old Firefox, `:is()` didn't use forgiving parsing. In that case,
|
||||
// fail this test as there's no selector to test against that.
|
||||
// `CSS.supports` uses unforgiving parsing
|
||||
document.querySelectorAll( ":is(:jqfake)" ) &&
|
||||
|
||||
// `*` is needed as Safari & newer Chrome implemented something in between
|
||||
// for `:has()` - it throws in `qSA` if it only contains an unsupported
|
||||
// argument but multiple ones, one of which is supported, are fine.
|
||||
// We want to play safe in case `:is()` gets the same treatment.
|
||||
!CSS.supports( "selector(:is(*,:jqfake))" );
|
||||
|
||||
/* eslint-enable */
|
||||
// Support: Chrome 105 - 110+, Safari 15.4 - 16.3+
|
||||
// Make sure the the `:has()` argument is parsed unforgivingly.
|
||||
// We include `*` in the test to detect buggy implementations that are
|
||||
// _selectively_ forgiving (specifically when the list includes at least
|
||||
// one valid selector).
|
||||
// Note that we treat complete lack of support for `:has()` as if it were
|
||||
// spec-compliant support, which is fine because use of `:has()` in such
|
||||
// environments will fail in the qSA path and fall back to jQuery traversal
|
||||
// anyway.
|
||||
support.cssHas = assert( function() {
|
||||
try {
|
||||
document.querySelector( ":has(*,:jqfake)" );
|
||||
return false;
|
||||
} catch ( e ) {
|
||||
return true;
|
||||
}
|
||||
} );
|
||||
|
||||
/* Attributes
|
||||
@ -963,14 +935,14 @@ setDocument = Sizzle.setDocument = function( node ) {
|
||||
} );
|
||||
}
|
||||
|
||||
if ( !support.cssSupportsSelector ) {
|
||||
if ( !support.cssHas ) {
|
||||
|
||||
// Support: Chrome 105+, Safari 15.4+
|
||||
// `:has()` uses a forgiving selector list as an argument so our regular
|
||||
// `try-catch` mechanism fails to catch `:has()` with arguments not supported
|
||||
// natively like `:has(:contains("Foo"))`. Where supported & spec-compliant,
|
||||
// we now use `CSS.supports("selector(:is(SELECTOR_TO_BE_TESTED))")`, but
|
||||
// outside that we mark `:has` as buggy.
|
||||
// Support: Chrome 105 - 110+, Safari 15.4 - 16.3+
|
||||
// Our regular `try-catch` mechanism fails to detect natively-unsupported
|
||||
// pseudo-classes inside `:has()` (such as `:has(:contains("Foo"))`)
|
||||
// in browsers that parse the `:has()` argument as a forgiving selector list.
|
||||
// https://drafts.csswg.org/selectors/#relational now requires the argument
|
||||
// to be parsed unforgivingly, but browsers have not yet fully adjusted.
|
||||
rbuggyQSA.push( ":has" );
|
||||
}
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user