Add support for the shadow root clonable flag

This landed in the latest declarative shadow dom spec PR:

  whatwg/dom#892

and was discussed here:

  whatwg/dom#1137

This CL adds support for that, behind a new ShadowRootClonable
flag. There was already a very basic test, but I added a few
more cases.

This should be fairly web compatible, but there is a risk since with
this feature enabled, declarative shadow roots in the main document
(as opposed to in a <template> element) will now be cloned. I will
launch this feature carefully.

Fixed: 1510466
Change-Id: Ie25b72f369ca0542555f91010b0f22d295403728

shadow-dom/declarative/clonable.window.js

@@ -8,3 +8,29 @@ test(() => {
  assert_equals(cloned.shadowRoot.children.length, 1, "children count");
  assert_equals(cloned.shadowRoot.children[0].localName, "input", "children content");
 }, "attachShadow with clonable: true");
+
+for (clonable of [false, undefined]) {
+ test(() => {
+ const div = document.createElement("div");
+ const root = div.attachShadow({ mode: "open", clonable });
+ root.appendChild(document.createElement("input"));
+ assert_false(root.clonable, "clonable attribute");
+
+ const cloned = div.cloneNode(true);
+ assert_true(!cloned.shadowRoot, "shadow should not be cloned");
+ }, `attachShadow with clonable: ${clonable}`);
+}
+
+test(() => {
+ const div = document.createElement("div");
+ div.setHTMLUnsafe('<div><template shadowrootmode=open><input></template></div>');
+ const root = div.firstElementChild.shadowRoot;
+ assert_true(!!root);
+ assert_true(root.clonable, "clonable is automatically true for declarative shadow root");
+
+ const cloned = div.cloneNode(true);
+ const clonedRoot = cloned.firstElementChild.shadowRoot;
+ assert_true(!!clonedRoot);
+ assert_equals(clonedRoot.children.length, 1, "children count");
+ assert_equals(clonedRoot.children[0].localName, "input", "children content");
+}, "declarative shadow roots get clonable: true automatically");