1 files changed, 101 insertions, 0 deletions
diff --git a/testing/web-platform/tests/dom/parts/basic-dom-part-declarative-brace-syntax-innerhtml.tentative.html b/testing/web-platform/tests/dom/parts/basic-dom-part-declarative-brace-syntax-innerhtml.tentative.html
new file mode 100644
index 0000000000..58db5cd04f
--- /dev/null
+++ b/testing/web-platform/tests/dom/parts/basic-dom-part-declarative-brace-syntax-innerhtml.tentative.html
@@ -0,0 +1,101 @@
+<!DOCTYPE html>
+<title>DOM Parts: Basic object structure, {{}} declarative API</title>
+<meta name="author" href="mailto:masonf@chromium.org">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="./resources/domparts-utils.js"></script>
+
+<div id=context_elements>
+  <div></div>
+  <div parseparts></div>
+  <template></template>
+  <template parseparts class=expect_success></template>
+</div>
+
+<script>
+function assertIsComment(node,commentText) {
+  assert_true(node instanceof Comment);
+  assert_equals(node.textContent,commentText);
+}
+
+const declarativeOpenerNoParseparts  = '<h1>';
+const declarativeOpenerParseparts  = '<h1 parseparts>';
+const declarativeContent  = '{{#}}First{{#}}<span {{}}>Middle</span>{{/}}Last{{/}}</h1>';
+
+Array.from(document.querySelectorAll('#context_elements>*')).forEach(contextEl => {
+  const expectParts = contextEl.classList.contains('expect_success');
+  [false,true].forEach(addParsePartsInside => {
+    const description = `${contextEl.outerHTML.split('><')[0]}><h1${addParsePartsInside ? " parseparts" : ""}>content...`;
+    const content = (addParsePartsInside ? declarativeOpenerParseparts : declarativeOpenerNoParseparts) + declarativeContent;
+
+    test((t) => {
+      const root = contextEl.content ? contextEl.content.getPartRoot() : document.getPartRoot();
+      assert_equals(root.getParts().length,0,'Should start with no parts');
+      t.add_cleanup(() => {
+        contextEl.replaceChildren();
+        root.getParts().forEach(part => part.disconnect());
+      });
+      contextEl.innerHTML = content;
+      if (expectParts) {
+        let expectedRootParts = [{type:'ChildNodePart',metadata:[]}];
+        assertEqualParts(root.getParts(),expectedRootParts,0,'declarative root missing parts');
+        const childPart1 = root.getParts()[0];
+        assertIsComment(childPart1.previousSibling,'');
+        assertIsComment(childPart1.nextSibling,'');
+        const expectedChild1Parts = [{type:'ChildNodePart',metadata:[]}];
+        assertEqualParts(childPart1.getParts(),expectedChild1Parts,0,'First level childpart should just have one child part');
+        const childPart2 = childPart1.getParts()[0];
+        assertIsComment(childPart2.previousSibling,'');
+        assertIsComment(childPart2.nextSibling,'');
+        const expectedChild2Parts = [{type:'NodePart',metadata:[]}];
+        assertEqualParts(childPart2.getParts(),expectedChild2Parts,0,'Second level childpart should have just the node part');
+        assert_true(childPart2.getParts()[0].node instanceof HTMLSpanElement);
+        assert_equals(childPart2.getParts()[0].node.textContent,'Middle');
+      } else {
+        assert_equals(root.getParts().length,0);
+      }
+    }, `Declarative DOM Parts innerHTML ${description} (expect${expectParts ? "" : " no"} parts)`);
+  });
+});
+
+test((t) => {
+  const tmpl = document.createElement('template');
+  tmpl.parseparts = true;
+  // See crbug.com/1490375.
+  tmpl.innerHTML = '<div {{}}></div>';
+  const root = tmpl.content.getPartRoot();
+  t.add_cleanup(() => {
+    tmpl.remove();
+    root.getParts().forEach(part => part.disconnect());
+  });
+  assert_equals(root.getParts().length,1,'There should be one NodePart');
+}, `Basic NodePart parsing`);
+
+
+test((t) => {
+  const tmpl = document.createElement('template');
+  tmpl.parseparts = true;
+  tmpl.innerHTML = ' <div id={{}} class={{}} foo=baz></div>';
+  const root = tmpl.content.getPartRoot();
+  t.add_cleanup(() => {
+    tmpl.remove();
+    root.getParts().forEach(part => part.disconnect());
+  });
+  assert_equals(root.getParts().length,0,'Declarative AttributeParts should be automatic, and should not show up in getParts()');
+  function checkBasics(checkContent,expectId,expectClass) {
+    const innerDiv = checkContent.firstElementChild;
+    assert_equals(innerDiv.localName,'div');
+    assert_equals(innerDiv.getAttribute('id'),expectId || '','Declarative AttributeParts id attribute');
+    assert_equals(innerDiv.getAttribute('class'),expectClass || '','Declarative AttributeParts class attribute');
+    assert_equals(innerDiv.getAttribute('foo'),'baz','Declarative AttributeParts should not touch other attributes');
+    return innerDiv;
+  }
+  checkBasics(tmpl.content);
+  const clone = root.clone();
+  const clonedDiv = checkBasics(clone.rootContainer);
+  const cloneWithValues = root.clone({attributeValues: ['foo','bar']});
+  const clonedDiv2 = checkBasics(cloneWithValues.rootContainer,'foo','bar');
+}, `Basic AttributePart cloning with values`);
+
+</script>
+