| <!DOCTYPE html> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <script src="spec/resources/custom-elements-helpers.js"></script> |
| <body> |
| <script> |
| 'use strict'; |
| |
| test_with_window((w) => { |
| class X extends w.HTMLElement {} |
| |
| w.customElements.define('new-old', X); |
| assert_throws(null, () => { |
| w.document.registerElement('new-old', {prototype: X.prototype}); |
| }, '"registering" (v0) a name already "defined" should throw'); |
| |
| w.document.registerElement('old-new', { |
| prototype: Object.create(w.HTMLElement.prototype) |
| }); |
| class Y extends w.HTMLElement {} |
| assert_throws(null, () => { |
| w.customElements.define('old-new', Y); |
| }, '"defining" (v1) a name already "registered" (v0) should throw'); |
| }, 'Overlapping old and new-style custom elements are not allowed'); |
| |
| test_with_window((w) => { |
| var A = w.document.registerElement('a-a', { |
| prototype: Object.create(w.HTMLDivElement.prototype), |
| extends: 'div' |
| }); |
| var a = w.document.createElement('div', 'a-a'); |
| |
| assert_true(a instanceof A, |
| 'V0 createElement syntax works with V0 registerElement'); |
| assert_throws_dom_exception(w, 'NotFoundError', () => { |
| w.document.createElement('div', {is: 'a-a'}); |
| }, 'V1 createElement syntax does not work with V0 registerElement'); |
| |
| class B extends w.HTMLDivElement { |
| constructor() { |
| super(); |
| this.addEventListener("click", () => { |
| console.log("CLICKED B!"); |
| }); |
| } |
| } |
| w.customElements.define('b-b', B, {extends: 'div' }); |
| |
| assert_true(w.document.createElement('div', {is: 'b-b'}) instanceof B, |
| 'V1 createElement syntax works with V1 defined element'); |
| assert_true(w.document.createElement('div', 'b-b') instanceof w.HTMLDivElement, |
| 'V0 createElement syntax does not work with V1 defined element'); |
| }, 'V0 and V1 definition and createElement cannot be used together'); |
| </script> |