1901037 - Support ::details-content pseudo-element and improved styling of <details> element

Status: RESOLVED FIXED

(Core :: DOM: Core & HTML, enhancement)

Description

[David Baron :dbaron: (⌚️UTC-5, no longer working on Mozilla)]

whatwg/html#10265 specifies the rendering of the <details> element in more detail than it was previously specified. Many of these changes already match what is implemented in Gecko. I think I'm aware of three things that would need to change to match them:

• enable the preference implemented in bug 1856374 to allow changing display on the <details> element
• implement the ::details-content pseudo-element and make it match the correct element. (There may be some work here to implement the "part-like pseudo-element" concept.)
• Change the default display of the internal <slot> matched by the ::details-content pseudo-element to block rather than contents. (This is the one part here that involves compatibility risk.)

There's also one additional case where Gecko doesn't match an earlier change (whatwg/html#6466) to the HTML spec (see bug 1724299):

• the styling that makes the <details> open and close (which is currently in details.css) should use content-visibility rather than display.

Comment 3

[Daniel Holbert [:dholbert]]

Attachment: Bug 1901037: Toggle pref for details-element WPTs to let them use custom 'display' values, and remove failure annotations. r?#layout

This is a test-config-only change with no user impact.

We've got bug 1941406 filed to make this pref-flip for users, but for now we
might as well make the pref-flip for the tests so that we can get some test
coverage and get a more realistic picture of the test-failures that remain.

Comment 4

[Daniel Holbert [:dholbert]]

[sorry, a bug-number mis-copypaste led to me posting a patch here instead of on a different bug just now. Cleaned up now.]

While I'm posting, let's make this comment useful -- I'll note that this bug is needed (and is probably the only thing that's needed) to pass these 6 WPTs which may potentially be relevant to interop-2025:
https://wpt.fyi/results/html/rendering/the-details-element/details-pseudo-elements-001.html
https://wpt.fyi/results/html/rendering/the-details-element/details-pseudo-elements-002.html
https://wpt.fyi/results/html/rendering/the-details-element/details-pseudo-elements-003.html
https://wpt.fyi/results/html/rendering/the-details-element/details-pseudo-elements-004.html
https://wpt.fyi/results/html/rendering/the-details-element/details-pseudo-elements-005.html
https://wpt.fyi/results/html/rendering/the-details-element/details-pseudo-elements-006.html

Comment 5

[Daniel Holbert [:dholbert]]

(In reply to David Baron :dbaron: (⌚️UTC-4, no longer working on Mozilla) from comment #0)

• enable the preference implemented in bug 1856374 to allow changing display on the <details> element

I've just posted a patch on bug 1941406 to do that, BTW.

Comment 6

[Luke Warlow]

Attachment: Bug 1901037: Implement `::details-content` pseudo element r=emilio

Comment 7

[Emilio Cobos Álvarez [:emilio]]

Attachment: Bug 1901037 - Allow UA widget nodes to be pseudo-elements. r=#style

No behavior change right now, but this will unblock D241100.

Comment 8

[Phabricator Automation]

Comment on attachment 9471222 [details]
Bug 1901037 - Allow UA widget nodes to be pseudo-elements. r=#style

Revision D241106 was moved to bug 1953539. Setting attachment 9471222 [details] to obsolete.

Comment 9

[Nicolas Chevobbe [:nchevobbe]]

Attachment: Bug 1901037 - [devtools] Add test for ::details-content pseudo element in Rules view. r=#devtools.

Depends on D241100.

Comment 10

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/26b1240bfca3
Implement `::details-content` pseudo element r=emilio,devtools-reviewers,nchevobbe

Comment 11

[amarc]

Backed out for causing multiple rendering related wpt failures

• Backout link
• Push with failures
• Failure Log
• Failure Log 2

Comment 12

[Luke Warlow]

Waiting on Emilio's display: contents fix and then I'll rebase my change atop that should deal with most of the test oddities that I missed.

Comment 13

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/c6d9a112ceec
Implement `::details-content` pseudo element r=emilio,devtools-reviewers,nchevobbe

Comment 14

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/f36f389877eb
Remove subtest as it's passing after previous changes. a=test-only CLOSED TREE

Comment 15

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/8207ffe01afa
[devtools] Add test for ::details-content pseudo element in Rules view. r=devtools-reviewers,bomsy.

Comment 16

[Sandor Molnar[:smolnar]]

Backed out for causing dt failures @ browser_rules_pseudo-element_01.js

Backout link: https://hg.mozilla.org/integration/autoland/rev/0119a8586843e081c74c72342e2301e9ff25feca

Push with failures

Failure log -> TEST-UNEXPECTED-FAIL | devtools/client/inspector/rules/test/browser_rules_pseudo-element_01.js

Comment 17

[Sandor Molnar[:smolnar]]

https://hg.mozilla.org/mozilla-central/rev/c6d9a112ceec
https://hg.mozilla.org/mozilla-central/rev/f36f389877eb

Comment 18

[Phabricator Automation]

Comment on attachment 9471713 [details]
Bug 1901037 - [devtools] Add test for ::details-content pseudo element in Rules view. r=#devtools.

Revision D241397 was moved to bug 1935067. Setting attachment 9471713 [details] to obsolete.

Comment 19

[Emilio Cobos Álvarez [:emilio]]

This landed, so let's close the bug, the devtools test was moved :)

Comment 20

[Dave Letorey]

Related Pull Requests

• Content PR
• BCD PR
• Firefox Release PR