Bug 149443

Summary:	Add support for CSS Shadow Parts
Product:	WebKit	Reporter:	Ryosuke Niwa <rniwa>
Component:	CSS	Assignee:	Nobody <webkit-unassigned>
Status:	RESOLVED FIXED
Severity:	Normal	CC:	contact, koivisto, thorton, webkit-bug-importer, webkit
Priority:	P2	Keywords:	InRadar
Version:	WebKit Nightly Build
Hardware:	Unspecified
OS:	Unspecified
Bug Depends on:	196835, 202393, 202409, 202456, 202482, 202520, 202526, 202620, 202632, 202644, 202694, 202695, 202719, 202730, 202919
Bug Blocks:	148695

Description Ryosuke Niwa 2015-09-21 18:18:43 PDT

We should provide a mechanism to define auhtor-defined style parts akin to input element's pesudo elements in WebKit.

See https://github.com/w3c/webcomponents/issues/300

Comment 1 Ryosuke Niwa 2015-09-21 18:19:01 PDT

<rdar://problem/22732047>

Comment 2 Ryosuke Niwa 2015-09-21 20:37:37 PDT

*** Bug 149442 has been marked as a duplicate of this bug. ***

Comment 3 Keanu Lee 2016-12-08 11:37:11 PST

Gentle ping on this bug. Here's an example of pseudo `:host::after` that works in Chrome: http://jsbin.com/duyidud/edit?html,output

Comment 4 Ryosuke Niwa 2016-12-08 14:35:18 PST

(In reply to comment #3)
> Gentle ping on this bug. Here's an example of pseudo `:host::after` that
> works in Chrome: http://jsbin.com/duyidud/edit?html,output

That’s https://bugs.webkit.org/show_bug.cgi?id=164675, which just got fixed.

This bug is about adding the capability to define a custom pseudo element such as ::part(custom-part) to expose a stylable part from a component.

Comment 5 Ryosuke Niwa 2018-08-01 17:59:40 PDT

The spec is now at https://drafts.csswg.org/css-shadow-parts-1/

The exact syntax & semantics of forwarding hasn't been decided yet despite of the fact Blink started implementing this feature.

Comment 6 Steven Vachon 2019-05-12 16:57:30 PDT

Please add support for this. I've created a project with a demo that looks great in Chrome: https://stevenvachon.github.io/scrolling-menu

Comment 7 Steven Vachon 2019-05-12 16:57:41 PDT

Please add support for this. I've created a project with a demo that looks great in Chrome: https://stevenvachon.github.io/scrolling-menu

Comment 8 Antti Koivisto 2019-10-09 01:03:35 PDT

This was enabled by default in <https://trac.webkit.org/changeset/250889>. The demo linked above works nicely too.