feat(test_lib): add method to compare stringified DOM element

Closes #2106

modules/angular2/test/render/dom/compiler/view_splitter_spec.ts

@@ -1,4 +1,13 @@
-import {describe, beforeEach, it, expect, iit, ddescribe, el} from 'angular2/test_lib';
+import {
+  describe,
+  beforeEach,
+  it,
+  expect,
+  iit,
+  ddescribe,
+  el,
+  stringifyElement
+} from 'angular2/test_lib';
 import {MapWrapper} from 'angular2/src/facade/collection';
 
 import {ViewSplitter} from 'angular2/src/render/dom/compiler/view_splitter';
@@ -21,10 +30,10 @@ export function main() {
         var rootElement = el('<div><template if="true">a</template></div>');
         var results = createPipeline().process(rootElement);
 
-        expect(DOM.getOuterHTML(results[1].element))
-            .toEqual('<template if="true" class="ng-binding"></template>');
+        expect(stringifyElement(results[1].element))
+            .toEqual('<template class="ng-binding" if="true"></template>');
         expect(results[1].isViewRoot).toBe(false);
-        expect(DOM.getOuterHTML(results[2].element)).toEqual('<template>a</template>');
+        expect(stringifyElement(results[2].element)).toEqual('<template>a</template>');
         expect(results[2].isViewRoot).toBe(true);
       });
 
@@ -38,7 +47,7 @@ export function main() {
         var rootElement = el('<div></div>');
         var results = createPipeline().process(rootElement);
         expect(results.length).toBe(1);
-        expect(DOM.getOuterHTML(rootElement)).toEqual('<div></div>');
+        expect(stringifyElement(rootElement)).toEqual('<div></div>');
       });
 
       it('should copy over the elementDescription', () => {
@@ -60,7 +69,7 @@ export function main() {
         expect(results[2].inheritedProtoView)
             .toBe(results[1].inheritedElementBinder.nestedProtoView);
         expect(results[2].inheritedProtoView.type).toBe(ProtoViewDto.EMBEDDED_VIEW_TYPE);
-        expect(DOM.getOuterHTML(results[2].inheritedProtoView.rootElement))
+        expect(stringifyElement(results[2].inheritedProtoView.rootElement))
             .toEqual('<template>a</template>');
       });
 
@@ -73,9 +82,9 @@ export function main() {
         var originalChild = rootElement.childNodes[0];
         var results = createPipeline().process(rootElement);
         expect(results[0].element).toBe(rootElement);
-        expect(DOM.getOuterHTML(results[0].element))
+        expect(stringifyElement(results[0].element))
             .toEqual('<div><template class="ng-binding"></template></div>');
-        expect(DOM.getOuterHTML(results[2].element)).toEqual('<span template=""></span>');
+        expect(stringifyElement(results[2].element)).toEqual('<span template=""></span>');
         expect(results[2].element).toBe(originalChild);
       });
 
@@ -87,7 +96,7 @@ export function main() {
         expect(results[0].element).toBe(rootElement);
         expect(results[0].isViewRoot).toBe(true);
         expect(results[2].isViewRoot).toBe(true);
-        expect(DOM.getOuterHTML(results[0].element))
+        expect(stringifyElement(results[0].element))
             .toEqual('<template><template class="ng-binding"></template></template>');
         expect(results[2].element).toBe(originalChild);
       });
@@ -147,7 +156,7 @@ export function main() {
         expect(results[2].inheritedProtoView).not.toBe(null);
         expect(results[2].inheritedProtoView)
             .toBe(results[1].inheritedElementBinder.nestedProtoView);
-        expect(DOM.getOuterHTML(results[2].inheritedProtoView.rootElement))
+        expect(stringifyElement(results[2].inheritedProtoView.rootElement))
             .toEqual('<span template=""></span>');
       });
 
@@ -160,9 +169,9 @@ export function main() {
         var originalChild = rootElement.childNodes[0];
         var results = createPipeline().process(rootElement);
         expect(results[0].element).toBe(rootElement);
-        expect(DOM.getOuterHTML(results[0].element))
+        expect(stringifyElement(results[0].element))
             .toEqual('<div><template class="ng-binding" ng-if=""></template></div>');
-        expect(DOM.getOuterHTML(results[2].element)).toEqual('<span *ng-if=""></span>');
+        expect(stringifyElement(results[2].element)).toEqual('<span *ng-if=""></span>');
         expect(results[2].element).toBe(originalChild);
       });
 
@@ -180,7 +189,7 @@ export function main() {
         expect(results[0].element).toBe(rootElement);
         expect(results[0].isViewRoot).toBe(true);
         expect(results[2].isViewRoot).toBe(true);
-        expect(DOM.getOuterHTML(results[0].element))
+        expect(stringifyElement(results[0].element))
             .toEqual('<template><template class="ng-binding" foo=""></template></template>');
         expect(results[2].element).toBe(originalChild);
       });
@@ -233,7 +242,7 @@ export function main() {
         expect(results[2].inheritedProtoView).not.toBe(null);
         expect(results[2].inheritedProtoView)
             .toBe(results[1].inheritedElementBinder.nestedProtoView);
-        expect(DOM.getOuterHTML(results[2].inheritedProtoView.rootElement))
+        expect(stringifyElement(results[2].inheritedProtoView.rootElement))
             .toEqual('<span *foo=""></span>');
       });
 

modules/angular2/test/render/dom/shadow_dom/light_dom_spec.ts

@@ -7,7 +7,8 @@ import {
   iit,
   SpyObject,
   el,
-  proxy
+  proxy,
+  stringifyElement
 } from 'angular2/test_lib';
 import {IMPLEMENTS, isBlank, isPresent} from 'angular2/src/facade/lang';
 import {ListWrapper, MapWrapper} from 'angular2/src/facade/collection';
@@ -228,5 +229,5 @@ export function main() {
 
 function toHtml(nodes) {
   if (isBlank(nodes)) return [];
-  return ListWrapper.map(nodes, DOM.getOuterHTML);
+  return ListWrapper.map(nodes, stringifyElement);
 }