LayoutTests/fast/dom/shadow/content-element-includer.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script src="../../js/resources/js-test-pre.js"></script>
   5 </head>
   6 <body>
   7 <pre id="console">
   8 This tests the correctness of includers of forwarded children.
   9 Note that this test needs internals object thus cannot run outside DRT.
  10 </pre>
  11 <div id="container"></div>
  12 <script>
  13 var container = document.getElementById("container");
  14
  15 var shadowRoot = null;
  16
  17 var elementWithoutShadow = document.createElement("div");
  18 container.appendChild(elementWithoutShadow);
  19 var childOfElementWithoutShadow = document.createElement("span");
  20 elementWithoutShadow.appendChild(childOfElementWithoutShadow);
  21 container.offsetLeft;
  22 shouldBe("internals.includerFor(childOfElementWithoutShadow)", "null");
  23
  24 var elementWithShadow = document.createElement("div");
  25 container.appendChild(elementWithShadow);
  26 var shadowRootOfElementWithShadow = internals.ensureShadowRoot(elementWithShadow);
  27 shadowRootOfElementWithShadow.appendChild(document.createElement("div")); // Gives non-content child.
  28 var childOfElementWithShadow = document.createElement("span");
  29 elementWithShadow.appendChild(childOfElementWithShadow);
  30 container.offsetLeft;
  31 shouldBe("internals.includerFor(childOfElementWithShadow)", "null");
  32
  33 var elementWithShadowContent = document.createElement("div");
  34 container.appendChild(elementWithShadowContent);
  35 var shadowRootOfElementWithShadowContent = internals.ensureShadowRoot(elementWithShadowContent);
  36 var shadowContentOfElementWithShadowContent = internals.createShadowContentElement(document);
  37 shadowRootOfElementWithShadowContent.appendChild(shadowContentOfElementWithShadowContent);
  38 var childOfElementWithShadowContent = document.createElement("span");
  39 elementWithShadowContent.appendChild(childOfElementWithShadowContent);
  40 container.offsetLeft;
  41 shouldBe("internals.includerFor(childOfElementWithShadowContent)", "shadowContentOfElementWithShadowContent");
  42
  43 //
  44 // Testing dynamic change
  45 //
  46 var movingChild = childOfElementWithShadowContent;
  47
  48 // Removing
  49 elementWithShadowContent.removeChild(movingChild);
  50 shouldBe("internals.includerFor(movingChild)", "null");
  51
  52 // Moving to content-less tree
  53 elementWithShadow.appendChild(movingChild);
  54 shouldBe("internals.includerFor(movingChild)", "null");
  55 elementWithShadow.removeChild(movingChild);
  56
  57 // Moving to another content-full tree
  58 var anotherElementWithShadowContent = document.createElement("div");
  59 container.appendChild(anotherElementWithShadowContent);
  60 var anotherShadowRootOfElementWithShadowContent = internals.ensureShadowRoot(anotherElementWithShadowContent);
  61 var anotherShadowContentOfElementWithShadowContent = internals.createShadowContentElement(document);
  62 anotherShadowRootOfElementWithShadowContent.appendChild(anotherShadowContentOfElementWithShadowContent);
  63
  64 anotherElementWithShadowContent.appendChild(movingChild);
  65 container.offsetLeft;
  66 shouldBe("internals.includerFor(movingChild)", "anotherShadowContentOfElementWithShadowContent");
  67 </script>
  68 <script src="../../js/resources/js-test-post.js"></script>
  69 </body>
  70 </html>