Skip to content

fix(css): Merge duplicate nested at-rules#1917

Open
KSHITIZ6341 wants to merge 1 commit into
atlassian-labs:masterfrom
KSHITIZ6341:fix/1847-nested-at-rule-dedup
Open

fix(css): Merge duplicate nested at-rules#1917
KSHITIZ6341 wants to merge 1 commit into
atlassian-labs:masterfrom
KSHITIZ6341:fix/1847-nested-at-rule-dedup

Conversation

@KSHITIZ6341

Copy link
Copy Markdown

What is this change?

Merges duplicate children recursively when equivalent at-rules are nested, so repeated declarations under the same conditional scopes are emitted once.

Credit to @michaelabrahamian for providing the nested at-rule reproduction and expected output.

Fixes #1847

Why are we making this change?

mergeDuplicateAtRules merged matching top-level containers but treated each nested at-rule as an opaque serialized child. When nested blocks differed by even one declaration, both survived deduplication and produced redundant CSS.

How are we making this change?

The plugin now merges equivalent sibling at-rules at each nesting level, deduplicates their children, and then recurses into the merged container. Matching remains scoped to the current parent, non-atomic cssMapScoped rules remain untouched, and existing top-level ordering is preserved.

A patch changeset for @compiled/css is included.

Validation:

  • yarn test packages/css/src/plugins/__tests__/merge-duplicate-at-rules.test.ts --runInBand (6 tests)
  • yarn test packages/css --runInBand (297 tests, 219 snapshots)
  • yarn test --runInBand (5,132 tests, 436 snapshots)
  • yarn lint
  • yarn prettier:check
  • yarn build
  • Repository pre-commit hook

Not run: visual regression tests, because this change operates on deterministic PostCSS output and has no rendered component changes.


PR checklist

Do not delete me!

I have...

  • Updated or added applicable tests
  • Updated the documentation in website/ (not required; no API or configuration change)
  • Added a changeset (if making any changes that affect Compiled behavior)

@changeset-bot

changeset-bot Bot commented Jul 11, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 53068dc

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
@compiled/css Patch

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

@atlassian-cla-bot

atlassian-cla-bot Bot commented Jul 11, 2026

Copy link
Copy Markdown

Hooray! All contributors have signed the CLA.

@netlify

netlify Bot commented Jul 11, 2026

Copy link
Copy Markdown

Deploy Preview for compiled-css-in-js canceled.

Name Link
🔨 Latest commit 53068dc
🔍 Latest deploy log https://app.netlify.com/projects/compiled-css-in-js/deploys/6a52a6ce90bebb0008bcc38c

Comment thread packages/css/src/plugins/__tests__/merge-duplicate-at-rules.test.ts
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.

Duplicate styles in nested at-rules are not merged

2 participants