| OLD | NEW |
| (Empty) |
| 1 <html> | |
| 2 <import src="../resources/chai.sky" /> | |
| 3 <import src="../resources/mocha.sky" /> | |
| 4 <body> | |
| 5 <div id="container"></div> | |
| 6 <script> | |
| 7 describe('document.registerElement()', function() { | |
| 8 it('should have basic behaviors', function() { | |
| 9 function createRegisterParameters() | |
| 10 { | |
| 11 return { | |
| 12 prototype: Object.create(HTMLElement.prototype, { thisIsPrototype: {
value: true } }) | |
| 13 }; | |
| 14 } | |
| 15 | |
| 16 var fooConstructor = document.registerElement('x-foo', createRegisterParamet
ers()); | |
| 17 assert.equal(typeof fooConstructor, "function"); | |
| 18 assert.equal(fooConstructor.prototype.__proto__, HTMLElement.prototype); | |
| 19 assert.ok(fooConstructor.prototype.thisIsPrototype); | |
| 20 | |
| 21 // Bad prototype: prototype is already a built-in interface prototype object | |
| 22 assert.throws(function() { | |
| 23 document.registerElement("x-bad-a", HTMLElement) | |
| 24 }); | |
| 25 // Bad prototype: prototype is already a Custom Element interface prototype
object | |
| 26 assert.throws(function() { | |
| 27 document.registerElement("x-bad-b", fooConstructor) | |
| 28 }); | |
| 29 // Bad prototype: 'constructor' is not configurable | |
| 30 var proto = Object.create(HTMLElement.prototype, { | |
| 31 constructor: {configurable: false, writable: true} | |
| 32 }); | |
| 33 assert.throws(function() { | |
| 34 document.registerElement("x-bad-c", { prototype: proto }) | |
| 35 }); | |
| 36 // Call as function | |
| 37 assert.throws(function() { | |
| 38 fooConstructor() | |
| 39 }) | |
| 40 | |
| 41 // Constructor initiated instantiation | |
| 42 var createdFoo = new fooConstructor(); | |
| 43 | |
| 44 // JS built-in properties | |
| 45 assert.equal(createdFoo.__proto__, fooConstructor.prototype); | |
| 46 assert.equal(createdFoo.constructor, fooConstructor); | |
| 47 | |
| 48 // Native getter | |
| 49 assert.equal(createdFoo.tagName, "x-foo"); | |
| 50 | |
| 51 // Native setter | |
| 52 createdFoo.textContent = 'Hello'; | |
| 53 assert.equal(createdFoo.textContent, "Hello"); | |
| 54 | |
| 55 // Native method | |
| 56 var childDiv = document.createElement('div'); | |
| 57 createdFoo.appendChild(childDiv); | |
| 58 assert.equal(createdFoo.lastChild, childDiv); | |
| 59 | |
| 60 // Parser initiated instantiation | |
| 61 var container = document.getElementById('container'); | |
| 62 container.appendChild(document.createElement("x-foo")); | |
| 63 var parsedFoo = container.firstChild; | |
| 64 | |
| 65 assert.equal(parsedFoo.__proto__, fooConstructor.prototype); | |
| 66 assert.equal(parsedFoo.tagName, "x-foo"); | |
| 67 | |
| 68 // Ensuring the wrapper is retained | |
| 69 parsedFoo.someProperty = 'hello'; | |
| 70 assert.equal(parsedFoo.someProperty, container.firstChild.someProperty); | |
| 71 | |
| 72 // Having another constructor | |
| 73 var barConstructor = document.registerElement('x-bar', createRegisterParamet
ers()); | |
| 74 assert.ok('barConstructor !== fooConstructor'); | |
| 75 var createdBar = new barConstructor(); | |
| 76 assert.equal(createdBar.tagName, "x-bar"); | |
| 77 | |
| 78 // Having a subclass | |
| 79 var bazConstructor = document.registerElement('x-baz', { prototype: Object.c
reate(fooConstructor.prototype, { thisIsAlsoPrototype: { value: true } }) }); | |
| 80 var createdBaz = new bazConstructor(); | |
| 81 assert.equal(createdBaz.tagName, "x-baz"); | |
| 82 assert.ok(createdBaz.thisIsPrototype); | |
| 83 assert.ok(createdBaz.thisIsAlsoPrototype); | |
| 84 | |
| 85 // With irregular cases | |
| 86 var createdUpperBar = document.createElement('X-BAR'); | |
| 87 var createdMixedBar = document.createElement('X-Bar'); | |
| 88 assert.notEqual(createdUpperBar.constructor, barConstructor); | |
| 89 assert.notEqual(createdUpperBar.tagName, "x-bar"); | |
| 90 assert.notEqual(createdMixedBar.constructor, barConstructor); | |
| 91 assert.notEqual(createdMixedBar.tagName, "x-bar"); | |
| 92 | |
| 93 // Constructors shouldn't interfere with each other | |
| 94 assert.equal((new fooConstructor).tagName, "x-foo"); | |
| 95 assert.equal((new barConstructor).tagName, "x-bar"); | |
| 96 assert.equal((new bazConstructor).tagName, "x-baz"); | |
| 97 }); | |
| 98 }); | |
| 99 </script> | |
| 100 </body> | |
| 101 </html> | |
| OLD | NEW |