Skip to main content
A Frehner Site

Fixing Container Queries Part 2

The story continues #

Last time I wrote, I mentioned that there was still some clarity to be gained in the specification about whether named container queries cross the shadow DOM or not.

The good news was that the CSSWG resolved on this fairly quickly, and decided that container names do cross the shadow DOM! But this is only the beginning of the work needed to get this implemented.

Specification update #

Just because the CSSWG resolved on an outcome doesn't mean it's in the specification yet. Thankfully, Rune Lillesveen quickly created a PR to the CSS spec that was merged just as quickly. Step 1 done!

WPT updates #

Next, Web Platform Tests (WPTs) needed to be updated to help ensure that various browsers implement this behavior consistently. I created a PR in the WPT repo to update some of the tests, and Rune updated other tests through his work in Chromium.

WebKit updates #

With the WPT updates merged, it's actually a two-step process to update WebKit from here; first, I needed to update WebKit to pull in the latest WPTs.

Finally, with the WPTs imported, I could now update WebKit's implementation against them to ensure WebKit matched the spec.

Additional good news? Chromium has already been updated by Rune, and Firefox already behaved this way, so cross-browser support for this tweak to the specification is going to be incredibly fast!

Final notes #

Throughout the process of contributing to WebKit, I needed to keep referring to my notes on how to do certain things or find specific docs. Since I'm not frequently working in WebKit, it's hard for me to keep track of these things, so I made a page of notes for myself for future reference.