Skip to content

fix(formatter_css): preserve placeholder pseudo selectors#23983

Closed
scttcper wants to merge 1 commit into
oxc-project:mainfrom
scttcper:scttcper/placeholder-pseudo-selectors
Closed

fix(formatter_css): preserve placeholder pseudo selectors#23983
scttcper wants to merge 1 commit into
oxc-project:mainfrom
scttcper:scttcper/placeholder-pseudo-selectors

Conversation

@scttcper

@scttcper scttcper commented Jun 30, 2026

Copy link
Copy Markdown

For css-in-js ${Component}:hover & and ${Component}:after should keep the pseudo attached instead of becoming a descendant selector.

this diff shows the before/after this change. Used codex to generate this pr since i'm not a rust person, but we have a surprising number of these in our Sentry frontend.

-`PLACEHOLDER-7` :hover &,
+`PLACEHOLDER-7`:hover &,
 `PLACEHOLDER-8`:focus-within &, `PLACEHOLDER-9`:after {
   color: red;
 }

css-in-js placeholder selectors like `${Component}:hover &` could get split into a placeholder statement plus a rule, and the sequence printer inserted a space before the pseudo selector.

Print that zero-gap placeholder/rule pair together so the pseudo stays attached, with fixture coverage for pseudo-class and pseudo-element selectors.

Co-Authored-By: OpenAI Codex <noreply@openai.com>
@scttcper scttcper changed the title fix(formatter_css): Preserve placeholder pseudo selectors fix(formatter_css): preserve placeholder pseudo selectors Jun 30, 2026
@scttcper scttcper marked this pull request as ready for review June 30, 2026 15:23
@scttcper scttcper requested a review from leaysgur as a code owner June 30, 2026 15:23
@TheAlexLichter TheAlexLichter added the A-formatter-prettier-diff Area - Formatter difference with Prettier label Jun 30, 2026
@graphite-app graphite-app Bot closed this in e0b35a1 Jul 1, 2026
@leaysgur

leaysgur commented Jul 1, 2026

Copy link
Copy Markdown
Member

After investigation, I realised that this was a problem on the parser’s side, so I've made the fix in #23974.

In any case, thank you for your time~!

camc314 pushed a commit that referenced this pull request Jul 3, 2026
Fixes #23969, closes #23983.

Notably `oxc-css-parser@0.0.3` contains:

- partial `postcss-simple-vars` support
- fix glued css-in-js placeholder (`${C}:hover &`)

As `oxc_allocator` has also been added as a dependency in `oxc-css-parser`, this has caused a conflict with the latest local (workspace) instance, so a `patch.crates-io` section has also been added. Apparently, this is a technique also used in [Tokio](https://github.com/tokio-rs/tokio/blob/master/Cargo.toml#L18-L23).
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

A-formatter-prettier-diff Area - Formatter difference with Prettier

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants