builtin-coverage.html (8238B)
1 <!DOCTYPE html> 2 <html is="my-html"> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="help" content="https://html.spec.whatwg.org/multipage/custom-elements.html#element-definition"> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 </head> 9 <body is="my-body"> 10 <div id="container"></div> 11 <script> 12 let testData = [ 13 {tag: 'a', interface: 'HTMLAnchorElement'}, 14 {tag: 'abbr', interface: 'HTMLElement'}, 15 {tag: 'address', interface: 'HTMLElement'}, 16 {tag: 'area', interface: 'HTMLAreaElement'}, 17 {tag: 'article', interface: 'HTMLElement'}, 18 {tag: 'aside', interface: 'HTMLElement'}, 19 {tag: 'audio', interface: 'HTMLAudioElement'}, 20 {tag: 'b', interface: 'HTMLElement'}, 21 {tag: 'base', interface: 'HTMLBaseElement'}, 22 {tag: 'bdi', interface: 'HTMLElement'}, 23 {tag: 'bdo', interface: 'HTMLElement'}, 24 {tag: 'blockquote', interface: 'HTMLQuoteElement'}, 25 {tag: 'body', interface: 'HTMLBodyElement', parsing: 'document'}, 26 {tag: 'br', interface: 'HTMLBRElement'}, 27 {tag: 'button', interface: 'HTMLButtonElement'}, 28 {tag: 'canvas', interface: 'HTMLCanvasElement'}, 29 {tag: 'caption', interface: 'HTMLTableCaptionElement', parsing: 'table'}, 30 {tag: 'cite', interface: 'HTMLElement'}, 31 {tag: 'code', interface: 'HTMLElement'}, 32 {tag: 'col', interface: 'HTMLTableColElement', parsing: 'table'}, 33 {tag: 'colgroup', interface: 'HTMLTableColElement', parsing: 'table'}, 34 {tag: 'data', interface: 'HTMLDataElement'}, 35 {tag: 'dd', interface: 'HTMLElement'}, 36 {tag: 'del', interface: 'HTMLModElement'}, 37 {tag: 'details', interface: 'HTMLDetailsElement'}, 38 {tag: 'dfn', interface: 'HTMLElement'}, 39 {tag: 'div', interface: 'HTMLDivElement'}, 40 {tag: 'dl', interface: 'HTMLDListElement'}, 41 {tag: 'dt', interface: 'HTMLElement'}, 42 {tag: 'em', interface: 'HTMLElement'}, 43 {tag: 'embed', interface: 'HTMLEmbedElement'}, 44 {tag: 'fieldset', interface: 'HTMLFieldSetElement'}, 45 {tag: 'figcaption', interface: 'HTMLElement'}, 46 {tag: 'figure', interface: 'HTMLElement'}, 47 {tag: 'footer', interface: 'HTMLElement'}, 48 {tag: 'form', interface: 'HTMLFormElement'}, 49 {tag: 'h1', interface: 'HTMLHeadingElement'}, 50 {tag: 'h2', interface: 'HTMLHeadingElement'}, 51 {tag: 'h3', interface: 'HTMLHeadingElement'}, 52 {tag: 'h4', interface: 'HTMLHeadingElement'}, 53 {tag: 'h5', interface: 'HTMLHeadingElement'}, 54 {tag: 'h6', interface: 'HTMLHeadingElement'}, 55 {tag: 'header', interface: 'HTMLElement'}, 56 {tag: 'hgroup', interface: 'HTMLElement'}, 57 {tag: 'hr', interface: 'HTMLHRElement'}, 58 {tag: 'html', interface: 'HTMLHtmlElement', parsing: 'document'}, 59 {tag: 'i', interface: 'HTMLElement'}, 60 {tag: 'iframe', interface: 'HTMLIFrameElement'}, 61 {tag: 'img', interface: 'HTMLImageElement'}, 62 {tag: 'input', interface: 'HTMLInputElement'}, 63 {tag: 'ins', interface: 'HTMLModElement'}, 64 {tag: 'kbd', interface: 'HTMLElement'}, 65 {tag: 'label', interface: 'HTMLLabelElement'}, 66 {tag: 'legend', interface: 'HTMLLegendElement'}, 67 {tag: 'li', interface: 'HTMLLIElement'}, 68 {tag: 'link', interface: 'HTMLLinkElement'}, 69 {tag: 'main', interface: 'HTMLElement'}, 70 {tag: 'map', interface: 'HTMLMapElement'}, 71 {tag: 'mark', interface: 'HTMLElement'}, 72 {tag: 'menu', interface: 'HTMLMenuElement'}, 73 {tag: 'meta', interface: 'HTMLMetaElement'}, 74 {tag: 'meter', interface: 'HTMLMeterElement'}, 75 {tag: 'nav', interface: 'HTMLElement'}, 76 {tag: 'noscript', interface: 'HTMLElement'}, 77 {tag: 'object', interface: 'HTMLObjectElement'}, 78 {tag: 'ol', interface: 'HTMLOListElement'}, 79 {tag: 'optgroup', interface: 'HTMLOptGroupElement'}, 80 {tag: 'option', interface: 'HTMLOptionElement'}, 81 {tag: 'output', interface: 'HTMLOutputElement'}, 82 {tag: 'p', interface: 'HTMLParagraphElement'}, 83 {tag: 'param', interface: 'HTMLParamElement'}, 84 {tag: 'picture', interface: 'HTMLPictureElement'}, 85 {tag: 'pre', interface: 'HTMLPreElement'}, 86 {tag: 'progress', interface: 'HTMLProgressElement'}, 87 {tag: 'q', interface: 'HTMLQuoteElement'}, 88 {tag: 'rp', interface: 'HTMLElement'}, 89 {tag: 'rt', interface: 'HTMLElement'}, 90 {tag: 'ruby', interface: 'HTMLElement'}, 91 {tag: 's', interface: 'HTMLElement'}, 92 {tag: 'samp', interface: 'HTMLElement'}, 93 {tag: 'script', interface: 'HTMLScriptElement'}, 94 {tag: 'section', interface: 'HTMLElement'}, 95 {tag: 'select', interface: 'HTMLSelectElement'}, 96 {tag: 'small', interface: 'HTMLElement'}, 97 {tag: 'source', interface: 'HTMLSourceElement'}, 98 {tag: 'span', interface: 'HTMLSpanElement'}, 99 {tag: 'strong', interface: 'HTMLElement'}, 100 {tag: 'style', interface: 'HTMLStyleElement'}, 101 {tag: 'sub', interface: 'HTMLElement'}, 102 {tag: 'summary', interface: 'HTMLElement'}, 103 {tag: 'sup', interface: 'HTMLElement'}, 104 {tag: 'table', interface: 'HTMLTableElement'}, 105 {tag: 'tbody', interface: 'HTMLTableSectionElement', parsing: 'table'}, 106 {tag: 'td', interface: 'HTMLTableCellElement', parsing: 'table'}, 107 {tag: 'template', interface: 'HTMLTemplateElement'}, 108 {tag: 'textarea', interface: 'HTMLTextAreaElement'}, 109 {tag: 'tfoot', interface: 'HTMLTableSectionElement', parsing: 'table'}, 110 {tag: 'th', interface: 'HTMLTableCellElement', parsing: 'table'}, 111 {tag: 'thead', interface: 'HTMLTableSectionElement', parsing: 'table'}, 112 {tag: 'time', interface: 'HTMLTimeElement'}, 113 {tag: 'title', interface: 'HTMLTitleElement'}, 114 {tag: 'tr', interface: 'HTMLTableRowElement', parsing: 'table'}, 115 {tag: 'track', interface: 'HTMLTrackElement'}, 116 {tag: 'u', interface: 'HTMLElement'}, 117 {tag: 'ul', interface: 'HTMLUListElement'}, 118 {tag: 'var', interface: 'HTMLElement'}, 119 {tag: 'video', interface: 'HTMLVideoElement'}, 120 {tag: 'wbr', interface: 'HTMLElement'}, 121 ]; 122 // HTMLDataListElement isn't implemented by all major browsers yet. 123 if (window.HTMLDataListElement) { 124 testData.push({tag: 'datalist', interface: 'HTMLDataListElement'}); 125 } 126 // HTMLDialogElement isn't implemented by all major browsers yet. 127 if (window.HTMLDialogElement) { 128 testData.push({tag: 'dialog', interface: 'HTMLDialogElement'}); 129 } 130 // HTMLSlotElement isn't implemented by all major browsers yet. 131 if (window.HTMLSlotElement) { 132 testData.push({tag: 'slot', interface: 'HTMLSlotElement'}); 133 } 134 135 for (const t of testData) { 136 test(() => { 137 let name = 'my-' + t.tag; 138 let klass = eval(`(class extends ${t.interface} {})`); 139 customElements.define(name, klass, { extends: t.tag }); 140 141 test(() => { 142 let customized = new klass(); 143 assert_equals(customized.constructor, klass); 144 assert_equals(customized.cloneNode().constructor, klass, 145 'Cloning a customized built-in element should succeed.'); 146 }, `${t.tag}: Operator 'new' should instantiate a customized built-in element`); 147 148 test(() => { 149 let customized = document.createElement(t.tag, { is: name }); 150 assert_equals(customized.constructor, klass); 151 assert_equals(customized.cloneNode().constructor, klass, 152 'Cloning a customized built-in element should succeed.'); 153 }, `${t.tag}: document.createElement() should instantiate a customized built-in element`); 154 155 if (t.parsing == 'document') { 156 let test = async_test(`${t.tag}: document parser should instantiate a customized built-in element`); 157 window.addEventListener('load', test.step_func_done(() => { 158 let customized = document.querySelector(t.tag); 159 assert_equals(customized.constructor, klass); 160 assert_equals(customized.cloneNode().constructor, klass, 161 'Cloning a customized built-in element should succeed.'); 162 })); 163 return; 164 } 165 test(() => { 166 let container = document.getElementById('container'); 167 if (t.parsing == 'table') { 168 container.innerHTML = `<table><${t.tag} is="${name}" id="${name}">`; 169 } else { 170 container.innerHTML = `<${t.tag} is="${name}" id="${name}">`; 171 } 172 let customized = document.getElementById(name); 173 assert_equals(customized.constructor, klass); 174 assert_equals(customized.cloneNode().constructor, klass, 175 'Cloning a customized built-in element should succeed.'); 176 }, `${t.tag}: innerHTML should instantiate a customized built-in element`); 177 178 }, `${t.tag}: Define a customized built-in element`); 179 } 180 </script> 181 </body> 182 </html>