Skip to content

Commit

Permalink
Bug 1875583 [wpt PR 44107] - Add getHTML() and modify getInnerHTML() …
Browse files Browse the repository at this point in the history
…accordingly [2/2], a=testonly

Automatic update from web-platform-tests
Add getHTML() and modify getInnerHTML() accordingly [2/2]

This CL adds a new getHTML() method, and modifies the existing
getInnerHTML() method accordingly. The behavior of getInnerHTML()
is not changed by this CL, but the implementation is modified to allow
the code to be shared. The new method follows the discussion and
conclusions here:
  whatwg/html#8867 (comment)

Essentially, that is:
 1. Provide a boolean option to getHTML() that says "please serialize
    opted-in shadow roots". The default for this option is false.
 2. Provide an option to getHTML() containing a sequence of shadowRoots
    that should be serialized, independent of whether they opted in via
    the flag above.

This work falls under these two chromestatus entries:
  https://chromestatus.com/feature/5081733588582400
  https://chromestatus.com/feature/5102952270528512
and these two blink-dev threads:
  https://groups.google.com/a/chromium.org/g/blink-dev/c/PE4VwMjLVTo
  https://groups.google.com/a/chromium.org/g/blink-dev/c/it0X7BOimKw

Bug: 1519972, 1517959
Change-Id: I5181a0702a12d550b4dab64c0c306ea2ccb25fa3
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5219591
Commit-Queue: Mason Freed <masonf@chromium.org>
Reviewed-by: David Baron <dbaron@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1251541}

--

wpt-commits: 632cbee7f0a71696290582679f8a641e45ac6019
wpt-pr: 44107
  • Loading branch information
Mason Freed authored and moz-wptsync-bot committed Jan 28, 2024
1 parent 3f4dbbf commit a3be132
Show file tree
Hide file tree
Showing 2 changed files with 104 additions and 1 deletion.
Original file line number Diff line number Diff line change
@@ -0,0 +1,101 @@
<!DOCTYPE html>
<title>getHTML behavior</title>
<link rel='author' href='mailto:masonf@chromium.org'>
<link rel='help' href='https://github.com/whatwg/html/issues/8867'>
<script src='/resources/testharness.js'></script>
<script src='/resources/testharnessreport.js'></script>
<script src='../../html/resources/common.js'></script>

<body>

<script>
function testElementType(allowsShadowDom, elementType, runGetHTMLOnShadowRoot, mode, delegatesFocus, serializable) {
const t = test(t => {
// Create and attach element
let wrapper;
if (runGetHTMLOnShadowRoot) {
// This ensures we're testing both Element.getHTML() and ShadowRoot.getHTML().
const host = document.createElement('div');
t.add_cleanup(function() { host.remove(); });
document.body.appendChild(host);
wrapper = host.attachShadow({mode: 'open'});
} else {
wrapper = document.createElement('div');
t.add_cleanup(function() { wrapper.remove(); });
document.body.appendChild(wrapper);
}
const element = document.createElement(elementType);
wrapper.appendChild(element);

const isOpen = mode === 'open';
if (allowsShadowDom) {
const delegatesAttr = delegatesFocus ? ' shadowrootdelegatesfocus=""' : '';
const correctShadowHtml = `<template shadowrootmode="${mode}"${delegatesAttr}><slot></slot></template>`;
const correctHtml = `<${elementType}>${correctShadowHtml}</${elementType}>`;
let initDict = {mode: mode, delegatesFocus: delegatesFocus};
let expectedSerializable = null;
switch (serializable) {
case "none": expectedSerializable = false; break;
case "true": initDict.serializable = expectedSerializable = true; break;
case "false": initDict.serializable = expectedSerializable = false; break;
default: throw new Error("Invalid");
}
const shadowRoot = element.attachShadow(initDict);
assert_equals(shadowRoot.mode,mode);
assert_equals(shadowRoot.delegatesFocus,delegatesFocus);
assert_equals(shadowRoot.serializable,expectedSerializable);
shadowRoot.appendChild(document.createElement('slot'));
const emptyElement = `<${elementType}></${elementType}>`;
if (isOpen) {
if (expectedSerializable) {
assert_equals(wrapper.getHTML({includeShadowRoots: true}), correctHtml);
} else {
assert_equals(wrapper.getHTML({includeShadowRoots: true}), emptyElement);
}
} else {
// Closed shadow roots should not be returned unless shadowRoots specifically contains the shadow root:
assert_equals(wrapper.getHTML({includeShadowRoots: true}), emptyElement);
assert_equals(wrapper.getHTML({includeShadowRoots: true, shadowRoots: []}), emptyElement);
}
// If we provide the shadow root, serialize it, regardless of includeShadowRoots.
assert_equals(wrapper.getHTML({includeShadowRoots: true, shadowRoots: [shadowRoot]}),correctHtml);
assert_equals(wrapper.getHTML({shadowRoots: [shadowRoot]}),correctHtml);
// This should always throw - includeShadowRoots false, but we've provided roots.
assert_throws_dom("NotSupportedError",() => wrapper.getHTML({includeShadowRoots: false, shadowRoots: [shadowRoot]}));
} else {
// For non-shadow hosts, getHTML() should also match .innerHTML
assert_equals(wrapper.getHTML({includeShadowRoots: true}),wrapper.innerHTML);
}

// Either way, make sure getHTML({includeShadowRoots: false}) matches .innerHTML
assert_equals(wrapper.getHTML({includeShadowRoots: false}),wrapper.innerHTML,'getHTML() with includeShadowRoots false should return the same as .innerHTML');
// ...and that the default for includeShadowRoots is false.
assert_equals(wrapper.getHTML(),wrapper.innerHTML,'The default for includeShadowRoots should be false');

}, `${runGetHTMLOnShadowRoot ? 'ShadowRoot' : 'Element'}.getHTML() on <${elementType}>${allowsShadowDom ? `, with mode=${mode}, delegatesFocus=${delegatesFocus}, serializable=${serializable}.` : ''}`);
}

