Flexbox WPT test "align-items-baseline-overflow-non-visible.html" fails due to antialiasing issue
Categories
(Core :: Layout: Flexbox, task)
Tracking
()
| Tracking | Status | |
|---|---|---|
| firefox89 | --- | fixed |
People
(Reporter: dholbert, Assigned: dholbert)
Details
Attachments
(2 files)
screenshot with red highlighting of mismatch region
(Note: this test is currently excluded from the compat2021 list, so I'm not making this bug report block the compat2021 metabug.)
align-items-baseline-overflow-non-visible.html fails[1] in Firefox on Windows, Mac, and Android[2] with a few pixels differing at the top left of the first "Y" character.
This is just a bug in the test, basically. Here's what's going on: the "Y" character is inside of an overflow:hidden region in the testcase; and it happens to have a little bit of antialiasing fringe (from a decorative serif or something) that would normally paint a little bit of fringe beyond its content-box. In the testcase, this fringe gets imperceptibly clipped at the edge of the overflow:hidden container, but in the reference case, there's no such clipping because there's no container that would do any clipping.
We could hypothetically fix this by adding overflow:clip to the reference case -- that should make it clip at paint-time in the same way that the testcase does, without impacting the layout at all. Alternately, we could make the test use the Ahem font, which shouldn't have any antialiased fringe to be clipped.
[1] https://wpt.fyi/results/css/css-flexbox/align-items-baseline-overflow-non-visible.html?label=master&label=experimental&aligned
[2] https://searchfox.org/mozilla-central/rev/a1e81094c7c6dc5e39143caeb39cc46f36980d3e/testing/web-platform/meta/css/css-flexbox/align-items-baseline-overflow-non-visible.html.ini
|
Assignee | |
Comment 1•5 years ago
|
||
In this WPT test, the testcase has an 'overflow:hidden' container, while the
reference case does not. The test fails on some platforms because the "Y"
character has some antialiased fringe that bleeds imperceptibly past the
content-box, and gets clipped in the testcase but not in the reference
case. (This behavior is entirely allowable, and it shouldn't result in a test
failure. It's also unrelated to the behavior that the baseline-alignment
behavior that the test is trying to exercise.)
This patch addresses the issue by switching to the Ahem font, which is simpler
and less likely to have antialiasing fringe that would be clipped in this way.
I'm using the 25px/1 suggested styling from the documentation at
https://web-platform-tests.org/writing-tests/ahem.html
|
||
Updated•5 years ago
|
|
||
Comment 4•5 years ago
|
||
| bugherder | ||
Description
•