Node-cloneNode-customized-builtins.html (2071B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Custom Elements: Upgrading</title> 5 <meta name="author" title="Ryosuke Niwa" href="mailto:rniwa@webkit.org"> 6 <meta name="assert" content="Node.prototype.cloneNode should upgrade a custom element"> 7 <link rel="help" href="https://html.spec.whatwg.org/#upgrades"> 8 <script src="/resources/testharness.js"></script> 9 <script src="/resources/testharnessreport.js"></script> 10 <script src="../resources/custom-elements-helpers.js"></script> 11 </head> 12 <body> 13 <div id="log"></div> 14 <script> 15 setup({allow_uncaught_exception:true}); 16 17 test(function () { 18 class MyDiv1 extends HTMLDivElement {}; 19 class MyDiv2 extends HTMLDivElement {}; 20 class MyDiv3 extends HTMLDivElement {}; 21 customElements.define('my-div1', MyDiv1, { extends: 'div' }); 22 customElements.define('my-div2', MyDiv2, { extends: 'div' }); 23 24 let instance = document.createElement('div', { is: 'my-div1'}); 25 assert_true(instance instanceof MyDiv1); 26 instance.setAttribute('is', 'my-div2'); 27 let clone = instance.cloneNode(false); 28 assert_not_equals(instance, clone); 29 assert_true(clone instanceof MyDiv1, 30 'A cloned custom element must be an instance of the custom element even with an inconsistent "is" attribute'); 31 32 let instance3 = document.createElement('div', { is: 'my-div3'}); 33 assert_false(instance3 instanceof MyDiv3); 34 instance3.setAttribute('is', 'my-div2'); 35 let clone3 = instance3.cloneNode(false); 36 assert_not_equals(instance3, clone); 37 customElements.define('my-div3', MyDiv3, { extends: 'div' }); 38 document.body.appendChild(instance3); 39 document.body.appendChild(clone3); 40 assert_true(instance3 instanceof MyDiv3, 41 'An undefined element must be upgraded even with an inconsistent "is" attribute'); 42 assert_true(clone3 instanceof MyDiv3, 43 'A cloned undefined element must be upgraded even with an inconsistent "is" attribute'); 44 }, 'Node.prototype.cloneNode(false) must be able to clone as a customized built-in element when it has an inconsistent "is" attribute'); 45 46 </script> 47 </body> 48 </html>