<!DOCTYPE html>
<script src='../../resources/testharness.js'></script>
<script src='../../resources/testharnessreport.js'></script>
<details open>
<summary>
<span slot="unknown-slot">Hello, </span>
<span slot="internal-fallback-slot">Blink</span>
</summary>
<div slot="unknown-slot">1. This is details 1.</div>
<div slot="internal-filtered-slot">2. This is details 2.</div>
<div slot="internal-fallback-slot">3. This is details 3.</div>
</details>
<script>
'use strict';
const details = document.querySelector('details');
const div1 = document.querySelector('details div[slot=unknown-slot]');
const div2 = document.querySelector('details div[slot=internal-filtered-slot]');
const div3 = document.querySelector('details div[slot=internal-fallback-slot]');
const summary = document.querySelector('summary');
const span1 = document.querySelector('summary span[slot=unknown-slot]');
const span2 = document.querySelector('summary span[slot=internal-fallback-slot]');
test(() => {
assert_true(details.open);
assert_equals(details.shadowRoot, null);
assert_equals(summary.shadowRoot, null);
assert_equals(summary.assignedSlot, null);
assert_equals(div1.assignedSlot, null);
assert_equals(div2.assignedSlot, null);
assert_equals(div3.assignedSlot, null);
assert_equals(span1.assignedSlot, null);
assert_equals(span2.assignedSlot, null);
}, 'UA shadow for <details><summary> should not be exposed to web.');
async_test((test) => {
details.addEventListener('click', test.step_func_done((e) => {
// expected: <span>, <summary>, <details>, <body>, <html>, #document, window
const path = e.composedPath();
assert_array_equals(path, [span1, summary, details, document.body,
document.documentElement, document, window]);
}));
span1.click();
}, 'UA shadow internals for <details><summary> should not be exposed to ' +
'event.composedPath().');
</script>
Codebase Browser
chromium