Type extension support in polyfill.

tests/html/custom/document_register_type_extensions_test.dart

Index: tests/html/custom/document_register_type_extensions_test.dart
diff --git a/tests/html/custom/document_register_type_extensions_test.dart b/tests/html/custom/document_register_type_extensions_test.dart
index cacb251a0f77c41911600d9fc205711851692c11..13a61ee3d7557d35186429b424de37ab726817ec 100644
--- a/tests/html/custom/document_register_type_extensions_test.dart
+++ b/tests/html/custom/document_register_type_extensions_test.dart
@@ -9,27 +9,42 @@ import 'dart:html';
 
 class Foo extends HtmlElement {
   static final tag = 'x-foo';

[Jennifer Messerly, 2013/08/29 20:57:29]

trivial: these could be "static const"

[blois, 2013/08/29 21:38:41]

Done.

+  static final outerHtmlString = '<x-foo></x-foo>';
   factory Foo() => new Element.tag(tag);
 }
 
 class Bar extends InputElement {
   static final tag = 'x-bar';
-  factory Bar() => document.$dom_createElement('input', tag);
+  static final outerHtmlString = '<input is="x-bar">';
+  factory Bar() => new Element.tag('input', tag);

[Jennifer Messerly, 2013/08/29 20:57:29]

idea: add a test for incorrect impl of the factory?

for example:

// OOPS! This should fail somehow (at least in checked mode...)
// But maybe it fails somewhere else too?
class BarBad extends InputElement {
  static const tag = 'bar-bad'
  factory BarBad() => new Element.tag(tag);
}

// OOPS! This should fail too...
class FooBad extends HtmlElement {
  static const tag = 'foo-bad'
  factory Bar() => new Element.tag('input', tag);
}

[blois, 2013/08/29 21:38:41]

These are in the createElement and 'createElement with type extension' tests. I
just expanded these out into more sub-tests which makes it more readable, I had
already done this for the polymer.js tests at
https://github.com/Polymer/CustomElements/pull/59/files

 }
 
 class Baz extends Foo {
   static final tag = 'x-baz';
+  static final outerHtmlString = '<x-baz></x-baz>';
   factory Baz() => new Element.tag(tag);
 }
 
 class Qux extends Bar {
   static final tag = 'x-qux';
-  factory Qux() => document.$dom_createElement('input', tag);
+  factory Qux() => new Element.tag('input', tag);
 }
 
 class FooBad extends DivElement {
   static final tag = 'x-foo';
-  factory FooBad() => document.$dom_createElement('div', tag);
+  factory FooBad() => new Element.tag('div', tag);
+}
+
+loadPolyfills() {
+  if (!document.supportsRegister) {
+    // Cache blocker is a workaround for:
+    // https://code.google.com/p/dart/issues/detail?id=11834
+    var cacheBlocker = new DateTime.now().millisecondsSinceEpoch;
+    return HttpRequest.getString('/root_dart/pkg/custom_element/lib/'
+      'custom-elements.debug.js?cacheBlock=$cacheBlocker').then((code) {
+      document.head.children.add(new ScriptElement()..text = code);
+    });
+  }
 }
 
 main() {
@@ -45,153 +60,165 @@ main() {
     return element.form == testForm;
   };
 
-  test('construction', () {
+  var registeredTypes = false;
+  void registerTypes() {
+    if (registeredTypes) {
+      return;
+    }
+    registeredTypes = true;
     document.register(Foo.tag, Foo);
     document.register(Bar.tag, Bar);
     document.register(Baz.tag, Baz);
     document.register(Qux.tag, Qux);
+  }
+
+  setUp(loadPolyfills);
+
+  group('construction', () {
+    setUp(registerTypes);
+
+    test('cannot register twice', () {
+      expect(() => document.register(FooBad.tag, Foo), throws);
+    });
+
+    test('constructors', () {
+      var fooNewed = new Foo();
+      expect(fooNewed.outerHtml, Foo.outerHtmlString);
+      expect(fooNewed is Foo, isTrue);
+      expect(fooNewed is HtmlElement, isTrue);
+      expect(fooNewed is UnknownElement, isFalse);
+
+      var barNewed = new Bar();
+      expect(barNewed.outerHtml, Bar.outerHtmlString);
+      expect(barNewed is Bar, isTrue);
+      expect(barNewed is InputElement, isTrue);
+      expect(isFormControl(barNewed), isTrue);
+
+      var bazNewed = new Baz();
+      expect(bazNewed.outerHtml, Baz.outerHtmlString);
+      expect(bazNewed is Baz, isTrue);
+      expect(bazNewed is HtmlElement, isTrue);
+      expect(bazNewed is UnknownElement, isFalse);
+
+      var quxNewed = new Qux();
+      var quxOuterHtml = '<input is="x-qux">';
+      expect(quxNewed.outerHtml, quxOuterHtml);
+      expect(quxNewed is Qux, isTrue);
+      expect(quxNewed is InputElement, isTrue);
+      expect(isFormControl(quxNewed), isTrue);
+    });
+
+    test('createElement', () {
+      var fooCreated = new Element.tag('x-foo');
+      expect(fooCreated.outerHtml, Foo.outerHtmlString);
+      expect(fooCreated is Foo, isTrue);
+
+      var barCreated = new Element.tag('x-bar');
+      expect(barCreated is Bar, isFalse);
+      expect(barCreated.outerHtml, "<x-bar></x-bar>");
+      expect(barCreated is UnknownElement, isFalse);
+      expect(barCreated is HtmlElement, isTrue);
+
+      var bazCreated = new Element.tag('x-baz');
+      expect(bazCreated.outerHtml, Baz.outerHtmlString);
+      expect(bazCreated is Baz, isTrue);
+      expect(bazCreated is UnknownElement, isFalse);
+
+      var quxCreated = new Element.tag('x-qux');
+      expect(quxCreated.outerHtml, "<x-qux></x-qux>");
+      expect(quxCreated is Qux, isFalse);
+      expect(quxCreated is UnknownElement, isFalse);
+      expect(quxCreated is HtmlElement, isTrue);
+    });
+
+    test('createElement with type extension', () {
+      var divFooCreated = new Element.tag("div", Foo.tag);
+      expect(divFooCreated.outerHtml, '<div is="x-foo"></div>');
+      expect(divFooCreated is Foo, isFalse);
+      expect(divFooCreated is DivElement, isTrue);
+
+      var inputBarCreated = new Element.tag("input", Bar.tag);
+      expect(inputBarCreated.outerHtml, Bar.outerHtmlString);
+      expect(inputBarCreated is Bar, isTrue);
+      expect(inputBarCreated is UnknownElement, isFalse);
+      expect(isFormControl(inputBarCreated), isTrue);
+
+      var divBarCreated = new Element.tag("div", Bar.tag);
+      expect(divBarCreated.outerHtml, '<div is="x-bar"></div>');
+      expect(divBarCreated is Bar, isFalse);
+      expect(divBarCreated is DivElement, isTrue);
+
+      var fooBarCreated = new Element.tag(Foo.tag, Bar.tag);
+      expect(fooBarCreated.outerHtml, '<x-foo is="x-bar"></x-foo>');
+      expect(fooBarCreated is Foo, isTrue);
+
+      var barFooCreated = new Element.tag(Bar.tag, Foo.tag);
+      expect(barFooCreated.outerHtml, '<x-bar is="x-foo"></x-bar>');
+      expect(barFooCreated is UnknownElement, isFalse);
+      expect(barFooCreated is HtmlElement, isTrue);
+
+      var fooCreatedNull = new Element.tag(Foo.tag, null);
+      expect(fooCreatedNull.outerHtml, Foo.outerHtmlString);
+      expect(fooCreatedNull is Foo, isTrue);
+
+      var fooCreatedEmpty = new Element.tag(Foo.tag, "");
+      expect(fooCreatedEmpty.outerHtml, Foo.outerHtmlString);
+      expect(fooCreatedEmpty is Foo, isTrue);
+    });
+  });
 
-    expect(() => document.register(FooBad.tag, Foo), throws);
-
-    // Constructors
-
-    var fooNewed = new Foo();
-    var fooOuterHtml = "<x-foo></x-foo>";
-    expect(fooNewed.outerHtml, fooOuterHtml);
-    expect(fooNewed is Foo, isTrue);
-    expect(fooNewed is HtmlElement, isTrue);
-    expect(fooNewed is UnknownElement, isFalse);
-
-    var barNewed = new Bar();
-    var barOuterHtml = '<input is="x-bar">';
-    expect(barNewed.outerHtml, barOuterHtml);
-    expect(barNewed is Bar, isTrue);
-    expect(barNewed is InputElement, isTrue);
-    expect(isFormControl(barNewed), isTrue);
-
-    var bazNewed = new Baz();
-    var bazOuterHtml = "<x-baz></x-baz>";
-    expect(bazNewed.outerHtml, bazOuterHtml);
-    expect(bazNewed is Baz, isTrue);
-    expect(bazNewed is HtmlElement, isTrue);
-    expect(bazNewed is UnknownElement, isFalse);
-
-    var quxNewed = new Qux();
-    var quxOuterHtml = '<input is="x-qux">';
-    expect(quxNewed.outerHtml, quxOuterHtml);
-    expect(quxNewed is Qux, isTrue);
-    expect(quxNewed is InputElement, isTrue);
-    expect(isFormControl(quxNewed), isTrue);
-
-    // new Element.tag
-
-    var fooCreated = new Element.tag('x-foo');
-    expect(fooCreated.outerHtml, fooOuterHtml);
-    expect(fooCreated is Foo, isTrue);
-
-    var barCreated = new Element.tag('x-bar');
-    expect(barCreated.outerHtml, "<x-bar></x-bar>");
-    expect(barCreated is Bar, isFalse);
-    expect(barCreated is UnknownElement, isFalse);
-    expect(barCreated is HtmlElement, isTrue);
-
-    var bazCreated = new Element.tag('x-baz');
-    expect(bazCreated.outerHtml, bazOuterHtml);
-    expect(bazCreated is Baz, isTrue);
-    expect(bazCreated is UnknownElement, isFalse);
-
-    var quxCreated = new Element.tag('x-qux');
-    expect(quxCreated.outerHtml, "<x-qux></x-qux>");
-    expect(quxCreated is Qux, isFalse);
-    expect(quxCreated is UnknownElement, isFalse);
-    expect(quxCreated is HtmlElement, isTrue);
-
-    // create with type extensions
-    // TODO(vsm): How should we expose this?
-
-    var divFooCreated = document.$dom_createElement("div", Foo.tag);
-    expect(divFooCreated.outerHtml, '<div is="x-foo"></div>');
-    expect(divFooCreated is Foo, isFalse);
-    expect(divFooCreated is DivElement, isTrue);
-
-    var inputBarCreated =
-	document.$dom_createElement("input", Bar.tag);
-    expect(inputBarCreated.outerHtml, barOuterHtml);
-    expect(inputBarCreated is Bar, isTrue);
-    expect(inputBarCreated is UnknownElement, isFalse);
-    expect(isFormControl(inputBarCreated), isTrue);
-
-    var divBarCreated = document.$dom_createElement("div", Bar.tag);
-    expect(divBarCreated.outerHtml, '<div is="x-bar"></div>');
-    expect(divBarCreated is Bar, isFalse);
-    expect(divBarCreated is DivElement, isTrue);
-
-    var fooBarCreated =
-	document.$dom_createElement(Foo.tag, Bar.tag);
-    expect(fooBarCreated.outerHtml, '<x-foo is="x-bar"></x-foo>');
-    expect(fooBarCreated is Foo, isTrue);
-
-    var barFooCreated = document.$dom_createElement(Bar.tag,
-						      Foo.tag);
-    expect(barFooCreated.outerHtml, '<x-bar is="x-foo"></x-bar>');
-    expect(barFooCreated is UnknownElement, isFalse);
-    expect(barFooCreated is HtmlElement, isTrue);
-
-    var fooCreatedNull = document.$dom_createElement(Foo.tag, null);
-    expect(fooCreatedNull.outerHtml, fooOuterHtml);
-    expect(fooCreatedNull is Foo, isTrue);
-
-    var fooCreatedEmpty = document.$dom_createElement(Foo.tag, "");
-    expect(fooCreatedEmpty.outerHtml, fooOuterHtml);
-    expect(fooCreatedEmpty is Foo, isTrue);
-
-    expect(() => document.$dom_createElement('@invalid', 'x-bar'), throws);
-
-    // Create NS with type extensions
-
-    var fooCreatedNS =
-	document.$dom_createElementNS("http://www.w3.org/1999/xhtml",
-				      Foo.tag, null);
-    expect(fooCreatedNS.outerHtml, fooOuterHtml);
-    expect(fooCreatedNS is Foo, isTrue);
-
-    var barCreatedNS =
-	document.$dom_createElementNS("http://www.w3.org/1999/xhtml", "input",
-				      Bar.tag);
-    expect(barCreatedNS.outerHtml, barOuterHtml);
-    expect(barCreatedNS is Bar, isTrue);
-    expect(isFormControl(barCreatedNS), isTrue);
-
-    expect(() =>
-	     document.$dom_createElementNS(
-	         'http://example.com/2013/no-such-namespace',
-		 'xml:lang', 'x-bar'), throws);
-
-    // Parser
-
-    createElementFromHtml(html) {
-	var container = new DivElement()..innerHtml = html;
-	return container.firstChild;
-    }
+  group('namespaces', () {
+    setUp(registerTypes);
+
+    test('createElementNS', () {
+      var fooCreatedNS =
+          document.$dom_createElementNS("http://www.w3.org/1999/xhtml",

[Jennifer Messerly, 2013/08/29 20:57:29]

do we have a bug to remove this bad $dom method?

[blois, 2013/08/29 21:38:41]

Yes, I have a CL for it, but wanted to get this one submitted first.

+          Foo.tag, null);
+      expect(fooCreatedNS.outerHtml, Foo.outerHtmlString);
+      expect(fooCreatedNS is Foo, isTrue);
+
+      var barCreatedNS =
+          document.$dom_createElementNS("http://www.w3.org/1999/xhtml", "input",
+          Bar.tag);
+      expect(barCreatedNS.outerHtml, Bar.outerHtmlString);
+      expect(barCreatedNS is Bar, isTrue);
+      expect(isFormControl(barCreatedNS), isTrue);
+
+      expect(() =>
+         document.$dom_createElementNS(
+             'http://example.com/2013/no-such-namespace',
+       'xml:lang', 'x-bar'), throws);
+    });
+  });
+
+  group('parsing', () {
+    setUp(registerTypes);
+
+    test('parsing', () {
+      createElementFromHtml(html) {
+        var container = new DivElement()..innerHtml = html;

[Jennifer Messerly, 2013/08/29 20:57:29]

does this still work with the new safe HTML shenanigans?

[blois, 2013/08/29 21:38:41]

This was uploaded before the safe HTML changes went in, this was updated with
that CL and is passing.

+        return container.firstChild;
+      }
 
-    var fooParsed = createElementFromHtml('<x-foo>');
-    expect(fooParsed is Foo, isTrue);
+      var fooParsed = createElementFromHtml('<x-foo>');
+      expect(fooParsed is Foo, isTrue);
 
-    var barParsed = createElementFromHtml('<input is=x-bar>');
-    expect(barParsed is Bar, isTrue);
-    expect(isFormControl(barParsed), isTrue);
+      var barParsed = createElementFromHtml('<input is=x-bar>');
+      expect(barParsed is Bar, isTrue);
+      expect(isFormControl(barParsed), isTrue);
 
-    var divFooParsed = createElementFromHtml('<div is=x-foo>');
-    expect(divFooParsed is Foo, isFalse);
-    expect(divFooParsed is DivElement, isTrue);
+      var divFooParsed = createElementFromHtml('<div is=x-foo>');
+      expect(divFooParsed is Foo, isFalse);
+      expect(divFooParsed is DivElement, isTrue);
 
-    var namedBarParsed = createElementFromHtml('<x-bar>');
-    expect(namedBarParsed is Bar, isFalse);
-    expect(namedBarParsed is UnknownElement, isFalse);
-    expect(namedBarParsed is HtmlElement, isTrue);
+      var namedBarParsed = createElementFromHtml('<x-bar>');
+      expect(namedBarParsed is Bar, isFalse);
+      expect(namedBarParsed is UnknownElement, isFalse);
+      expect(namedBarParsed is HtmlElement, isTrue);
 
-    var divBarParsed = createElementFromHtml('<div is=x-bar>');
-    expect(divBarParsed is Bar, isFalse);
-    expect(divBarParsed is DivElement, isTrue);
+      var divBarParsed = createElementFromHtml('<div is=x-bar>');
+      expect(divBarParsed is Bar, isFalse);
+      expect(divBarParsed is DivElement, isTrue);
+    });
   });
 }