Robin Malfait 73628f69f3

Fix Safari devtools issues because of nested @supports at-rules without normal rule (#19069) ...

This PR fixes a weird Safari rendering bug in the devtools. This seems
to be happening when using `@supports`, especially nested `@supports`
at-rules.

The issue is that our color-mix fallback generates declarations directly
in `@supports` at-rules which causes the weird rendering bug in Safari.

Adding this intermediate `&` rule seems to fix the issue.

This is a workaround for a browser bug, but the additional 3 characters
shouldn't be the end of the world.

## Test plan

1. Updated the tests with the new `& { }` intermediate rule
2. Other tests still pass as expected

| Before | After |
| --- | --- |
| <img width="450" height="549" alt="image"
src="https://github.com/user-attachments/assets/4b51fb93-8073-4414-8139-dec75e6bc086"
/> | <img width="448" height="548" alt="image"
src="https://github.com/user-attachments/assets/1016af67-c1eb-43dc-9554-158e7e2264c4"
/> |

Fixes: #19065

[ci-all]

2025-10-06 20:04:40 +02:00

..

config.test.ts

Improve integration tests (stability + performance) (#15125)

2024-12-12 13:48:56 +01:00

index.test.ts

Fix Safari devtools issues because of nested @supports at-rules without normal rule (#19069)

2025-10-06 20:04:40 +02:00

plugins.test.ts

Use amount of properties when sorting (#16715)

2025-02-21 15:02:07 +01:00

standalone.test.ts

Make JS APIs available to plugins and configs in the Standalone CLI (#15934)

2025-02-25 13:21:46 +01:00