feat(expect): Move JQuery.html to Expect.toHaveHtml()

test/_specs.dart

@@ -50,6 +50,8 @@ class Expect {
   toBeNull() => unit.expect(actual, unit.isNull);
   toBeNotNull() => unit.expect(actual, unit.isNotNull);
 
+  toHaveHtml(expected) => unit.expect(_toHtml(actual), unit.equals(expected));
+
   toHaveBeenCalled() => unit.expect(actual.called, true, reason: 'method not called');
   toHaveBeenCalledOnce() => unit.expect(actual.count, 1, reason: 'method invoked ${actual.count} expected once');
   toHaveBeenCalledWith([a,b,c,d,e,f]) =>
@@ -87,6 +89,34 @@ class Expect {
   toEqualDirty() {
     // TODO: implement onece we have forms
   }
+
+
+  _toHtml(node, [bool outer = false]) {
+    if (node is Comment) {
+      return '<!--${node.text}-->';
+    } else if (node is DocumentFragment) {
+      var acc = '';
+      node.childNodes.forEach((n) { acc += _toHtml(n, true); });
+      return acc;
+    } else if (node is List) {
+      var acc = '';
+      node.forEach((n) { acc += _toHtml(n); });
+      return acc;
+    } else if (node is Element) {
+      // Remove all the "ng-binding" internal classes
+      node = node.clone(true) as Element;
+      node.classes.remove('ng-binding');
+      node.querySelectorAll(".ng-binding").forEach((Element e) {
+        e.classes.remove('ng-binding');
+      });
+      var htmlString = outer ? node.outerHtml : node.innerHtml;
+      // Strip out empty class attributes.  This seems like a Dart bug...
+      return htmlString.replaceAll(' class=""', '').trim();
+    } else {
+      throw "JQuery._toHtml not implemented for node type [${node.nodeType}]";
+    }
+  }
+
 }
 
 class NotExpect {
@@ -155,28 +185,6 @@ class JQuery extends DelegatingList<Node> {
     }
   }
 
-  _toHtml(node, [bool outer = false]) {
-    if (node is Comment) {
-      return '<!--${node.text}-->';
-    } else if (node is DocumentFragment) {
-      var acc = '';
-      node.childNodes.forEach((n) { acc += _toHtml(n, true); });
-      return acc;
-    } else if (node is Element) {
-      // Remove all the "ng-binding" internal classes
-      node = node.clone(true) as Element;
-      node.classes.remove('ng-binding');
-      node.querySelectorAll(".ng-binding").forEach((Element e) {
-        e.classes.remove('ng-binding');
-      });
-      var htmlString = outer ? node.outerHtml : node.innerHtml;
-      // Strip out empty class attributes.  This seems like a Dart bug...
-      return htmlString.replaceAll(' class=""', '');
-    } else {
-      throw "JQuery._toHtml not implemented for node type [${node.nodeType}]";
-    }
-  }
-
   _renderedText(n, [bool notShadow = false]) {
     if (n is List) {
       return n.map((nn) => _renderedText(nn)).join("");
@@ -210,13 +218,12 @@ class JQuery extends DelegatingList<Node> {
   }
 
   html([String html]) => accessor(
-          (n) => _toHtml(n),
+          (n) { throw "Not implemented"; },
           (n, v) => n.setInnerHtml(v, treeSanitizer: new NullTreeSanitizer()),
           html);
   val([String text]) => accessor((n) => n.value, (n, v) => n.value = v);
   text([String text]) => accessor((n) => n.text, (n, v) => n.text = v, text);
   contents() => fold(new JQuery(), (jq, node) => jq..addAll(node.nodes));
-  toString() => fold('', (html, node) => '$html${_toHtml(node, true)}');
   eq(num childIndex) => $(this[childIndex]);
   remove(_) => forEach((n) => n.remove());
   attr([String name, String value]) => accessor(

test/_specs_spec.dart

@@ -3,28 +3,21 @@ library _specs_spec;
 import '_specs.dart';
 
 main() {
-
-
-
-  describe('jquery', () {
-    describe('html', () {
-      it('get', (){
-        var div = $('<div>');
-        expect(div.html()).toEqual('');
+  describe('expect', () {
+    describe('toHaveHtml', () {
+      it('should return html', (){
+        var div = es('<div>');
+        expect(es('<div>')).toHaveHtml('');
       });
 
       it('should strip ng-binding', () {
-        var div = $('<div><span class="ng-binding"></span></div>');
-        expect(div.html()).toEqual('<span></span>');
-      });
-
-      it('set', (){
-        var div = $('<div>');
-        expect(div.html('text')).toBe(div);
-        expect(div.html()).toEqual('text');
+        var div = es('<div><span class="ng-binding"></span></div>');
+        expect(div).toHaveHtml('<span></span>');
       });
     });
+  });
 
+  describe('jquery', () {
     describe('shadowRoot', () {
       it('should return the shadowRoot if one exists', () {
         var elts = $('<div></div>');
@@ -39,7 +32,7 @@ main() {
       it('should print the html for the shadowRoot', () {
         var elts = $('<div></div>');
         elts[0].createShadowRoot().innerHtml = '<div class="ng-binding">Hello shadow</div>';
-        expect(elts.shadowRoot().html()).toEqual('<div>Hello shadow</div>');
+        expect(elts.shadowRoot()[0]).toHaveHtml('<div>Hello shadow</div>');
       });
     });
 

test/bootstrap_spec.dart

@@ -7,27 +7,27 @@ void main() {
     setBody(String html) {
       var body = window.document.querySelector('body');
       body.setInnerHtml(html, treeSanitizer: new NullTreeSanitizer());
-      return $(body);
+      return body;
     }
 
     it('should default to whole page', () {
       var body = setBody('<div>{{"works"}}</div>');
       ngBootstrap();
-      expect($(body).html()).toEqual('<div>works</div>');
+      expect(body).toHaveHtml('<div>works</div>');
     });
 
     it('should compile starting at ng-app node', () {
       var body = setBody(
           '<div>{{ignor me}}<div ng-app ng-bind="\'works\'"></div></div>');
       ngBootstrap();
-      expect(body.text()).toEqual('{{ignor me}}works');
+      expect(body.text).toEqual('{{ignor me}}works');
     });
 
     it('should compile starting at ng-app node', () {
       var body = setBody(
           '<div>{{ignor me}}<div ng-bind="\'works\'"></div></div>');
-      ngBootstrap(element:body.find('div[ng-bind]').first);
-      expect(body.text()).toEqual('{{ignor me}}works');
+      ngBootstrap(element:body.querySelector('div[ng-bind]'));
+      expect(body.text).toEqual('{{ignor me}}works');
     });
   });
 }

test/core/templateurl_spec.dart

@@ -70,7 +70,7 @@ void main() {
         microLeap();
 
         expect(element.textWithShadow()).toEqual('.hello{}Simple!');
-        expect(element.children().shadowRoot().html()).toEqual(
+        expect(element.children().shadowRoot()[0]).toHaveHtml(
             '<style>.hello{}</style><div log="SIMPLE">Simple!</div>'
         );
       })));
@@ -139,7 +139,7 @@ void main() {
         microLeap();
 
         expect(element.textWithShadow()).toEqual('.hello{}Simple!');
-        expect(element.children().shadowRoot().html()).toEqual(
+        expect(element.children().shadowRoot()[0]).toHaveHtml(
             '<style>.hello{}</style><div log="SIMPLE">Simple!</div>'
         );
         $rootScope.apply();
@@ -225,7 +225,7 @@ void main() {
         microLeap();
 
         expect(element.textWithShadow()).toEqual('.hello{}.world{}Simple!');
-        expect(element.children().shadowRoot().html()).toEqual(
+        expect(element.children().shadowRoot()[0]).toHaveHtml(
             '<style>.hello{}.world{}</style><div log="SIMPLE">Simple!</div>'
         );
         $rootScope.apply();

test/core_dom/compiler_spec.dart

@@ -59,13 +59,13 @@ void main() {
     });
 
     it('should compile a comment with no directives around', () {
-      var element = $(_.compile('<div><!-- comment --></div>'));
-      expect(element.html()).toEqual('<!-- comment -->');
+      var element = _.compile('<div><!-- comment --></div>');
+      expect(element).toHaveHtml('<!-- comment -->');
     });
 
     it('should compile a comment when the parent has a directive', () {
-      var element = $(_.compile('<div ng-show="true"><!-- comment --></div>'));
-      expect(element.html()).toEqual('<!-- comment -->');
+      var element = _.compile('<div ng-show="true"><!-- comment --></div>');
+      expect(element).toHaveHtml('<!-- comment -->');
     });
 
     it('should compile a directive in a child', () {
@@ -79,17 +79,17 @@ void main() {
     });
 
     it('should compile repeater', () {
-      var element = $(_.compile('<div><div ng-repeat="item in items" ng-bind="item"></div></div>'));
+      var element = _.compile('<div><div ng-repeat="item in items" ng-bind="item"></div></div>');
 
       _.rootScope.context['items'] = ['A', 'b'];
-      expect(element.text()).toEqual('');
+      expect(element.text).toEqual('');
 
       _.rootScope.apply();
-      expect(element.text()).toEqual('Ab');
+      expect(element.text).toEqual('Ab');
 
       _.rootScope.context['items'] = [];
       _.rootScope.apply();
-      expect(element.html()).toEqual('<!--ANCHOR: [ng-repeat]=item in items-->');
+      expect(element).toHaveHtml('<!--ANCHOR: [ng-repeat]=item in items-->');
     });
 
     it('should compile a text child of a basic repeater', () {
@@ -120,17 +120,17 @@ void main() {
     });
 
     it('should compile repeater with children', (Compiler $compile) {
-      var element = $(_.compile('<div><div ng-repeat="item in items"><div ng-bind="item"></div></div></div>'));
+      var element = _.compile('<div><div ng-repeat="item in items"><div ng-bind="item"></div></div></div>');
 
       _.rootScope.context['items'] = ['A', 'b'];
 
-      expect(element.text()).toEqual('');
+      expect(element.text).toEqual('');
       _.rootScope.apply();
-      expect(element.text()).toEqual('Ab');
+      expect(element.text).toEqual('Ab');
 
       _.rootScope.context['items'] = [];
       _.rootScope.apply();
-      expect(element.html()).toEqual('<!--ANCHOR: [ng-repeat]=item in items-->');
+      expect(element).toHaveHtml('<!--ANCHOR: [ng-repeat]=item in items-->');
     });
 
     it('should compile text', (Compiler $compile) {

test/core_dom/ng_mustache_spec.dart

@@ -56,14 +56,14 @@ main() {
 
 
     it('should handle filters', inject((Compiler $compile, RootScope rootScope, Injector injector, DirectiveMap directives) {
-      var element = $('<div>{{"World" | hello}}</div>');
+      var element = es('<div>{{"World" | hello}}</div>');
       var template = $compile(element, directives);
       var view = template(injector);
       rootScope.apply();
 
-      element = $(view.nodes);
+      element = view.nodes;
 
-      expect(element.html()).toEqual('Hello, World!');
+      expect(element).toHaveHtml('Hello, World!');
     }));
   });
 

test/core_dom/view_spec.dart

@@ -87,23 +87,23 @@ main() {
         it('should insert block after anchor view', () {
           anchor.insert(a);
 
-          expect($rootElement.html()).toEqual('<!-- anchor --><span>A</span>a');
+          expect($rootElement[0]).toHaveHtml('<!-- anchor --><span>A</span>a');
         });
 
 
         it('should insert multi element view after another multi element view', () {
           anchor.insert(a);
           anchor.insert(b, insertAfter: a);
 
-          expect($rootElement.html()).toEqual('<!-- anchor --><span>A</span>a<span>B</span>b');
+          expect($rootElement[0]).toHaveHtml('<!-- anchor --><span>A</span>a<span>B</span>b');
         });
 
 
         it('should insert multi element view before another multi element view', () {
           anchor.insert(b);
           anchor.insert(a);
 
-          expect($rootElement.html()).toEqual('<!-- anchor --><span>A</span>a<span>B</span>b');
+          expect($rootElement[0]).toHaveHtml('<!-- anchor --><span>A</span>a<span>B</span>b');
         });
       });
 
@@ -118,12 +118,12 @@ main() {
 
         it('should remove the last view', () {
           anchor.remove(b);
-          expect($rootElement.html()).toEqual('<!-- anchor --><span>A</span>a');
+          expect($rootElement[0]).toHaveHtml('<!-- anchor --><span>A</span>a');
         });
 
         it('should remove child views from parent pseudo black', () {
           anchor.remove(a);
-          expect($rootElement.html()).toEqual('<!-- anchor --><span>B</span>b');
+          expect($rootElement[0]).toHaveHtml('<!-- anchor --><span>B</span>b');
         });
 
         // TODO(deboer): Make this work again.
@@ -183,7 +183,7 @@ main() {
 
         it('should move last to middle', () {
           anchor.move(a, moveAfter: b);
-          expect($rootElement.html()).toEqual('<!-- anchor --><span>B</span>b<span>A</span>a');
+          expect($rootElement[0]).toHaveHtml('<!-- anchor --><span>B</span>b<span>A</span>a');
         });
       });
     });

test/directive/ng_bind_html_spec.dart

@@ -8,12 +8,12 @@ main() {
 
     it('should sanitize and set innerHtml and sanitize and set html',
           (Scope scope, Injector injector, Compiler compiler, DirectiveMap directives) {
-      var element = $('<div ng-bind-html="htmlVar"></div>');
+      var element = es('<div ng-bind-html="htmlVar"></div>');
       compiler(element, directives)(injector, element);
       scope.context['htmlVar'] = '<a href="http://www.google.com"><b>Google!</b></a>';
       scope.apply();
       // Sanitization removes the href attribute on the <a> tag.
-      expect(element.html()).toEqual('<a><b>Google!</b></a>');
+      expect(element).toHaveHtml('<a><b>Google!</b></a>');
     });
 
     describe('injected NodeValidator', () {
@@ -27,12 +27,12 @@ main() {
       });
 
       it('should use injected NodeValidator and override default sanitize behavior', (Scope scope, Injector injector, Compiler compiler, DirectiveMap directives) {
-        var element = $('<div ng-bind-html="htmlVar"></div>');
+        var element = es('<div ng-bind-html="htmlVar"></div>');
         compiler(element, directives)(injector, element);
         scope.context['htmlVar'] = '<a href="http://www.google.com"><b>Google!</b></a>';
         scope.apply();
         // Sanitation allows href attributes per injected sanitizer.
-        expect(element.html()).toEqual('<a href="http://www.google.com"><b>Google!</b></a>');
+        expect(element).toHaveHtml('<a href="http://www.google.com"><b>Google!</b></a>');
       });
     });
   });