New issue
Advanced search Search tips
Note: Color blocks (like or ) mean that a user may not be available. Tooltip shows the reason.

Issue 709078 link

Starred by 2 users

Issue metadata

Status: Fixed
Owner:
Last visit > 30 days ago
Closed: Jan 2018
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: Mac
Pri: 2
Type: Bug



Sign in to add a comment

Custom element slotted children not rendered in <details>

Reported by jordan.r...@banno.com, Apr 6 2017

Issue description

UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/57.0.2987.110 Safari/537.36

Steps to reproduce the problem:
1. Open the attached file in the latest Chromium or Chrome Canary OR create an HTML document with a custom element that uses a <slot> element within a <details> element.
2. Observe that slotted children are not rendered.

What is the expected behavior?
Slotted children should be rendered within the <details> element.

What went wrong?
Slotted children are not rendered within the <details> element, although the distributed children are shown (as e.g. "↪ <div>") in the elements panel.

See the attached screenshots, which show how the elements are rendered in Chrome Canary 59 and Safari Technology Preview 10.2. The latter renders the elements as expected.

I've also created a CodePen demo: http://codepen.io/jrunning/pen/peBMed

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 59.0.3064.0  Channel: canary
OS Version: OS X 10.12.4
Flash Version:
 
details-slotted-children-chrome-canary-59 copy.png
150 KB View Download
details-slotted-children-safari-10.2-preview copy.png
19.0 KB View Download
Of course I uploaded the wrong test case. Here's the correct one.
details-slot.html
975 bytes View Download
Labels: Needs-Bisect Needs-Triage-M58

Comment 3 by tkent@chromium.org, Apr 7 2017

Components: -Blink>HTML Blink>HTML>CustomElements Blink>HTML>Details Blink>DOM>ShadowDOM
Components: -Blink>HTML>CustomElements
Labels: -Needs-Bisect -Needs-Triage-M58
Status: Available (was: Unconfirmed)
Good catch. We have to update the implementations of <details>/<summary>, which are now implemented by Shadow DOM v0 features internally. They do not work with <slot> nicely.

Comment 5 by hayato@chromium.org, May 26 2017

Cc: kochi@chromium.org
Owner: yuzus@chromium.org
Status: Assigned (was: Available)
yuzus@, could you have a chance to take a look?
kochi@, please help yuzus@.

Comment 6 by hayato@chromium.org, Jul 11 2017

Components: -Blink>DOM>ShadowDOM

Comment 7 by kochi@chromium.org, Jan 26 2018

Cc: -kochi@chromium.org yuzus@chromium.org
Owner: kochi@chromium.org
Assign back to me.

Comment 8 by kochi@chromium.org, Jan 26 2018

Status: Fixed (was: Assigned)
With the recent conversion of UA shadow from V0 to V1, the latest canary
should catch up with Safari's look.
screenshot_dialog_slot.png
36.1 KB View Download

Sign in to add a comment