Skip to content
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 pseudo-element specificity #154

Merged
merged 7 commits into from
Jun 12, 2019
Merged

Fix pseudo-element specificity #154

merged 7 commits into from
Jun 12, 2019

Conversation

parzh
Copy link

@parzh parzh commented May 4, 2019

See microsoft/vscode#72608 (comment) for a quick reference

In CSS3, pseudo-classes (such as :hover, :focus, or :invalid) and pseudo-elements (such as ::before, ::after etc.) have some noticeable differences:

  • pseudo-classes are more specific than pseudo-elements;
  • pseudo-classes are prefixed with :, while pseudo-elements start with :: (though for backwards compatibility this is not enforced);

Currently, they are being distinguished by amount of semicolons, which produces incorrect results when encountering backwards-compatible code:

image

Specificity here is expected to be (0, 0, 3), but got (0, 1, 2). That's because pseudo-element was incorrectly parsed as pseudo-class.

image

Here the number of colons (::) corresponds to the entity type (pseudo-element), so the specificity is displayed correctly.

This PR fixes this issue.

@msftclas
Copy link

msftclas commented May 4, 2019

CLA assistant check
All CLA requirements met.

@aeschli aeschli self-requested a review June 12, 2019 10:01
@aeschli aeschli merged commit 1f1a416 into microsoft:master Jun 12, 2019
@aeschli
Copy link
Contributor

aeschli commented Jun 12, 2019

Thanks @parzh . I modified the RP a bit in order to keep the changes minimal. I hope that's ok for you.

@aeschli aeschli added this to the June 2019 milestone Jun 12, 2019
@parzh
Copy link
Author

parzh commented Jun 12, 2019

@aeschli Thanks for the merge! Yes, that's fine.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants