diff --git a/README.md b/README.md index 15ec3b8..294ecac 100644 --- a/README.md +++ b/README.md @@ -37,7 +37,7 @@ The `` tag provides a mechanism to encapsulate HTML, CSS, and JavaScrip // Has built-in 'window' protection. this.register({ prototype: { - readyCallback: function() { + createdCallback: function() { this.innerHTML = section.innerHTML; }, foo: function() { @@ -69,7 +69,7 @@ As before, custom elements built this way work just like standard elements. Here's the imperative version of the previous example: var XFooPrototype = Object.create(HTMLElement.prototype); - XFooPrototype.readyCallback = function() { + XFooPrototype.createdCallback = function() { this.textContent = "I'm an x-foo!"; }; XFooPrototype.foo = function() { @@ -90,7 +90,7 @@ declare the type using the `extends` option when calling `document.register()`: Example extending `button`: var XFooButtonPrototype = Object.create(HTMLButtonElement.prototype); - XFooButtonPrototype.readyCallback = function() { + XFooButtonPrototype.createdCallback = function() { this.textContent = "I'm an x-foo button!"; }; @@ -121,7 +121,7 @@ This can also be used to create an instance: xFooButton.foo(); // "foo() called" Browser limitations require that we supply the constructor while you supply the `prototype`. -Use the `readyCallback` to do initialization work that might otherwise be in a constructor. +Use the `createdCallback` to do initialization work that might otherwise be in a constructor. ## Polyfill details @@ -152,12 +152,12 @@ Example: The Custom Elements specification is still under discussion. The polyfill implements certain features in advance of the specification. In particular, there are several notification callback methods that are used if implemented on the element prototype. -* `readyCallback()` is called when a custom element is created. -* `insertedCallback()` is called when a custom element is inserted into a DOM subtree. -* `removedCallback()` is called when a custom element is removed from a DOM subtree. +* `createdCallback()` is called when a custom element is created. +* `enteredDocumentCallback()` is called when a custom element is inserted into a DOM subtree. +* `leftDocumentCallback()` is called when a custom element is removed from a DOM subtree. * `attributeChangedCallback(attributeName)` is called when a custom element's attribute value has changed -`readyCallback` is invoked _synchronously_ with element instantiation, the other callbacks are called _asyncronously_. The asynchronous callbacks generally use the MutationObserver timing model, which means they are called before layouts, paints, or other triggered events, so the developer need not worry about flashing content or other bad things happening before the callback has a chance to react to changes. +`createdCallback` is invoked _synchronously_ with element instantiation, the other callbacks are called _asyncronously_. The asynchronous callbacks generally use the MutationObserver timing model, which means they are called before layouts, paints, or other triggered events, so the developer need not worry about flashing content or other bad things happening before the callback has a chance to react to changes. The `extends` option to `document.register()` (discussed above) is exclusive to this polyfill. diff --git a/build.json b/build.json index 92394bd..b3bdc42 100644 --- a/build.json +++ b/build.json @@ -5,7 +5,6 @@ "src/MutationObserver.js", "src/Observer.js", "src/CustomElements.js", - "src/HTMLElementElement.js", "src/Parser.js", "src/boot.js" ] diff --git a/custom-elements.js b/custom-elements.js index 5d56909..bde9214 100644 --- a/custom-elements.js +++ b/custom-elements.js @@ -14,7 +14,6 @@ var modules = [ 'src/MutationObserver.js', 'src/Observer.js', 'src/CustomElements.js', - 'src/HTMLElementElement.js', 'src/Parser.js', 'src/boot.js' ]; @@ -32,10 +31,10 @@ var script = document.querySelector('script[src*="' + thisFile + '"]'); var src = script.attributes.src.value; var basePath = src.slice(0, src.indexOf(thisFile)); -if (!window.Loader) { +if (!window.PolymerLoader) { var path = basePath + 'tools/loader/loader.js'; document.write(''); } -document.write(''); +document.write(''); })(); diff --git a/src/CustomElements.js b/src/CustomElements.js index 56d4569..2d79026 100644 --- a/src/CustomElements.js +++ b/src/CustomElements.js @@ -42,6 +42,7 @@ if (useNative) { scope.watchShadow = nop; scope.watchAllShadows = nop; + scope.upgrade = nop; scope.upgradeAll = nop; scope.upgradeSubtree = nop; scope.observeDocument = nop; @@ -211,10 +212,10 @@ if (useNative) { // flag as upgraded inElement.__upgraded__ = true; // there should never be a shadow root on inElement at this point - // we require child nodes be upgraded before ready + // we require child nodes be upgraded before `created` scope.upgradeSubtree(inElement); // lifecycle management - ready(inElement); + created(inElement); // OUTPUT return inElement; } @@ -256,10 +257,10 @@ if (useNative) { } } - function ready(inElement) { - // invoke readyCallback - if (inElement.readyCallback) { - inElement.readyCallback(); + function created(inElement) { + // invoke createdCallback + if (inElement.createdCallback) { + inElement.createdCallback(); } } @@ -302,12 +303,14 @@ if (useNative) { }; } - function createElement(inTag) { - var definition = registry[inTag]; + function createElement(tag, typeExtension) { + // TODO(sjmiles): ignore 'tag' when using 'typeExtension', we could + // error check it, or perhaps there should only ever be one argument + var definition = registry[typeExtension || tag]; if (definition) { return new definition.ctor(); } - return domCreateElement(inTag); + return domCreateElement(tag, typeExtension); } function upgradeElement(inElement) { diff --git a/src/HTMLElementElement.js b/src/HTMLElementElement.js deleted file mode 100644 index 3247f6f..0000000 --- a/src/HTMLElementElement.js +++ /dev/null @@ -1,134 +0,0 @@ -/* - * Copyright 2013 The Polymer Authors. All rights reserved. - * Use of this source code is governed by a BSD-style - * license that can be found in the LICENSE file. - */ - -(function(){ - -var HTMLElementElement = function(inElement) { - inElement.register = HTMLElementElement.prototype.register; - parseElementElement(inElement); - return inElement; -}; - -HTMLElementElement.prototype = { - register: function(inMore) { - if (inMore) { - this.options.lifecycle = inMore.lifecycle; - if (inMore.prototype) { - mixin(this.options.prototype, inMore.prototype); - } - } - } -}; - -function parseElementElement(inElement) { - // options to glean from inElement attributes - var options = { - name: '', - extends: null - }; - // glean them - takeAttributes(inElement, options); - // default base - var base = HTMLElement.prototype; - // optional specified base - if (options.extends) { - // build an instance of options.extends - var archetype = document.createElement(options.extends); - // acquire the prototype - // TODO(sjmiles): __proto__ may be hinted by the custom element - // system on platforms that don't support native __proto__ - // on those platforms the API is mixed into archetype and the - // effective base is not archetype's real prototype - base = archetype.__proto__ || Object.getPrototypeOf(archetype); - } - // extend base - options.prototype = Object.create(base); - // install options - inElement.options = options; - // locate user script - var script = inElement.querySelector('script:not([type]),script[type="text/javascript"],scripts'); - if (script) { - // execute user script in 'inElement' context - executeComponentScript(script.textContent, inElement, options.name); - }; - // register our new element - var ctor = document.register(options.name, options); - inElement.ctor = ctor; - // store optional constructor reference - var refName = inElement.getAttribute('constructor'); - if (refName) { - window[refName] = ctor; - } -} - -// each property in inDictionary takes a value -// from the matching attribute in inElement, if any -function takeAttributes(inElement, inDictionary) { - for (var n in inDictionary) { - var a = inElement.attributes[n]; - if (a) { - inDictionary[n] = a.value; - } - } -} - -// invoke inScript in inContext scope -function executeComponentScript(inScript, inContext, inName) { - // set (highlander) context - context = inContext; - // source location - var owner = context.ownerDocument; - var url = (owner._URL || owner.URL || owner.impl - && (owner.impl._URL || owner.impl.URL)); - // ensure the component has a unique source map so it can be debugged - // if the name matches the filename part of the owning document's url, - // use this, otherwise, add ":" to the document url. - var match = url.match(/.*\/([^.]*)[.]?.*$/); - if (match) { - var name = match[1]; - url += name != inName ? ':' + inName : ''; - } - // compose script - var code = "__componentScript('" - + inName - + "', function(){" - + inScript - + "});" - + "\n//# sourceURL=" + url + "\n" - ; - // inject script - eval(code); -} - -var context; - -// global necessary for script injection -window.__componentScript = function(inName, inFunc) { - inFunc.call(context); -}; - -// utility - -// copy top level properties from props to obj -function mixin(obj, props) { - obj = obj || {}; - try { - Object.getOwnPropertyNames(props).forEach(function(n) { - var pd = Object.getOwnPropertyDescriptor(props, n); - if (pd) { - Object.defineProperty(obj, n, pd); - } - }); - } catch(x) { - } - return obj; -} - -// exports - -window.HTMLElementElement = HTMLElementElement; - -})(); diff --git a/src/Observer.js b/src/Observer.js index a0eb1d9..7fc9db7 100644 --- a/src/Observer.js +++ b/src/Observer.js @@ -118,7 +118,7 @@ function inserted(element) { // TODO(sjmiles): when logging, do work on all custom elements so we can // track behavior even when callbacks not defined //console.log('inserted: ', element.localName); - if (element.insertedCallback || (element.__upgraded__ && logFlags.dom)) { + if (element.enteredDocumentCallback || (element.__upgraded__ && logFlags.dom)) { logFlags.dom && console.group('inserted:', element.localName); if (inDocument(element)) { element.__inserted = (element.__inserted || 0) + 1; @@ -130,9 +130,9 @@ function inserted(element) { if (element.__inserted > 1) { logFlags.dom && console.warn('inserted:', element.localName, 'insert/remove count:', element.__inserted) - } else if (element.insertedCallback) { + } else if (element.enteredDocumentCallback) { logFlags.dom && console.log('inserted:', element.localName); - element.insertedCallback(); + element.enteredDocumentCallback(); } } logFlags.dom && console.groupEnd(); @@ -149,7 +149,7 @@ function removedNode(node) { function removed(element) { // TODO(sjmiles): temporary: do work on all custom elements so we can track // behavior even when callbacks not defined - if (element.removedCallback || (element.__upgraded__ && logFlags.dom)) { + if (element.leftDocumentCallback || (element.__upgraded__ && logFlags.dom)) { logFlags.dom && console.log('removed:', element.localName); if (!inDocument(element)) { element.__inserted = (element.__inserted || 0) - 1; @@ -161,8 +161,8 @@ function removed(element) { if (element.__inserted < 0) { logFlags.dom && console.warn('removed:', element.localName, 'insert/remove count:', element.__inserted) - } else if (element.removedCallback) { - element.removedCallback(); + } else if (element.leftDocumentCallback) { + element.leftDocumentCallback(); } } } diff --git a/src/Parser.js b/src/Parser.js index 501f694..a65987c 100644 --- a/src/Parser.js +++ b/src/Parser.js @@ -14,12 +14,10 @@ var IMPORT_LINK_TYPE = window.HTMLImports ? HTMLImports.IMPORT_LINK_TYPE : 'none var parser = { selectors: [ - 'link[rel=' + IMPORT_LINK_TYPE + ']', - 'element' + 'link[rel=' + IMPORT_LINK_TYPE + ']' ], map: { - link: 'parseLink', - element: 'parseElement' + link: 'parseLink' }, parse: function(inDocument) { if (!inDocument.__parsed) { @@ -48,9 +46,6 @@ var parser = { if (linkElt.content) { parser.parse(linkElt.content); } - }, - parseElement: function(inElementElt) { - new HTMLElementElement(inElementElt); } }; diff --git a/test/html/attributes.html b/test/html/attributes.html index 914dce7..aee01f0 100644 --- a/test/html/attributes.html +++ b/test/html/attributes.html @@ -7,29 +7,24 @@ - - - - - - - - - - - - - diff --git a/test/js/customElements.js b/test/js/customElements.js index e3914bc..c9f3514 100644 --- a/test/js/customElements.js +++ b/test/js/customElements.js @@ -104,9 +104,9 @@ assert.equal(xbarbarbar.textContent, 'x-barbarbar'); }); - test('document.register readyCallback in prototype', function() { + test('document.register createdCallback in prototype', function() { var XBooPrototype = Object.create(HTMLElement.prototype); - XBooPrototype.readyCallback = function() { + XBooPrototype.createdCallback = function() { this.style.fontStyle = 'italic'; } var XBoo = document.register('x-boo', { @@ -116,8 +116,8 @@ assert.equal(xboo.style.fontStyle, 'italic'); // var XBooBooPrototype = Object.create(XBooPrototype); - XBooBooPrototype.readyCallback = function() { - XBoo.prototype.readyCallback.call(this); + XBooBooPrototype.createdCallback = function() { + XBoo.prototype.createdCallback.call(this); this.style.fontSize = '32pt'; }; var XBooBoo = document.register('x-booboo', { @@ -130,16 +130,16 @@ }); - test('document.register [ready|inserted|removed]Callbacks in prototype', function(done) { + test('document.register [created|enteredDocument|leftDocument]Callbacks in prototype', function(done) { var ready, inserted, removed; var XBooPrototype = Object.create(HTMLElement.prototype); - XBooPrototype.readyCallback = function() { + XBooPrototype.createdCallback = function() { ready = true; } - XBooPrototype.insertedCallback = function() { + XBooPrototype.enteredDocumentCallback = function() { inserted = true; } - XBooPrototype.removedCallback = function() { + XBooPrototype.leftDocumentCallback = function() { removed = true; } var XBoo = document.register('x-boo-ir', { @@ -150,22 +150,24 @@ assert(!inserted, 'inserted must be false [XBoo]'); assert(!removed, 'removed must be false [XBoo]'); work.appendChild(xboo); - setTimeout(function() { + CustomElements.takeRecords(); + //setTimeout(function() { assert(inserted, 'inserted must be true [XBoo]'); work.removeChild(xboo); - setTimeout(function() { + CustomElements.takeRecords(); + //setTimeout(function() { assert(removed, 'removed must be true [XBoo]'); // ready = inserted = removed = false; var XBooBooPrototype = Object.create(XBooPrototype); - XBooBooPrototype.readyCallback = function() { - XBoo.prototype.readyCallback.call(this); + XBooBooPrototype.createdCallback = function() { + XBoo.prototype.createdCallback.call(this); }; - XBooBooPrototype.insertedCallback = function() { - XBoo.prototype.insertedCallback.call(this); + XBooBooPrototype.enteredDocumentCallback = function() { + XBoo.prototype.enteredDocumentCallback.call(this); }; - XBooBooPrototype.removedCallback = function() { - XBoo.prototype.removedCallback.call(this); + XBooBooPrototype.leftDocumentCallback = function() { + XBoo.prototype.leftDocumentCallback.call(this); }; var XBooBoo = document.register('x-booboo-ir', { prototype: XBooBooPrototype, @@ -176,81 +178,18 @@ assert(!inserted, 'inserted must be false [XBooBoo]'); assert(!removed, 'removed must be false [XBooBoo]'); work.appendChild(xbooboo); - setTimeout(function() { + CustomElements.takeRecords(); + //setTimeout(function() { assert(inserted, 'inserted must be true [XBooBoo]'); work.removeChild(xbooboo); - setTimeout(function() { - assert(removed, 'removed must be true [XBooBoo]'); - done(); - }, 0); - }, 0); - }, 0); - }, 0); - }); - - test('document.register [ready|inserted|removed]Callbacks in prototype in ShadowDOM', function(done) { - var ready, inserted, removed; - var XBoo2Prototype = Object.create(HTMLElement.prototype); - XBoo2Prototype.readyCallback = function() { - ready = true; - } - XBoo2Prototype.insertedCallback = function() { - inserted = true; - } - XBoo2Prototype.removedCallback = function() { - removed = true; - } - var XBoo2 = document.register('x-boo2-ir', { - prototype: XBoo2Prototype - }); - var xboo = new XBoo2(); - assert(ready, 'ready must be true [XBoo2]'); - assert(!inserted, 'inserted must be false [XBoo2]'); - assert(!removed, 'removed must be false [XBoo2]'); - work.innerHTML = '
'; - div = work.firstChild; - var olderRoot = div.webkitCreateShadowRoot(); - var root = div.webkitCreateShadowRoot(); - root.host = olderRoot.host = div; - root.olderShadowRoot = olderRoot; - CustomElements.watchShadow(div); - olderRoot.appendChild(xboo); - setTimeout(function() { - assert(inserted, 'inserted must be true [XBoo2]'); - olderRoot.removeChild(xboo); - setTimeout(function() { - assert(removed, 'removed must be true [XBoo2]'); - // - ready = inserted = removed = false; - var XBooBoo2Prototype = Object.create(XBoo2Prototype); - XBooBoo2Prototype.readyCallback = function() { - XBoo2.prototype.readyCallback.call(this); - }; - XBooBoo2Prototype.insertedCallback = function() { - XBoo2.prototype.insertedCallback.call(this); - }; - XBooBoo2Prototype.removedCallback = function() { - XBoo2.prototype.removedCallback.call(this); - }; - var XBooBoo2 = document.register('x-booboo2-ir', { - prototype: XBooBoo2Prototype, - extends: 'x-boo2-ir' - }); - var xbooboo = new XBooBoo2(); - assert(ready, 'ready must be true [XBooBoo]'); - assert(!inserted, 'inserted must be false [XBooBoo]'); - assert(!removed, 'removed must be false [XBooBoo]'); - olderRoot.appendChild(xbooboo); - setTimeout(function() { - assert(inserted, 'inserted must be true [XBooBoo]'); - olderRoot.removeChild(xbooboo); - setTimeout(function() { + CustomElements.takeRecords(); + //setTimeout(function() { assert(removed, 'removed must be true [XBooBoo]'); done(); - }, 0); - }, 0); - }, 0); - }, 0); + //}, 1); + //}, 1); + //}, 1); + //}, 1); }); test('document.register attributeChangedCallback in prototype', function(done) { @@ -271,7 +210,7 @@ test('node.cloneNode upgrades', function(done) { var XBooPrototype = Object.create(HTMLElement.prototype); - XBooPrototype.readyCallback = function() { + XBooPrototype.createdCallback = function() { this.__ready__ = true; }; var XBoo = document.register('x-boo-clone', { @@ -281,7 +220,7 @@ work.appendChild(xboo); setTimeout(function() { var xboo2 = xboo.cloneNode(true); - assert(xboo2.__ready__, 'clone readyCallback must be called'); + assert(xboo2.__ready__, 'clone createdCallback must be called'); done(); }, 0); }); @@ -289,5 +228,4 @@ htmlSuite('customElements (html)', function() { htmlTest('html/attributes.html'); - htmlTest('html/descriptors.html'); }); diff --git a/test/js/htmlElementElement.js b/test/js/htmlElementElement.js deleted file mode 100644 index 012eeeb..0000000 --- a/test/js/htmlElementElement.js +++ /dev/null @@ -1,105 +0,0 @@ -/* - * Copyright 2013 The Polymer Authors. All rights reserved. - * Use of this source code is governed by a BSD-style - * license that can be found in the LICENSE file. - */ - -suite('htmlElementElement', function() { - var assert = chai.assert; - - var work; - - setup(function() { - work = document.createElement('div'); - document.body.appendChild(work); - }); - - teardown(function() { - document.body.removeChild(work); - }); - - test('component upgraded', function() { - work.innerHTML = '' + - 'Foo'; - new HTMLElementElement(work.querySelector('element')); - var xtest = work.lastChild; - CustomElements.upgrade(xtest); - assert.equal(xtest.__upgraded__, true); - }); - - test('component with script', function() { - work.innerHTML = '' + - '' + - '' + - ''; - new HTMLElementElement(work.querySelector('element')); - var x = work.lastChild; - CustomElements.upgrade(x); - assert.equal(x.__upgraded__, true); - assert.equal(x.value, 'x-test-script-element'); - }); - - test('readyCallback in prototype', function() { - work.innerHTML = '' + - '' + - '' + - ''; - new HTMLElementElement(work.querySelector('element')); - var x = work.lastChild; - CustomElements.upgrade(x); - assert.equal(x.textContent, 'Hello World'); - }); - - test('extend element', function() { - work.innerHTML = '' + - '' + - '' + - '' + - ''; - new HTMLElementElement(work.querySelector('[name=x-foo]')); - new HTMLElementElement(work.querySelector('[name=x-babar]')); - var x = work.lastChild; - CustomElements.upgrade(x); - assert.equal(x.value, 'fooValue'); - }); - - test('extend native element', function() { - work.innerHTML = '' + - '' + - '' + - ''; - new HTMLElementElement(work.querySelector('element')); - var x = work.lastChild; - CustomElements.upgrade(x); - assert.equal(x.type, 'submit'); - assert.equal(x.textContent, 'Hello World'); - }); -}); diff --git a/test/js/observe.js b/test/js/observe.js index 25f48a0..5520301 100644 --- a/test/js/observe.js +++ b/test/js/observe.js @@ -32,115 +32,48 @@ suite('observe', function() { } test('custom element automatically upgrades', function(done) { - registerTestComponent('x-auto', 'auto'); work.innerHTML = ''; var x = work.firstChild; assert.isUndefined(x.value); - setTimeout(function() { - assert.equal(x.value, 'auto'); - done(); - }, 0); + registerTestComponent('x-auto', 'auto'); + assert.equal(x.value, 'auto'); + done(); }); - + test('custom element automatically upgrades in subtree', function(done) { - registerTestComponent('x-auto-sub', 'auto-sub'); work.innerHTML = '
'; var target = work.firstChild; - setTimeout(function() { - target.innerHTML = ''; - var x = target.firstChild; - assert.isUndefined(x.value); - setTimeout(function() { - assert.equal(x.value, 'auto-sub'); - done(); - }, 0); - }, 0); + target.innerHTML = ''; + var x = target.firstChild; + assert.isUndefined(x.value); + registerTestComponent('x-auto-sub', 'auto-sub'); + assert.equal(x.value, 'auto-sub'); + done(); }); - - + test('custom elements automatically upgrade', function(done) { registerTestComponent('x-auto1', 'auto1'); registerTestComponent('x-auto2', 'auto2'); work.innerHTML = '
' + '
' + '
'; - setTimeout(function() { - testElements(work, 'x-auto1', 'auto1'); - testElements(work, 'x-auto2', 'auto2'); - done(); - }, 0); + CustomElements.takeRecords(); + testElements(work, 'x-auto1', 'auto1'); + testElements(work, 'x-auto2', 'auto2'); + done(); }); - - + test('custom elements automatically upgrade in subtree', function(done) { registerTestComponent('x-auto-sub1', 'auto-sub1'); registerTestComponent('x-auto-sub2', 'auto-sub2'); work.innerHTML = '
'; var target = work.firstChild; - setTimeout(function() { - target.innerHTML = '
' + - '
' + - '
'; - setTimeout(function() { - testElements(target, 'x-auto-sub1', 'auto-sub1'); - testElements(target, 'x-auto-sub2', 'auto-sub2'); - done(); - }, 0); - }, 0); - + target.innerHTML = '
' + + '
' + + '
'; + CustomElements.takeRecords(); + testElements(target, 'x-auto-sub1', 'auto-sub1'); + testElements(target, 'x-auto-sub2', 'auto-sub2'); + done(); }); - - // test ShadowDOM only in webkit for now... - if (HTMLElement.prototype.webkitCreateShadowRoot) { - test('custom element automatically upgrades in ShadowDOM', function(done) { - registerTestComponent('x-auto-shadow', 'auto-shadow'); - work.innerHTML = '
'; - var div = work.firstChild; - var root = div.webkitCreateShadowRoot(); - CustomElements.watchShadow(root); - root.innerHTML = ''; - var x = root.firstChild; - assert.isUndefined(x.value); - setTimeout(function() { - assert.equal(x.value, 'auto-shadow'); - done(); - }, 0); - }); - - test('custom element automatically upgrades in ShadowDOM subtree', function(done) { - registerTestComponent('x-sub', 'sub'); - work.innerHTML = '
'; - var div = work.firstChild; - var root = div.webkitCreateShadowRoot(); - root.innerHTML = '
'; - CustomElements.watchShadow(root); - var target = root.firstChild; - target.innerHTML = ''; - var x = target.firstChild; - assert.isUndefined(x.value); - setTimeout(function() { - assert.equal(x.value, 'sub'); - done(); - }, 0); - }); - - test('custom element automatically upgrades in older shadow subtree', function(done) { - registerTestComponent('x-sub2', 'sub2'); - work.innerHTML = '
'; - var div = work.firstChild; - var root = div.webkitCreateShadowRoot(); - var youngerRoot = div.webkitCreateShadowRoot(); - youngerRoot.olderShadowRoot = root; - root.innerHTML = '
'; - CustomElements.watchShadow(div); - var target = root.firstChild; - target.innerHTML = ''; - var x = target.firstChild; - assert.isUndefined(x.value); - setTimeout(function() { - assert.equal(x.value, 'sub2'); - done(); - }, 0); - }); - } }); diff --git a/test/js/upgrade.js b/test/js/upgrade.js index 515b508..04d30ee 100644 --- a/test/js/upgrade.js +++ b/test/js/upgrade.js @@ -26,26 +26,25 @@ suite('upgradeElements', function() { } test('CustomElements.upgrade upgrades custom element syntax', function() { - registerTestComponent('x-foo', 'foo'); - work.innerHTML = 'Foo'; + registerTestComponent('x-foo31', 'foo'); + work.innerHTML = 'Foo'; var xfoo = work.firstChild; CustomElements.upgrade(xfoo); assert.equal(xfoo.value, 'foo'); }); test('mutation observer upgrades custom element syntax', function(done) { - registerTestComponent('x-foo', 'foo'); - work.innerHTML = 'Foo'; + registerTestComponent('x-foo32', 'foo'); + work.innerHTML = 'Foo'; + CustomElements.takeRecords(); var xfoo = work.firstChild; - setTimeout(function() { - assert.equal(xfoo.value, 'foo'); - done(); - }); + assert.equal(xfoo.value, 'foo'); + done(); }); test('document.register upgrades custom element syntax', function() { - work.innerHTML = 'Foo'; - registerTestComponent('x-foo', 'foo'); + work.innerHTML = 'Foo'; + registerTestComponent('x-foo33', 'foo'); var xfoo = work.firstChild; assert.equal(xfoo.value, 'foo'); }); @@ -116,4 +115,4 @@ suite('upgradeElements', function() { }); -}); +}); \ No newline at end of file diff --git a/test/runner.html b/test/runner.html index 09f5ff7..435cc5f 100644 --- a/test/runner.html +++ b/test/runner.html @@ -22,11 +22,12 @@ - diff --git a/tools b/tools index 313f752..973cb8b 160000 --- a/tools +++ b/tools @@ -1 +1 @@ -Subproject commit 313f7524ce37689ebfb60c81f7bda721535467cf +Subproject commit 973cb8b063100f726622509536cb5114e0300332