DocumentFragment-getElementById.html (2023B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>DocumentFragment.prototype.getElementById</title> 4 <link rel="help" href="https://dom.spec.whatwg.org/#dom-nonelementparentnode-getelementbyid"> 5 <link rel="author" title="Domenic Denicola" href="mailto:d@domenic.me"> 6 7 <script src="/resources/testharness.js"></script> 8 <script src="/resources/testharnessreport.js"></script> 9 10 <template> 11 <div id="bar"> 12 <span id="foo" data-yes></span> 13 </div> 14 <div id="foo"> 15 <span id="foo"></span> 16 <ul id="bar"> 17 <li id="foo"></li> 18 </ul> 19 </div> 20 </template> 21 22 <script> 23 "use strict"; 24 25 test(() => { 26 assert_equals(typeof DocumentFragment.prototype.getElementById, "function", "It must exist on the prototype"); 27 assert_equals(typeof document.createDocumentFragment().getElementById, "function", "It must exist on an instance"); 28 }, "The method must exist"); 29 30 test(() => { 31 assert_equals(document.createDocumentFragment().getElementById("foo"), null); 32 assert_equals(document.createDocumentFragment().getElementById(""), null); 33 }, "It must return null when there are no matches"); 34 35 test(() => { 36 const frag = document.createDocumentFragment(); 37 frag.appendChild(document.createElement("div")); 38 frag.appendChild(document.createElement("span")); 39 frag.childNodes[0].id = "foo"; 40 frag.childNodes[1].id = "foo"; 41 42 assert_equals(frag.getElementById("foo"), frag.childNodes[0]); 43 }, "It must return the first element when there are matches"); 44 45 test(() => { 46 const frag = document.createDocumentFragment(); 47 frag.appendChild(document.createElement("div")); 48 frag.childNodes[0].setAttribute("id", ""); 49 50 assert_equals( 51 frag.getElementById(""), 52 null, 53 "Even if there is an element with an empty-string ID attribute, it must not be returned" 54 ); 55 }, "Empty string ID values"); 56 57 test(() => { 58 const frag = document.querySelector("template").content; 59 60 assert_true(frag.getElementById("foo").hasAttribute("data-yes")); 61 }, "It must return the first element when there are matches, using a template"); 62 </script>