1 files changed, 242 insertions, 0 deletions
diff --git a/testing/web-platform/tests/custom-elements/v0/custom-element-lifecycle/types-of-callbacks/created-callback-invocation-order-test.html b/testing/web-platform/tests/custom-elements/v0/custom-element-lifecycle/types-of-callbacks/created-callback-invocation-order-test.html
new file mode 100644
index 000000000..b0f2d5ee8
--- /dev/null
+++ b/testing/web-platform/tests/custom-elements/v0/custom-element-lifecycle/types-of-callbacks/created-callback-invocation-order-test.html
@@ -0,0 +1,242 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>All other callbacks must not be enqueued until after the created callback's invocation had started</title>
+<meta name="author" title="Aleksei Yu. Semenov" href="mailto:a.semenov@unipro.ru">
+<meta name="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru">
+<meta name="assert" content="All other callbacks must not be enqueued until after the created callback's invocation had started.">
+<link rel="help" href="http://www.w3.org/TR/custom-elements/#types-of-callbacks">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="../../testcommon.js"></script>
+</head>
+<body>
+<div id="log"></div>
+<script>
+function newPrototypeWithCallbackLog() {
+    var proto = Object.create(HTMLElement.prototype);
+    proto.callbackLog = [];
+    proto.createdCallback = function() {
+        proto.callbackLog.push('created');
+    };
+    proto.attachedCallback = function() {
+        proto.callbackLog.push('attached');
+    };
+    proto.attributeChangedCallback = function() {
+        proto.callbackLog.push('attributeChanged');
+    };
+    proto.detachedCallback = function() {
+        proto.callbackLog.push('detached');
+    };
+    return proto;
+}
+
+testInIFrame('../../resources/blank.html', function(doc) {
+    var proto = newPrototypeWithCallbackLog();
+    doc.registerElement('x-a', {prototype: proto});
+    doc.body.innerHTML = '<x-a></x-a>';
+
+    assert_equals(proto.callbackLog[0], 'created', 'The callback ' +
+        proto.callbackLog[0] + ' should be enqueued after created callback');
+    assert_in_array('attached', proto.callbackLog, 'The callback ' +
+        'attached should be called');
+}, 'Test attached callback is enqueued after created callback');
+
+
+testInIFrame('../../resources/blank.html', function(doc) {
+    var proto = newPrototypeWithCallbackLog();
+    doc.registerElement('x-b', {prototype: proto});
+    doc.body.innerHTML = '<x-b id="x-b"></x-b>';
+    var customElement = doc.querySelector('#x-b');
+    customElement.setAttribute('key', 'value');
+
+    assert_equals(proto.callbackLog[0], 'created', 'The callback ' +
+        proto.callbackLog[0] + ' should not be enqueued before created callback');
+    assert_in_array('attributeChanged', proto.callbackLog,
+        'The callback attributeChanged should be called');
+}, 'Test attributeChanged callback is enqueued after created callback. ' +
+    'Document has browsing context');
+
+
+test(function() {
+    var doc = newHTMLDocument();
+    var proto = newPrototypeWithCallbackLog();
+    doc.registerElement('x-c', {prototype: proto});
+    doc.body.innerHTML = '<x-c id="x-c"></x-c>';
+    var customElement = doc.querySelector('#x-c');
+    customElement.setAttribute('key', 'value');
+    assert_equals(proto.callbackLog[0], 'created', 'The callback ' +
+        proto.callbackLog[0] + ' should not be enqueued before created callback');
+    assert_in_array('attributeChanged', proto.callbackLog,
+        'The callback attributeChanged should be called');
+}, 'Test attributeChanged callback is enqueued after created callback. ' +
+    'Document has no browsing context');
+
+
+testInIFrame('../../resources/x-element.html', function(doc) {
+    var proto = newPrototypeWithCallbackLog();
+    doc.registerElement('x-element', {prototype: proto});
+    var customElement = doc.querySelector('#x-element');
+    doc.body.removeChild(customElement);
+
+    assert_equals(proto.callbackLog[0], 'created', 'The callback ' +
+        proto.callbackLog[0] + ' should not be enqueued before created callback');
+    assert_in_array('detached', proto.callbackLog,
+        'The callback detached should be called');
+}, 'Test detached callback is enqueued after created callback.');
+
+
+test(function() {
+    var doc = newHTMLDocument();
+    var proto1 = newPrototypeWithCallbackLog();
+    proto1.createdCallback = function() {
+        proto1.callbackLog.push('created');
+        var xe = doc.querySelector('#x-e');
+        xe.setAttribute('key', 'value');
+    };
+    var proto2 = newPrototypeWithCallbackLog();
+
+    doc.registerElement('x-d', {prototype: proto1});
+    doc.registerElement('x-e', {prototype: proto2});
+    doc.body.innerHTML = '<x-d><x-e id="x-e"></x-e></x-d>';
+
+    assert_array_equals(proto2.callbackLog, ['created'],
+        'attributeChanged callback should not be enqueued before created callback');
+}, 'Test attributeChanged callback is not enqueued before created callback started. ' +
+    'Document has no browsing context');
+
+
+testInIFrame('../../resources/blank.html', function(doc) {
+    var proto1 = newPrototypeWithCallbackLog();
+    proto1.createdCallback = function() {
+        proto1.callbackLog.push('created');
+        var xe = doc.querySelector('#x-g');
+        xe.setAttribute('key', 'value');
+    };
+    var proto2 = newPrototypeWithCallbackLog();
+
+    doc.registerElement('x-f', {prototype: proto1});
+    doc.registerElement('x-g', {prototype: proto2});
+    doc.body.innerHTML = '<x-f><x-g id="x-g"></x-g></x-f>';
+
+    assert_array_equals(proto2.callbackLog, ['created', 'attached'],
+        'attributeChanged callback should not be called before created callback started');
+}, 'Test attributeChanged callback is not enqueued before created callback started. ' +
+    'Document has browsing context');
+
+
+test(function() {
+    var doc = newHTMLDocument();
+    var proto = newPrototypeWithCallbackLog();
+    proto.createdCallback = function() {
+        proto.callbackLog.push('created');
+        this.setAttribute('key', 'value');
+    };
+    doc.registerElement('x-h', {prototype: proto});
+    doc.body.innerHTML = '<x-h></x-h>';
+
+    assert_array_equals(proto.callbackLog, ['created', 'attributeChanged'],
+        'attributeChanged callback should be enqueued after created callback');
+}, 'Test attributeChanged callback is enqueued after created callback started. ' +
+    'Document has no browsing context');
+
+
+testInIFrame('../../resources/blank.html', function(docWithBrowsingContext) {
+    var docNoBrowsingContext = newHTMLDocument();
+
+    var proto1 = newPrototypeWithCallbackLog();
+    var proto2 = newPrototypeWithCallbackLog();
+    proto1.createdCallback = function() {
+        proto1.callbackLog.push('created');
+        var xk = docNoBrowsingContext.querySelector('#x-k');
+        assert_equals(proto2.callbackLog.length, 0, 'Created callback for x-k ' +
+            'should not be called before created callback for x-i');
+        docWithBrowsingContext.body.appendChild(xk);
+    };
+
+    docNoBrowsingContext.registerElement('x-i', {prototype: proto1});
+    docNoBrowsingContext.registerElement('x-k', {prototype: proto2});
+    docNoBrowsingContext.body.innerHTML = '<x-i><x-k id="x-k"></x-k></x-i>';
+
+    // Though at the moment of inserting <x-k> into docWithBrowsingContext
+    // created callback is not called for <x-k> yet, attached calback is enqueued
+    // anyway. Because specification for setting custom element prototype algorithm reads:
+    //  ....
+    //   3. If ELEMENT is in a document and this document has a browsing context:
+    //       1. Enqueue attached callback for ELEMENT
+    //
+    // Changes in the specification will follow, to reflect this exceptional case.
+    assert_array_equals(proto2.callbackLog, ['created', 'attached'],
+        'attached callback should be enqueued when custom element prototype is set');
+}, 'Test attached callback is enqueued after created callback, but before created callback had started');
+
+
+testInIFrame('../../resources/blank.html', function(docWithBrowsingContext) {
+    var docNoBrowsingContext = newHTMLDocument();
+
+    var proto = newPrototypeWithCallbackLog();
+    proto.createdCallback = function() {
+        proto.callbackLog.push('created');
+        docWithBrowsingContext.body.appendChild(this);
+    };
+
+    docNoBrowsingContext.registerElement('x-l', {prototype: proto});
+    docNoBrowsingContext.body.innerHTML = '<x-l></x-l>';
+    assert_array_equals(proto.callbackLog, ['created', 'attached'],
+        'attached callback should be enqueued after created callback had started');
+}, 'Test attached callback is enqueued after created callback had started');
+
+
+testInIFrame('../../resources/blank.html', function(doc) {
+    var proto1 = newPrototypeWithCallbackLog();
+    var proto2 = newPrototypeWithCallbackLog();
+    proto1.createdCallback = function() {
+        proto1.callbackLog.push('created');
+        var xn = doc.querySelector('#x-n');
+        assert_equals(proto2.callbackLog.length, 0, 'Created callback for x-n ' +
+            'should not be called before created callback for x-m');
+        this.removeChild(xn);
+    };
+
+    doc.registerElement('x-m', {prototype: proto1});
+    doc.registerElement('x-n', {prototype: proto2});
+    doc.body.innerHTML = '<x-m><x-n id="x-n"></x-n></x-m>';
+    assert_array_equals(proto2.callbackLog, ['created'],
+        'detached callback should not be enqueued before created callback had started');
+}, 'Test detached callback is not enqueued before created callback had started');
+
+
+testInIFrame('../../resources/blank.html', function(doc) {
+    var proto = newPrototypeWithCallbackLog();
+    proto.createdCallback = function() {
+        proto.callbackLog.push('created');
+        this.remove();
+    };
+
+    doc.registerElement('x-o', {prototype: proto});
+    doc.body.innerHTML = '<x-o></x-o>';
+
+    assert_array_equals(proto.callbackLog, ['created', 'attached', 'detached'],
+        'detached callback should be enqueued after created callback had started');
+}, 'Test detached callback is enqueued after created callback had started');
+
+
+testInIFrame('../../resources/x-element.html', function(doc) {
+    var proto = newPrototypeWithCallbackLog();
+    doc.registerElement('x-element', {prototype: proto});
+
+    // Though at the moment of inserting <x-element> into the document
+    // created callback is not called for <x-element> yet, attached calback is enqueued
+    // anyway. Because specification for setting custom element prototype algorithm reads:
+    //  ....
+    //   3. If ELEMENT is in a document and this document has a browsing context:
+    //       1. Enqueue attached callback for ELEMENT
+    //
+    // Changes in the specification will follow, to reflect this exceptional case.
+    assert_array_equals(proto.callbackLog, ['created', 'attached'],
+        'attached callback should be enqueued when custom element prototype is set');
+}, 'Test attached callback is enqueued after created callback after registration ' +
+    'of custom element type');
+</script>
+</body>
+</html>