1669600 - An empty CSS min-width media query causes following media queries not to be applied on browser window resize

Status: VERIFIED FIXED

(Core :: CSS Parsing and Computation, defect)

Description

[Ben]

Attachment: test.html

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:81.0) Gecko/20100101 Firefox/81.0

Steps to reproduce:

Create an html page with a single <div> element and the following CSS styles:
div {background: #000; width: 50px; height: 50px; margin: auto;}
@media (min-width: 1200px) {}
@media (max-width: 767px) {div {float: left;}}

Actual results:

The <div> element remains central when the browser window is resized to be smaller than 768px.

Expected results:

The <div> element should be floated left when the browser window is resized to be smaller than 768px - this expected behaviour does occur when the empty "@media (min-width: 1200px) {}" media query is removed or populated with css rules

Comment 1

[Emilio Cobos Álvarez [:emilio]]

Huh, this is an odd one.

Comment 2

[Emilio Cobos Álvarez [:emilio]]

This was regressed by bug 1655751. Thanks for filing!

Comment 3

[Emilio Cobos Álvarez [:emilio]]

Attachment: Bug 1669600 - Properly distinguish between empty children and no children in rule iterator. r=#style

So that skip_children(), which just pops the stack and is used by the
dynamic media query evaluation code, works as it should.

Comment 4

[Emilio Cobos Álvarez [:emilio]]

Comment on attachment 9180091 [details]
Bug 1669600 - Properly distinguish between empty children and no children in rule iterator. r=#style

Beta/Release Uplift Approval Request

• User impact if declined: Correctness regression in 81 that might affect websites in the wild and would be nice to fix in 82.
• Is this code covered by automated tests?: Yes
• Has the fix been verified in Nightly?: No
• Needs manual test from QE?: Yes
• If yes, steps to reproduce: comment 0
• List of other uplifts needed: none
• Risk to taking this patch: Low
• Why is the change risky/not risky? (and alternatives if risky): Extremely simple fix.
• String changes made/needed: none

Comment 5

[BugBot [:suhaib / :marco/ :calixte]]

Set release status flags based on info from the regressing bug 1655751

Comment 6

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/e6b1234900b3
Properly distinguish between empty children and no children in rule iterator. r=heycam

Comment 7

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/26036 for changes under testing/web-platform/tests

Comment 8

[Narcis Beleuzu [:NarcisB]]

https://hg.mozilla.org/mozilla-central/rev/e6b1234900b3

Comment 9

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Upstream PR merged by moz-wptsync-bot

Comment 10

[Julien Cristau [:jcristau]]

Comment on attachment 9180091 [details]
Bug 1669600 - Properly distinguish between empty children and no children in rule iterator. r=#style

approved for 82.0b9

Comment 11

[Julien Cristau [:jcristau]]

https://hg.mozilla.org/releases/mozilla-beta/rev/4556e32920e6

Comment 12

[Daniel Bodea [:danibodea]]

Issue reproduced in Nightly v83.0a1 from 07-10-2020 and confirmed fix on Nightly v83.0a1 from 10-10-2020 and Beta v82.0b9 on Windows 10 and Mac OS 10.15.