Custom Elements: Check Definition in createElement, Create Customized Built-in Elements Sync

third_party/WebKit/LayoutTests/custom-elements/spec/create-element-defined-synchronous.html

Index: third_party/WebKit/LayoutTests/custom-elements/spec/create-element-defined-synchronous.html
diff --git a/third_party/WebKit/LayoutTests/custom-elements/spec/create-element-defined-synchronous.html b/third_party/WebKit/LayoutTests/custom-elements/spec/create-element-defined-synchronous.html
index 49de1f0ee4bad82f16081e5e96e2e0d968eb75fc..62a6152fa2d73307617c22f91b9f891c33d505da 100644
--- a/third_party/WebKit/LayoutTests/custom-elements/spec/create-element-defined-synchronous.html
+++ b/third_party/WebKit/LayoutTests/custom-elements/spec/create-element-defined-synchronous.html
@@ -11,33 +11,68 @@ const expectTypeError = TypeError.prototype;
 const expectNotSupportedError = 'NOT_SUPPORTED_ERR';
 
 // https://dom.spec.whatwg.org/#concept-create-element
+// 5. If definition is non-null and the definition represents a customized built-in element:
+// 5.3. If the synchronous custom elements flag is set:
 // 6. If definition is non-null, then:
 // 6.1. If the synchronous custom elements flag is set:
 
 test_create_element_synchronous(
   'createElement(): ',
-  (w, constructor, options) => {
-    w.customElements.define('a-a', constructor, options);
-    return w.document.createElement('a-a');
+  (w, constructor, type) => {

[dominicc (has gone to gerrit), 2016/11/10 03:43:09]

Maybe name this opt_type indicating it is optional? And maybe it should be
called opt_tag?

+    if (!type) {
+      w.customElements.define('a-a', constructor);

[dominicc (has gone to gerrit), 2016/11/10 03:43:09]

a-a appears four times here now; might be time to introduce a variable for
it--use let.

+      return w.document.createElement('a-a');
+    } else {
+      let extend_options = { extends: type };
+      w.customElements.define('a-a', constructor, extend_options);
+      return w.document.createElement(type, { is: 'a-a' });
+    }
   });
 
 test_create_element_synchronous(
   'createElementNS(): ',
-  (w, constructor, options) => {
-    w.customElements.define('a-a', constructor, options);
-    return w.document.createElementNS('http://www.w3.org/1999/xhtml', 'a-a');
+  (w, constructor, type) => {
+    if (!type) {
+      w.customElements.define('a-a', constructor);
+      return w.document.createElementNS('http://www.w3.org/1999/xhtml', 'a-a');
+    } else {
+      let extend_options = { extends: type };
+      w.customElements.define('a-a', constructor, extend_options);
+      return w.document.createElementNS('http://www.w3.org/1999/xhtml', type, { is: 'a-a' });
+    }
   });
 
 function test_create_element_synchronous(description, define_and_create_element) {
   test_with_window((w) => {
     let is_constructed = false;
-    define_and_create_element(w, class extends w.HTMLElement {
+    class A extends w.HTMLElement {
       constructor() { super(); is_constructed = true; }
-    });
+    }
+    let o = define_and_create_element(w, A);
     assert_true(is_constructed, 'custom constructor ran');
+    assert_equals(o.constructor, A);
   }, `${description}Pre-flight check should succeed`);
 
   test_with_window((w) => {
+    let is_constructed = false;
+    class A extends w.HTMLDivElement {
+      constructor() { super(); is_constructed = true; }
+    }
+    let o = define_and_create_element(w, A, 'div');
+    assert_true(is_constructed, 'custom constructor ran');
+    assert_equals(o.constructor, A);
+  }, `${description}5. Create a customized built-in element`);
+
+  test_with_window((w) => {
+    let is_constructed = false;
+    class A extends w.HTMLElement {
+      constructor() { super(); is_constructed = true; }
+    }
+    define_and_create_element(w, A);
+    assert_true(is_constructed, 'custom constructor ran');
+  }, `${description}6. Create an autonomous custom element`);
+
+  test_with_window((w) => {
     const err = new Error('check this is reported');
     err.name = 'reported';
     assert_reports(w, err, () => {