parser-constructs-custom-elements.html (2194B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Custom Elements: Changes to the HTML parser</title> 5 <meta name="author" title="Ryosuke Niwa" href="mailto:rniwa@webkit.org"> 6 <meta name="assert" content="HTML parser creates a custom element"> 7 <link rel="help" href="https://html.spec.whatwg.org/#create-an-element-for-the-token"> 8 <link rel="help" href="https://dom.spec.whatwg.org/#concept-create-element"> 9 <script src="/resources/testharness.js"></script> 10 <script src="/resources/testharnessreport.js"></script> 11 </head> 12 <body> 13 <div id="log"></div> 14 <my-custom-element id="instance1"></my-custom-element> 15 <script> 16 17 class MyCustomElement extends HTMLElement { }; 18 19 test(function () { 20 var customElement = document.getElementById('instance1'); 21 22 assert_true(customElement instanceof HTMLElement, 'An unresolved custom element must be an instance of HTMLElement'); 23 assert_false(customElement instanceof MyCustomElement, 'An unresolved custom element must NOT be an instance of that custom element'); 24 assert_equals(customElement.localName, 'my-custom-element'); 25 assert_equals(customElement.namespaceURI, 'http://www.w3.org/1999/xhtml', 'A custom element HTML must use HTML namespace'); 26 27 }, 'HTML parser must NOT create a custom element before customElements.define is called'); 28 29 customElements.define('my-custom-element', MyCustomElement); 30 31 </script> 32 <my-custom-element id="instance2"></my-custom-element> 33 <script> 34 35 test(function () { 36 var customElement = document.getElementById('instance2'); 37 38 assert_true(customElement instanceof HTMLElement, 'A resolved custom element must be an instance of HTMLElement'); 39 assert_false(customElement instanceof HTMLUnknownElement, 'A resolved custom element must NOT be an instance of HTMLUnknownElement'); 40 assert_true(customElement instanceof MyCustomElement, 'A resolved custom element must be an instance of that custom element'); 41 assert_equals(customElement.localName, 'my-custom-element'); 42 assert_equals(customElement.namespaceURI, 'http://www.w3.org/1999/xhtml', 'A custom element HTML must use HTML namespace'); 43 44 }, 'HTML parser must create a defined custom element before executing inline scripts'); 45 46 </script> 47 </body> 48 </html>