wpt.fyi "Triage Mode" doesn't work in Firefox due to table "border-collapse:collapse" rendering issue
Categories
(Core :: Layout: Tables, defect)
Tracking
()
People
(Reporter: dholbert, Unassigned)
Details
Attachments
(1 file)
3.70 MB,
video/webm
|
Details |
NOTE: you need to be part of the specially-selected group of folks who can triage WPT tests (based on github account group-membership I think) in order to directly trigger this bug. You can still use devtools to trigger the issue if you're not in that membership group, though.
STR:
- Visit https://wpt.fyi/results/css/css-images/image-set/image-set-parsing.html?label=master&label=experimental&aligned (or some WPT.fyi page for a test failure with multiple subtests, some of which fail in some browser)
- Sign in to GitHub using link at top-right
- If it's available to you, enable "Triage Mode" at the top right of the page.
- Click on some red cell.
Alternate STR if you aren't in the group of WPT triagers or don't want to sign in to github:
- Visit the aforementioned link.
- Right-click any cell (PASS or FAIL, doesn't matter) and inspect in devtools, and be sure you've got the
td
element in inspector (not its child, for example). - In devtools console, type:
$0.setAttribute("selected", "selected")
EXPECTED RESULTS:
The cell in question should get a black border.
ACTUAL RESULTS:
No black border. The text inside the cell shifts inwards a little, but no border appears.
Chrome gives EXPECTED RESULTS. Firefox gives ACTUAL RESULTS.
Firefox version: 112.0a1 (2023-03-09) (64-bit)
(This is probably a known border-image bug that wants to be duped; I wanted to be sure we had the wpt.fyi affectedness & steps-to-repro on-file, since folks may run into this when triaging interop-2023 test failures.)
Reporter | ||
Comment 1•2 years ago
|
||
Side note, the STR do produce expected-results on some pages, e.g. views of an entire directory like this one:
https://wpt.fyi/results/css/css-images/image-set?label=master&label=experimental&aligned&view=subtest
But it seems to be broken when you're viewing a page for a single test that has multiple subtests.
Reporter | ||
Comment 2•2 years ago
|
||
Aha, it specifically affects pages where the results table has the terse
attribute, which activates this style rule:
table[terse] td {
position: relative;
}
That seems to trigger the issue, apparently by making the background of other cells draw in front of the border of the selected cell.
Reporter | ||
Comment 3•2 years ago
|
||
I think this is bug 1450601, essentially.
Reporter | ||
Comment 4•2 years ago
|
||
As a local workaround on wpt.fyi, you can open devtools and un-tick border-collapse:collapse
for the table
element. That changes the look of the page a bit (adding space between cells), but it does mean you can actually see borders around the selected/triage'd cells, which is a functional improvement.
Reporter | ||
Comment 5•2 years ago
|
||
Here's a screencast showing (in order):
- the expected-results in Chrome
- the actual-results (bug) in Firefox
- one workaround (unchecking
border-collapse: collapse
) to get a functional but cosmetically-less-great experience.
Description
•