2034477 - Table parts disappear when pseudo element is added

Status: RESOLVED DUPLICATE of bug 2033384

(Core :: Layout, defect)

Description

[stef.busking]

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:150.0) Gecko/20100101 Firefox/150.0

Steps to reproduce:

Apologies for the convoluted repro case - I've tried to reduce this or even reproduce it on a static version of the linked HTML + CSS but with no luck.

1. Go to https://trial.fontoxml.com/
2. Insert a table (Structure tab > Table > any size with multiple rows and columns)
3. Open dev tools
4. In the styles inspector, add a new rule:

tr::after {
  display: block;
  content: '';
}

Actual results:

Simply adding the ::after (or ::before) pseudo element to the table rows somehow causes all rows to stop rendering. The inspector suddenly shows them as 0×0 in size. Removing the style rule again does not cause them to reappear, which seems to indicate that this may be a browser bug rather than an unexpected interaction of styles on the page.

We originally noticed this happening when hovering over the editor's breadcrumbs for the table and row elements. These toggle an attribute on the tr that similarly creates an ::after pseudo. Hovering over the table breadcrumb usually (but not always) re-renders the table, showing the rows again.

We've seen the same happen for tables that contain a thead or tbody. For those adding the pseudo element to the rows works fine, but adding it to whichever of those two is the first child triggers it and its contents to stop rendering.

Expected results:

The table rows should not disappear. In fact, when I tried to extract a static copy of the HTML and CSS (which requires capturing the cssText of cssRules within the various dynamically generated stylesheets), the issue could no longer be reproduced.

Comment 1

[BugBot [:suhaib / :marco]]

The Bugbug bot thinks this bug should belong to the 'DevTools::Inspector' component, and is moving the bug to that component. Please correct in case you think the bot is wrong.

Comment 2

[stef.busking]

I don't think this is related to the devtools inspector. The issue also occurs when hovering over the breadcrumb for the table row, which runs script that similarly toggles the pseudo element's visibility. I only used the dev tools as a more minimal way to reproduce the issue.

Comment 3

[Julian Descottes [:jdescottes]]

Per comment 2, DevTools is only used to make the scenario easier to reproduce.

Comment 4

[Emilio Cobos Álvarez [:emilio]]

I don't seem to be able to reproduce this on Nightly at least.

Comment 5

[Emilio Cobos Álvarez [:emilio]]

Yeah I can repro in 150. Bug 2033384 fixed this.

Comment 6

[stef.busking]

Thanks! I can confirm I'm no longer able to repro this on 151.