function runAllTests() {
const allElements = [...HTML5_ELEMENTS, 'htmlunknown'];
const safelisted = HTML5_SHADOW_ALLOWED_ELEMENTS;
for (const elementName of allElements) {
const allowsShadowDom = safelisted.includes(elementName);
for (const runGetHTMLOnShadowRoot of [false, true]) {
if (allowsShadowDom) {
for (const delegatesFocus of [false, true]) {
for (const mode of ['open', 'closed']) {
for (const serializable of ['none', 'false', 'true']) {
testElementType(true, elementName, runGetHTMLOnShadowRoot, mode, delegatesFocus, serializable);
}
}
}
} else {
testElementType(false, elementName, runGetHTMLOnShadowRoot);
}
}
}
}

runAllTests();

</script>
Original file line number Diff line number Diff line change
Expand Up @@ -31,18 +31,20 @@
const delegatesAttr = delegatesFocus ? ' shadowrootdelegatesfocus=""' : '';
const correctShadowHtml = `<template shadowrootmode="${mode}"${delegatesAttr}><slot></slot></template>`;
const correctHtml = `<${elementType}>${correctShadowHtml}</${elementType}>`;
const emptyElement = `<${elementType}></${elementType}>`;
const shadowRoot = element.attachShadow({mode: mode, delegatesFocus: delegatesFocus});
shadowRoot.appendChild(document.createElement('slot'));
if (isOpen) {
// We can only test this for open roots
assert_equals(wrapper.getInnerHTML(),correctHtml,'The default for includeShadowRoots should be true');
} else {
// Closed shadow roots should not be returned unless closedRoots contains the shadow root:
const emptyElement = `<${elementType}></${elementType}>`;
assert_equals(wrapper.getInnerHTML({includeShadowRoots: true}), emptyElement);
assert_equals(wrapper.getInnerHTML({includeShadowRoots: true, closedRoots: []}), emptyElement);
}
assert_equals(wrapper.getInnerHTML({includeShadowRoots: true, closedRoots: [shadowRoot]}),correctHtml);
// ClosedRoots are not included if includeShadowRoots is false:
assert_equals(wrapper.getInnerHTML({includeShadowRoots: false, closedRoots: [shadowRoot]}),emptyElement);
} else {
// For non-shadow hosts, getInnerHTML() should also match .innerHTML
assert_equals(wrapper.getInnerHTML({includeShadowRoots: true}),wrapper.innerHTML);
Expand Down

0 comments on commit a3be132

Please sign in to comment.