Skip to content

fix selector ordering with pseudo elements #383

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

Conversation

romainmenke
Copy link
Member

fixes : #382

Comment on lines +10 to +13
assert.deepEqual(calculate(':before'), { a: 0, b: 0, c: 1 });
assert.deepEqual(calculate('::before'), { a: 0, b: 0, c: 1 });

assert.deepEqual(calculate(':focus'), { a: 0, b: 1, c: 0 });
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This package lacked sufficient coverage for pseudo elements vs classes.

@@ -67,9 +67,6 @@ function selectorTypeOrder(selector, type) {
return selectorTypeOrderIndex.pseudoElement;
}

if (type === 'pseudo' && selector && selector.indexOf('::') === 0) {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

selectorParser.isPseudoElement(selector) on line 66 expects a Node and this didn't work before because it was a string.

This code on line 70 was insufficient but did work with strings.

Same change in all other plugins with similar logic.

@@ -22,7 +22,7 @@ const creator: PluginCreator<pluginOptions> = (opts?: pluginOptions) => {

return {
postcssPlugin: 'postcss-cascade-layers',
Once(root: Container, { result }: { result: Result }) {
OnceExit(root: Container, { result }: { result: Result }) {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

see : #374

This change will likely be merged and released before we can add it to preset-env so adding it here as it is an obvious improvement.

@Antonio-Laguna
Copy link
Member

Awesome work! Getting this out !

@Antonio-Laguna Antonio-Laguna merged commit 3951989 into main May 17, 2022
@Antonio-Laguna Antonio-Laguna deleted the fix-selector-order-with-pseudo-elements--adaptable-poodle-b1b3b6894b branch May 17, 2022 04:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[postcss-cascade-layers] :not() selector order conflicts with pseudo elements
2 participants