Skip to content
This repository has been archived by the owner on Mar 13, 2018. It is now read-only.

Commit

Permalink
Merge pull request #98 from azakus/tree-order-upgrade-attach
Browse files Browse the repository at this point in the history
Ensure upgrading element fire attached in tree order
  • Loading branch information
dfreedm committed Feb 8, 2014
2 parents be42be8 + 191c02d commit 6236589
Show file tree
Hide file tree
Showing 3 changed files with 47 additions and 2 deletions.
3 changes: 2 additions & 1 deletion src/CustomElements.js
Original file line number Diff line number Diff line change
Expand Up @@ -226,8 +226,9 @@ if (useNative) {
element.__upgraded__ = true;
// lifecycle management
created(element);
// attachedCallback fires in tree order, call before recursing
scope.insertedNode(element);
// there should never be a shadow root on element at this point
// we require child nodes be upgraded before `created`
scope.upgradeSubtree(element);
// OUTPUT
return element;
Expand Down
2 changes: 1 addition & 1 deletion src/Observer.js
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,6 @@ function insertedNode(node) {
}
}


// TODO(sorvell): on platforms without MutationObserver, mutations may not be
// reliable and therefore attached/detached are not reliable.
// To make these callbacks less likely to fail, we defer all inserts and removes
Expand Down Expand Up @@ -335,6 +334,7 @@ scope.watchShadow = watchShadow;
scope.upgradeDocumentTree = upgradeDocumentTree;
scope.upgradeAll = addedNode;
scope.upgradeSubtree = addedSubtree;
scope.insertedNode = insertedNode;

scope.observeDocument = observeDocument;
scope.upgradeDocument = upgradeDocument;
Expand Down
44 changes: 44 additions & 0 deletions test/js/customElements.js
Original file line number Diff line number Diff line change
Expand Up @@ -369,6 +369,50 @@
assert.deepEqual(invocations, ['created', 'entered', 'left'],
'created, entered then left view');
});

test('attachedCallback ordering', function() {
var log = [];
var p = Object.create(HTMLElement.prototype);
p.attachedCallback = function() {
log.push(this.id);
};
document.registerElement('x-boo-ordering', {prototype: p});

work.innerHTML =
'<x-boo-ordering id=a>' +
'<x-boo-ordering id=b></x-boo-ordering>' +
'<x-boo-ordering id=c>' +
'<x-boo-ordering id=d></x-boo-ordering>' +
'<x-boo-ordering id=e></x-boo-ordering>' +
'</x-boo-ordering>' +
'</x-boo-ordering>';

CustomElements.takeRecords();
assert.deepEqual(['a', 'b', 'c', 'd', 'e'], log);
});

test('detachedCallback ordering', function() {
var log = [];
var p = Object.create(HTMLElement.prototype);
p.detachedCallback = function() {
log.push(this.id);
};
document.registerElement('x-boo2-ordering', {prototype: p});

work.innerHTML =
'<x-boo2-ordering id=a>' +
'<x-boo2-ordering id=b></x-boo2-ordering>' +
'<x-boo2-ordering id=c>' +
'<x-boo2-ordering id=d></x-boo2-ordering>' +
'<x-boo2-ordering id=e></x-boo2-ordering>' +
'</x-boo2-ordering>' +
'</x-boo2-ordering>';

CustomElements.takeRecords();
work.innerHTML = '';
CustomElements.takeRecords();
assert.deepEqual(['a', 'b', 'c', 'd', 'e'], log);
});
});

htmlSuite('customElements (html)', function() {
Expand Down

0 comments on commit 6236589

Please sign in to comment.