gethtml-ordering.html (2385B)
1 <!DOCTYPE html> 2 <title>getHTML ordering behavior</title> 3 <link rel='author' href='mailto:masonf@chromium.org'> 4 <link rel='help' href='https://github.com/whatwg/html/pull/10139'> 5 <script src='/resources/testharness.js'></script> 6 <script src='/resources/testharnessreport.js'></script> 7 8 9 <div id=tests> 10 <div data-name="base"> 11 <template shadowrootmode=open shadowrootdelegatesfocus shadowrootserializable shadowrootclonable> 12 <slot></slot> 13 </template> 14 <span class=content>Content 1</span> 15 <span class=content>Content 2</span> 16 </div> 17 18 <div data-name="template position"> 19 <span class=content>Content 1</span> 20 <template shadowrootmode=open shadowrootdelegatesfocus shadowrootserializable shadowrootclonable> 21 <slot></slot> 22 </template> 23 <span class=content>Content 2</span> 24 </div> 25 26 <div data-name="attribute position"> 27 <template shadowrootclonable shadowrootserializable shadowrootdelegatesfocus shadowrootmode=open> 28 <slot></slot> 29 </template> 30 <span class=content>Content 1</span> 31 <span class=content>Content 2</span> 32 </div> 33 34 <div data-name="both template and attribute position"> 35 <span class=content>Content 1</span> 36 <span class=content>Content 2</span> 37 <template shadowrootclonable shadowrootserializable shadowrootdelegatesfocus shadowrootmode=open> 38 <slot></slot> 39 </template> 40 </div> 41 </div> 42 43 <script> 44 function removeWhitespaceNodes(el) { 45 el.shadowRoot && removeWhitespaceNodes(el.shadowRoot); 46 var iter = document.createNodeIterator(el, NodeFilter.SHOW_TEXT, 47 (node) => (node.data.replace(/\s/g,'').length === 0) ? 48 NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_REJECT); 49 let node; 50 while (node = iter.nextNode()) { 51 node.remove(); 52 } 53 return el; 54 } 55 const serialize = (host) => host.getHTML({shadowRoots: [host.shadowRoot]}); 56 57 const testCases = Array.from(document.querySelectorAll('#tests>div')); 58 assert_true(testCases.length > 1); 59 const baseHost = removeWhitespaceNodes(testCases[0]); 60 const correctSerialization = serialize(baseHost); 61 baseHost.remove(); 62 for(let i=1;i<testCases.length;++i) { 63 const thisHost = removeWhitespaceNodes(testCases[i]); 64 test(t => { 65 assert_equals(serialize(thisHost),correctSerialization,'Serialization should be identical'); 66 thisHost.remove(); 67 },thisHost.dataset.name); 68 } 69 </script>