Closed Bug 1698428 Opened 1 month ago Closed 8 days ago

Firefox overflow-top-left.html starts to fail after 1697349

Categories

(Core :: Layout: Flexbox, task)

task

Tracking

()

RESOLVED FIXED
89 Branch
Tracking Status
firefox89 --- fixed

People

(Reporter: TYLin, Assigned: dholbert, NeedInfo)

References

(Blocks 1 open bug)

Details

Attachments

(1 file)

After the proposed behavior change in bug 1697349, overflow-top-left.html starts to fail. We leave the test unchanged for now until the webcompat situation is clear.

Note: blink is proposing a similar change in https://chromium-review.googlesource.com/c/chromium/src/+/2676302 that also makes overflow-top-left.html fail.

Here's the wpt.fyi page for this test, for reference: https://wpt.fyi/results/css/css-flexbox/overflow-top-left.html

This test is included in the compat2021 test set; hence, marking as blocking the metabug.

(This seems pretty clearly like a test bug. I think we can address this by changing the reference case to use border: 4px solid white to mock up the flex item margin in the testcase. This border on the mocked-up flex items will create scrollable overflow in the reference case, which is what we'd like, since the flex items' margin in the testcase is also supposed to create scrollable overflow.

Blocks: compat2021
Flags: needinfo?(dholbert)

Per https://drafts.csswg.org/css-overflow-3/#scrollable , the scrollable
overflow area of a scrollable flex container is supposed to contain "the margin
areas of...flex item boxes for which the box establishes a containing block."

Before this patch, the reference case didn't properly require this behavior (in
its mockup of the inline-end edge of the testcase's flex containers). The
reference case was using "margin" on blocks in a block container to represent
this space, and that didn't match the testcase because margins behave
differently in block layout vs. flex layout with respect to creating scrollable
overflow in their container.

This patch changes the reference case to use borders to represent this space.
This works better because borders do reliably create scrollable
overflow. (Also, borders don't collapse like margins do in block layout; this
lets us remove an extra hack that the reference case was having to use to
counteract this.)

Assignee: nobody → dholbert
Status: NEW → ASSIGNED
Pushed by dholbert@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/9db41e93c66f
Adjust WPT reference case "overflow-top-left-ref.html" to use a white border as a mockup for the testcase's margins. r=TYLin
Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/28408 for changes under testing/web-platform/tests
Upstream PR was closed without merging

Looks like on Windows 10 non-webrender, text can be fuzzy. In my experience, it's good to have a try run for wpt reftests on all platforms to catch all fuzzy because autoland might not schedule all wpt reftests on all platforms.

Yup, I should've done a Try run here.

And yeah, looks like this is just some text antialiasing, probably due to differences in layerization or something. I'll add a fuzzy annotation, do a try run, and will then re-land.

Pushed by dholbert@mozilla.com:
https://hg.mozilla.org/integration/autoland/rev/eb8042bd69cc
Adjust WPT reference case "overflow-top-left-ref.html" to use a white border as a mockup for the testcase's margins. r=TYLin
Status: ASSIGNED → RESOLVED
Closed: 8 days ago
Resolution: --- → FIXED
Target Milestone: --- → 89 Branch
Upstream PR merged by moz-wptsync-bot
You need to log in before you can comment on or make changes to this bug.