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

feat(css_formatter): automatically downcase all keywords and regular identifiers #1354

Merged
merged 1 commit into from
Dec 28, 2023

Conversation

faultyserver
Copy link
Contributor

Summary

Dependent on #1353. This PR starts automatically writing all keywords and regular identifiers in lowercase. By definition in the spec, this should be a safe transformation, but only because we now distinguish between regular and custom/dashed identifiers (the latter are case sensitive). The one apparent exception that I've found, @page rule names, is also parsed using a CssCustomIdentifier, ensuring that it preserves casing, even though the spec uses a regular <ident> and just states "this one's case sensitive".

This behavior is similar to what Prettier does, but actually a lot more consistent. Prettier does not downcase type selectors, attribute selectors, value definitions, and other things, even though they are explicitly defined as case-insensitive. Biome's behavior after this PR will be an intentional deviation from Prettier, and once we get to Prettier compatibility testing, I'll be sure to add a note about it there. For example:

/* input */
DIV.aClassName[Class=Something] {
  COLOR: White;
}

/* Prettier */
DIV.aClassName[Class="Something"] {
    color: White;
}

/* Biome */
div.aClassName[class="Something"] {
  color: white;
}

Biome's result ensures a much more consistent output while still preserving all of the actually-sensitive values: the class name and attribute matcher value in this example.

Test Plan

Added a new test specifically for testing the different casing situations, and all of the other spec tests have updated with the downcasing now.

Copy link

netlify bot commented Dec 28, 2023

Deploy Preview for biomejs ready!

Name Link
🔨 Latest commit c064915
🔍 Latest deploy log https://app.netlify.com/sites/biomejs/deploys/658dc2f98544880008b4fe24
😎 Deploy Preview https://deploy-preview-1354--biomejs.netlify.app/playground
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
1 paths audited
Performance: 100 (no change from production)
Accessibility: 97 (no change from production)
Best Practices: 100 (no change from production)
SEO: 93 (no change from production)
PWA: -
View the detailed breakdown and full score reports

To edit notification comments on pull requests, go to your Netlify site configuration.

@faultyserver faultyserver changed the base branch from main to faulty/css-idents December 28, 2023 00:27
@github-actions github-actions bot added A-Formatter Area: formatter L-CSS Language: CSS L-JSON Language: JSON and super languages labels Dec 28, 2023
@faultyserver faultyserver mentioned this pull request Dec 28, 2023
11 tasks
Copy link
Contributor

Parser conformance results on

js/262

Test result main count This PR count Difference
Total 49701 49701 0
Passed 48721 48721 0
Failed 980 980 0
Panics 0 0 0
Coverage 98.03% 98.03% 0.00%

jsx/babel

Test result main count This PR count Difference
Total 40 40 0
Passed 37 37 0
Failed 3 3 0
Panics 0 0 0
Coverage 92.50% 92.50% 0.00%

symbols/microsoft

Test result main count This PR count Difference
Total 6322 6322 0
Passed 2036 2036 0
Failed 4286 4286 0
Panics 0 0 0
Coverage 32.20% 32.20% 0.00%

ts/babel

Test result main count This PR count Difference
Total 662 662 0
Passed 592 592 0
Failed 70 70 0
Panics 0 0 0
Coverage 89.43% 89.43% 0.00%

ts/microsoft

Test result main count This PR count Difference
Total 17646 17646 0
Passed 13452 13452 0
Failed 4192 4192 0
Panics 2 2 0
Coverage 76.23% 76.23% 0.00%

Base automatically changed from faulty/css-idents to main December 28, 2023 12:18
…identifiers

Add spec test for casing

update with page at-rule custom identifier usage

no need for default

js->css
@faultyserver faultyserver merged commit b99e785 into main Dec 28, 2023
18 checks passed
@faultyserver faultyserver deleted the faulty/css-downcasing branch December 28, 2023 19:07
@Conaclos Conaclos added the A-Changelog Area: changelog label Jan 7, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
A-Changelog Area: changelog A-Formatter Area: formatter L-CSS Language: CSS L-JSON Language: JSON and super languages
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants