`<details>`/`<summary>` rendering - Githubissues

web-platform-tests / interop

web-platform-tests Interop project

https://wpt.fyi/interop

313 stars 28 forks source link

`<details>`/`<summary>` rendering #871

Open nt1m opened 3 weeks ago

nt1m commented 3 weeks ago

Description

The WebKit implementation of those elements is completely out of date, and causes a lot of pain for web developers:

::marker can't be used, WebKit implements ::-webkit-details-marker instead(bug 157323)
list-style and display does not affect the details marker (bug 264381)
element.checkVisibility() does not work properly on elements in the default slot (bug 264733)
summary::before does not appear in the correct order (bug 61426)
details::before/after does not appear in the correct order (bug 61766)

Also add support for ::details-content

Specification

https://html.spec.whatwg.org/#the-details-and-summary-elements

Additional Signals

Standards Positions

WebKit: https://github.com/WebKit/standards-positions/issues/351 Gecko: https://github.com/mozilla/standards-positions/issues/1027

Site breakage and workaround

Browser Bugs

Likely Compatibility Impact

See: https://bugs.webkit.org/showdependencytree.cgi?id=252223&hide_resolved=1

Developer surveys

Other Developer Sentiment

There were some mentions in State of HTML/CSS

yisibl commented 3 weeks ago

::details-content has shipped in Chrome 131 and introduces a new concept: part-like pseudo-elements.

This means that selectors such as the following are valid:

::details-content::before
::details-content::after
::details-content::first-line
::details-content::first-letter
::details-content::selection
::details-content:hover
and more…