Comments (6)
@alissalkvc
the problem is the first character in your selector.
The '>' symbol, in CSS Selectors syntax, is the direct child combinator:
>input
this is in effect an invalid selector and I believe any browser will treat it the same.
In this case the selector is starting with the '>' symbol which makes it missing left context.
Try removing the '>' at the beginning or add '*' in front of it to make it a valid selector.
Try it in browsers and you will see they treat the selector as invalid.
I hope this help you fix the exact syntax for what you need.
from nwsapi.
@dperini
Hey! We've also started having this problem recently.
The fact is that we're not using it as a standalone selector. It's part of a :has
selector.
If we have, for example div:has(> span)
, we will only select divs that have an immediate child span
. This selector isn't marked as invalid.
from nwsapi.
@alissalkvc & @otaviomad
at first I didn't understand it was a selector inside an ':has()' pseudo.
Now I got that and I am going to check why that functionality was lost.
You told that it worked correctly in release 2.2.7 is that correct ?
from nwsapi.
@dperini
Indeed! Forcing it to 2.2.7 makes it work again.
(We're having this on our own components. I'm unsure whether this issue is also applicable to Material UI)
from nwsapi.
@otaviomad @alissalkvc
I tested that selector and it doesn't work.
The problem, as outlined above, is the direct child '>' which misses left context.
If you have different results please copy here the code snippet working with 2.2.7.
Is jsdom automatically adding context (left or right) to the query after it realizes the mangled content ?
from nwsapi.
It’s not quite as easy as just pasting when the code snippet works with 2.2.7 - the failure only happens when Jest tests are run using versions after 2.2.7. usually, I don’t see anything because tests are all passing, but with this error (anything over 2.2.7) I suddenly get errors like these:
‘’’
● Edit Recording Information › allows late dated date input
SyntaxError: '>input:-webkit-autofill' is not a valid selector
619 | </ThemeProvider>
620 | );
> 621 | render(testEditDates);
| ^
622 |
at emit (node_modules/nwsapi/src/nwsapi.js:576:17)
at _querySelectorAll (node_modules/nwsapi/src/nwsapi.js:1528:9)
at Object._querySelector [as first] (node_modules/nwsapi/src/nwsapi.js:1437:14)
at HTMLDivElementImpl.querySelector (node_modules/jsdom/lib/jsdom/living/nodes/ParentNode-impl.js:69:44)
at HTMLDivElement.querySelector (node_modules/jsdom/lib/jsdom/living/generated/Element.js:1046:58)
at Array.Resolver (eval at compile (node_modules/nwsapi/src/nwsapi.js:781:17), <anonymous>:3:136)
at match_assert (node_modules/nwsapi/src/nwsapi.js:1364:13)
at Object._matches [as match] (node_modules/nwsapi/src/nwsapi.js:1382:16)
at exports.matchesDontThrow (node_modules/jsdom/lib/jsdom/living/helpers/selectors.js:29:36)
at matches (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:50:10)
at node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:35:18
at Array.forEach (<anonymous>)
at handleSheet (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:26:13)
at Array.forEach (<anonymous>)
at Object.exports.forEachMatchingSheetRuleOfElement (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:46:11)
at getCascadedPropertyValue (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:62:11)
at getSpecifiedValue (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:80:19)
at getComputedValue (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:100:12)
at getSpecifiedValue (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:89:12)
at getComputedValue (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:100:12)
at exports.getResolvedValue (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:111:10)
at node_modules/jsdom/lib/jsdom/browser/Window.js:815:41
at Array.forEach (<anonymous>)
at Window.getComputedStyle (node_modules/jsdom/lib/jsdom/browser/Window.js:814:13)
at [node_modules/@mui/base/node/TextareaAutosize/TextareaAutosize.js:69:43](mailto:node_modules/@mui/base/node/TextareaAutosize/TextareaAutosize.js:69:43)
at [node_modules/@mui/base/node/TextareaAutosize/TextareaAutosize.js:117:28](mailto:node_modules/@mui/base/node/TextareaAutosize/TextareaAutosize.js:117:28)
at [node_modules/@mui/base/node/TextareaAutosize/TextareaAutosize.js:159:5](mailto:node_modules/@mui/base/node/TextareaAutosize/TextareaAutosize.js:159:5)
SyntaxError: '>input:-webkit-autofill' is not a valid selector
461 | expect(editButton).toBeTruthy();
462 | if (editButton) {
> 463 | userEvent.click(editButton);
| ^
464 | }
465 |
466 | // Assert that the radio buttons are displayed.
at emit (node_modules/nwsapi/src/nwsapi.js:576:17)
at _querySelectorAll (node_modules/nwsapi/src/nwsapi.js:1528:9)
at Object._querySelector [as first] (node_modules/nwsapi/src/nwsapi.js:1437:14)
at HTMLDivElementImpl.querySelector (node_modules/jsdom/lib/jsdom/living/nodes/ParentNode-impl.js:69:44)
at HTMLDivElement.querySelector (node_modules/jsdom/lib/jsdom/living/generated/Element.js:1046:58)
at Array.Resolver (eval at compile (node_modules/nwsapi/src/nwsapi.js:781:17), <anonymous>:3:136)
at match_assert (node_modules/nwsapi/src/nwsapi.js:1364:13)
at Object._matches [as match] (node_modules/nwsapi/src/nwsapi.js:1382:16)
at exports.matchesDontThrow (node_modules/jsdom/lib/jsdom/living/helpers/selectors.js:29:36)
at matches (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:50:10)
at node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:35:18
at Array.forEach (<anonymous>)
at handleSheet (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:26:13)
at Array.forEach (<anonymous>)
at Object.exports.forEachMatchingSheetRuleOfElement (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:46:11)
at getCascadedPropertyValue (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:62:11)
at getSpecifiedValue (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:80:19)
at getComputedValue (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:100:12)
at getSpecifiedValue (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:89:12)
at getComputedValue (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:100:12)
at exports.getResolvedValue (node_modules/jsdom/lib/jsdom/living/helpers/style-rules.js:111:10)
at node_modules/jsdom/lib/jsdom/browser/Window.js:815:41
at Array.forEach (<anonymous>)
at Window.getComputedStyle (node_modules/jsdom/lib/jsdom/browser/Window.js:814:13)
at [node_modules/@mui/base/node/TextareaAutosize/TextareaAutosize.js:69:43](mailto:node_modules/@mui/base/node/TextareaAutosize/TextareaAutosize.js:69:43)
at [node_modules/@mui/base/node/TextareaAutosize/TextareaAutosize.js:117:28](mailto:node_modules/@mui/base/node/TextareaAutosize/TextareaAutosize.js:117:28)
at [node_modules/@mui/base/node/TextareaAutosize/TextareaAutosize.js:159:5](mailto:node_modules/@mui/base/node/TextareaAutosize/TextareaAutosize.js:159:5)
‘’’
I’m not sure what changed in 2.2.8 that would have caused this selector to suddenly cause test failures?
from nwsapi.
Related Issues (20)
- The `:nth-child(even)` selector no longer works HOT 1
- Revert to v2.2.2 HOT 15
- Selector with escaped special characters gives SyntaxError
- :scope not working when the context has a class name that uses special characters HOT 3
- Child combinator `>` inside `:not()` is not a valid selector HOT 3
- Regression (2.2.8) surfaced by jsdom: `h1` is not a valid selector HOT 10
- Websites not working (`403` and `404`)
- v2.2.8 introduces SyntaxError: ':focus-visible' is not a valid selector HOT 6
- `SyntaxError: missing ) after argument list` due to missing escaping in `:has()` pseudo-class HOT 1
- h1 + h2 appears to break HOT 4
- New web platform test failures in 2.2.10 HOT 11
- policy violation nwsapi 2.2.10
- :active and :hover always returning true since 2.2.10 HOT 13
- '' is not a valid selector
- querySelector(<Tag>) is case-sensitive since 2.2.10 HOT 1
- :focus-visible not matched unless element has `autofocus` property set
- Some uses of `:has` throw "not a valid selector" HOT 1
- SyntaxError: '[inert] *):not([tabindex^="-"]):not(:disabled' is not a valid selector
- & nesting selector support?
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from nwsapi.