Bug 169948

Summary: ::slotted should apply for fallback contents
Product: WebKit Reporter: Ryosuke Niwa <rniwa>
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: RESOLVED INVALID    
Severity: Normal CC: gwhitworth, koivisto, rniwa, simon.fraser, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: Other   
Hardware: Unspecified   
OS: Unspecified   
Bug Depends on:    
Bug Blocks: 148695    

Description Ryosuke Niwa 2017-03-21 23:54:57 PDT
See https://github.com/w3c/webcomponents/issues/631

::slotted(X) rules should apply on any X which is a fallback content of a slot.
Comment 1 Radar WebKit Bug Importer 2018-08-01 22:29:07 PDT
<rdar://problem/42842779>
Comment 2 Greg Whitworth 2020-08-25 16:48:36 PDT
We have hit this at Salesforce which is blocking us from leveraging this on our site(s) unfortunately. I have filed bugs on Gecko and Chromium regarding this issue. Here is content from those bugs:


What steps will reproduce the problem?
(1) Open the following JSFiddle: https://jsfiddle.net/z3278s5k/4/
- Here's a simplified repro (https://jsfiddle.net/yoashcrL/)
(2) Review the results in Chromium vs Safari

Actual results:

The span is colored blue per its ::slotted psuedo styles

Expected results:

It maintains the default text color

Here are some additional details:

Some addition context from the CSS psuedo spec, it states that the slotted psuedo element should apply to elements in the flattened tree that are slotted. (https://drafts.csswg.org/css-scoping/#slotted-pseudo)

There is a testcase in WPT that tests nested slots and while the test runner shows a pass for Chromium browser you'll notice that the rendering does not match the test itself. It says that the text should be green and it receives the default styles as well. http://wpt.live/css/css-scoping/slotted-nested.html

This is negatively impacting us at Salesforce and we're having to have our teams work around this issue and we'd like to leverage the native support for this capability but can't currently due to this issue.

We have filed a bug on Chromium as well here where we discussed the spec:
https://bugs.chromium.org/p/chromium/issues/detail?id=1119248

which was merged into this one:
https://bugs.chromium.org/p/chromium/issues/detail?id=703984#c19

Futhark has opened a CL for the change.
Comment 3 Ryosuke Niwa 2020-08-31 19:14:37 PDT
Now tracked by https://github.com/w3c/csswg-drafts/issues/5482
Comment 4 Ryosuke Niwa 2020-09-24 23:16:33 PDT
Given the latest discussion in CSS WG at https://github.com/w3c/csswg-drafts/issues/5482, this bug is not to be fixed. The current behavior of WebKit is correct except https://bugs.webkit.org/show_bug.cgi?id=179402 needs to be fixed.