From db5cacc28d7894ffa59af41f5574354d34abcf7d Mon Sep 17 00:00:00 2001
From: Mason Freed <masonfreed@chromium.org>
Date: Wed, 13 May 2020 09:46:42 +0000
Subject: [PATCH] Bug 1634630 [wpt PR 23359] - Add ability to clone a template
 containing declarative Shadow DOM, a=testonly

Automatic update from web-platform-tests
Add ability to clone a template containing declarative Shadow DOM

Prior to this CL, this would not work correctly:

<template id=target>
  <div>
    <template shadowroot=open>Content</template>
  </div>
</template>

<script>
  document.body.appendChild(target.content.cloneNode(true));
</script>

The inner declarative Shadow DOM (<template shadowroot>) would not get
cloned from the template content to the clone. With this CL, it now
works correctly. Several tests were added to test nested template
and declarative Shadow DOM nodes.

This CL mirrors the DOM spec changes made in [1].

[1] https://github.com/whatwg/dom/pull/858

Bug: 1042130
Change-Id: I05792e038dc694ac00d13531c657afaed754f747
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2175062
Reviewed-by: Kouhei Ueno <kouhei@chromium.org>
Commit-Queue: Mason Freed <masonfreed@chromium.org>
Auto-Submit: Mason Freed <masonfreed@chromium.org>
Cr-Commit-Position: refs/heads/master@{#766528}

--

wpt-commits: 65659261a741bc42cfd35261430f47bd62deae4d
wpt-pr: 23359
---
 ...eclarative-shadow-dom-basic.tentative.html | 70 +++++++++++++++++++
 .../declarative/script-access.tentative.html  |  5 ++
 2 files changed, 75 insertions(+)

diff --git a/testing/web-platform/tests/shadow-dom/declarative/declarative-shadow-dom-basic.tentative.html b/testing/web-platform/tests/shadow-dom/declarative/declarative-shadow-dom-basic.tentative.html
index 332c0e1cd3e23..a72cf70ef6679 100644
--- a/testing/web-platform/tests/shadow-dom/declarative/declarative-shadow-dom-basic.tentative.html
+++ b/testing/web-platform/tests/shadow-dom/declarative/declarative-shadow-dom-basic.tentative.html
@@ -148,6 +148,76 @@
 
 </script>
 
+<template id="template-containing-shadow">
+  <div class="innerdiv">
+    <template shadowroot=open>Content</template>
+  </div>
+</template>
+<script>
+test(() => {
+  const template = document.querySelector('#template-containing-shadow');
+  const host1 = document.createElement('div');
+  document.body.appendChild(host1);
+  host1.appendChild(template.content.cloneNode(true));
+  let innerDiv = host1.querySelector('div.innerdiv');
+  const shadowRoot1 = innerDiv.shadowRoot;
+  assert_true(!!shadowRoot1,"Inner div should have a shadow root");
+  assert_equals(innerDiv.querySelector('template'), null, "No leftover template node");
+
+  const host2 = document.createElement('div');
+  document.body.appendChild(host2);
+  host2.appendChild(template.content.cloneNode(true));
+  innerDiv = host2.querySelector('div.innerdiv');
+  const shadowRoot2 = innerDiv.shadowRoot;
+  assert_true(!!shadowRoot2,"Inner div should have a shadow root");
+  assert_equals(innerDiv.querySelector('template'), null, "No leftover template node");
+
+  assert_not_equals(shadowRoot1,shadowRoot2,'Should not get back the same shadow root');
+}, 'Declarative Shadow DOM: template containing declarative shadow root');
+</script>
+
+<template id="template-containing-ua-shadow">
+  <div class="innerdiv">
+    <template shadowroot=open>
+      <video></video> <!--Assumed to have UA shadow root-->
+    </template>
+  </div>
+</template>
+<script>
+test(() => {
+  const template = document.querySelector('#template-containing-ua-shadow');
+  const host = document.createElement('div');
+  document.body.appendChild(host);
+  // Mostly make sure clone of template *does* clone the
+  // shadow root, and doesn't crash on cloning the <video>.
+  host.appendChild(template.content.cloneNode(true));
+  let innerDiv = host.querySelector('div.innerdiv');
+  const shadowRoot = innerDiv.shadowRoot;
+  assert_true(!!shadowRoot,"Inner div should have a shadow root");
+  assert_equals(innerDiv.querySelector('template'), null, "No leftover template node");
+  assert_true(!!innerDiv.shadowRoot.querySelector('video'),'Video element should be present');
+}, 'Declarative Shadow DOM: template containing declarative shadow root and UA shadow root');
+</script>
+
+<template id="template-containing-ua-shadow-closed">
+  <div class="innerdiv">
+    <template shadowroot=closed>
+      <video></video> <!--Assumed to have UA shadow root-->
+    </template>
+  </div>
+</template>
+<script>
+test(() => {
+  const template = document.querySelector('#template-containing-ua-shadow-closed');
+  const host = document.createElement('div');
+  document.body.appendChild(host);
+  host.appendChild(template.content.cloneNode(true));
+  let innerDiv = host.querySelector('div.innerdiv');
+  // TODO(masonfreed): once ElementInternals.shadowRoot exists, check for it here.
+  assert_true(!innerDiv.shadowRoot,"Inner div should have a closed shadow root");
+}, 'Declarative Shadow DOM: template containing closed declarative shadow root and UA shadow root');
+</script>
+
 <template id="root-element-shadow">
     <template shadowroot=open>Content</template>
 </template>
diff --git a/testing/web-platform/tests/shadow-dom/declarative/script-access.tentative.html b/testing/web-platform/tests/shadow-dom/declarative/script-access.tentative.html
index 250a03601a5be..b87bb7ab308b3 100644
--- a/testing/web-platform/tests/shadow-dom/declarative/script-access.tentative.html
+++ b/testing/web-platform/tests/shadow-dom/declarative/script-access.tentative.html
@@ -27,6 +27,11 @@
             assert_equals(n.content, null, 'Declarative template content should *still* be null');
             assert_equals(n.innerHTML, "", 'Declarative template innerHTML should *still* be empty');
             assert_equals(n.getInnerHTML({includeShadowRoots: true}), "", 'Declarative template getInnerHTML() should *still* be empty');
+
+            // Try cloning the in-progress declarative template - shouldn't work.
+            const clone = n.cloneNode(true);
+            assert_equals(clone.children.length,0,'Clone should not contain anything');
+            assert_equals(clone.content.children.length,0,'Clone should not contain anything');
             break;
           case 'noroot':
             // Make sure adding 'shadowroot' attribute doesn't trigger a shadow root,