-
-
Notifications
You must be signed in to change notification settings - Fork 4.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix: take snippets into account when scoping CSS #13589
Conversation
🦋 Changeset detectedLatest commit: 1b693c8 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
let element = context.state.element; | ||
|
||
while (element) { | ||
const selectors_to_check = selectors.slice(); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Can't we traverse backwards through the selectors?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Wdym? We're traversing them back to front. That's what the rest of the pruning algorithm does.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I mean a for loop with negative index rather copying the array and popping each item
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The result of pop isn't passed to anything, the resulting array that is one item less afterwards is. Looping with negative index wouldn't change the fact that we have to create a new array, if that's what you're concerned about (in fact we would have to create more since we'd have to do it for each iteration of the inner loop, rather of only each iteration of the outer loop)
Updated and finalized version of #10208.
The approach is to collect all render tags, then for each render tag both traverse up the elements and cut selectors from the end, until either no options left or a match is found. The assumption behind this is that the contents of the render tag would complete the selector.
There are ways to make this more strict (cutting a selector from the end only if the combinator still can match afterwards, check if we have snippets in the component and where they are rendered, etc), but the result will only mean more things pruned potentially, but no false negatives, so this is a good first iteration IMO.
Ideally merged after #13567/#13568 since it will result in some merge conflicts and this PR is far simpler to resolve the conflicts within
fixes #10143
Before submitting the PR, please make sure you do the following
feat:
,fix:
,chore:
, ordocs:
.Tests and linting
pnpm test
and lint the project withpnpm lint