| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>Instantiation of custom element: custom element type is given as the value of the IS attribute</title> |
| <meta name="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> |
| <meta name="author" title="Aleksei Yu. Semenov" href="mailto:a.semenov@unipro.ru"> |
| <meta name="assert" content="The custom element type is given to a custom element at the time of its instantation in one of the two ways: ... 2. As the value of the IS attribute of the custom element."> |
| <link rel="help" href="http://www.w3.org/TR/custom-elements/#instantiating-custom-elements"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="../testcommon.js"></script> |
| <link rel="stylesheet" href="/resources/testharness.css"> |
| </head> |
| <body> |
| <div id="log"></div> |
| <script> |
| test(function() { |
| var doc = newHTMLDocument(); |
| HTML5_ELEMENTS.forEach(function(tagName) { |
| if (HTML5_DOCUMENT_ELEMENTS.indexOf(tagName) !== -1) { |
| return; |
| } |
| var obj = doc.createElement(tagName); |
| var name = 'x-a-' + tagName; |
| var proto = Object.create(obj.constructor.prototype); |
| var GeneratedConstructor = doc.registerElement(name, {prototype: proto, extends: tagName}); |
| |
| if (HTML5_TABLE_ELEMENTS.indexOf(tagName) !== -1) { |
| doc.body.innerHTML = |
| '<table>' + |
| '<' + tagName + ' id="custom-element" is="' + name + '"></' + tagName + '>' + |
| '</table>'; |
| } else { |
| doc.body.innerHTML = |
| '<' + tagName + ' id="custom-element" is="' + name + '"></' + tagName + '>'; |
| } |
| var customElement = doc.querySelector('#custom-element'); |
| assert_equals(Object.getPrototypeOf(customElement), GeneratedConstructor.prototype, |
| 'Custom element type should be the type, specified as value of IS attribute'); |
| }); |
| }, 'Instantiation of custom element: custom element type is given as the value of ' + |
| 'the IS attribute'); |
| |
| |
| test(function() { |
| var doc = newHTMLDocument(); |
| HTML5_ELEMENTS.forEach(function(tagName) { |
| if (HTML5_DOCUMENT_ELEMENTS.indexOf(tagName) !== -1) { |
| return; |
| } |
| var obj = doc.createElement(tagName); |
| var name = 'x-b-' + tagName; |
| if (HTML5_TABLE_ELEMENTS.indexOf(tagName) !== -1) { |
| doc.body.innerHTML = |
| '<table>' + |
| '<' + tagName + ' id="custom-element" is="' + name + '"></' + tagName + '>' + |
| '</table>'; |
| } else { |
| doc.body.innerHTML = |
| '<' + tagName + ' id="custom-element" is="' + name + '"></' + tagName + '>'; |
| } |
| var proto = Object.create(obj.constructor.prototype); |
| var GeneratedConstructor = doc.registerElement(name, {prototype: proto, extends: tagName}); |
| |
| var customElement = doc.querySelector('#custom-element'); |
| |
| assert_equals(Object.getPrototypeOf(customElement), GeneratedConstructor.prototype, |
| 'Custom element type should be the type, specified as value of IS attribute'); |
| }); |
| }, 'Instantiation of custom element: custom element type is given as the value ' + |
| 'of the IS attribute. Custom element is unresolved at first'); |
| </script> |
| </body> |
| </html> |