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

Closes #2106

modules/angular2/src/facade/collection.dart

@@ -172,8 +172,12 @@ class ListWrapper {
     l.removeRange(from, to);
     return sub;
   }
-  static void sort(List l, compareFn(a, b)) {
-    l.sort(compareFn);
+  static void sort(List l, [compareFn(a, b) = null]) {
+    if (compareFn == null) {
+      l.sort();
+    } else {
+      l.sort(compareFn);
+    }
   }
 
   // JS splice, slice, fill functions can take start < 0 which indicates a position relative to

modules/angular2/src/facade/collection.ts

@@ -1,4 +1,4 @@
-import {isJsObject, global} from 'angular2/src/facade/lang';
+import {isJsObject, global, isPresent} from 'angular2/src/facade/lang';
 
 export var List = global.Array;
 export var Map = global.Map;
@@ -231,7 +231,13 @@ export class ListWrapper {
     return l.slice(from, to === null ? undefined : to);
   }
   static splice<T>(l: List<T>, from: int, length: int): List<T> { return l.splice(from, length); }
-  static sort<T>(l: List<T>, compareFn: (a: T, b: T) => number) { l.sort(compareFn); }
+  static sort<T>(l: List<T>, compareFn?: (a: T, b: T) => number) {
+    if (isPresent(compareFn)) {
+      l.sort(compareFn);
+    } else {
+      l.sort();
+    }
+  }
 }
 
 export function isListLikeIterable(obj): boolean {

modules/angular2/src/test_lib/utils.ts

@@ -1,6 +1,6 @@
-import {List, ListWrapper} from 'angular2/src/facade/collection';
+import {List, ListWrapper, MapWrapper} from 'angular2/src/facade/collection';
 import {DOM} from 'angular2/src/dom/dom_adapter';
-import {isPresent, RegExpWrapper, StringWrapper, RegExp} from 'angular2/src/facade/lang';
+import {isPresent, isString, RegExpWrapper, StringWrapper, RegExp} from 'angular2/src/facade/lang';
 import {resolveInternalDomView} from 'angular2/src/render/dom/view/view';
 
 export class Log {
@@ -59,3 +59,45 @@ export function normalizeCSS(css: string): string {
                                        (match) => `[${match[1]}="${match[2]}"]`);
   return css;
 }
+
+var _singleTagWhitelist = ['br', 'hr', 'input'];
+export function stringifyElement(el): string {
+  var result = '';
+  if (DOM.isElementNode(el)) {
+    var tagName = StringWrapper.toLowerCase(DOM.tagName(el));
+
+    // Opening tag
+    result += `<${tagName}`;
+
+    // Attributes in an ordered way
+    var attributeMap = DOM.attributeMap(el);
+    var keys = ListWrapper.create();
+    MapWrapper.forEach(attributeMap, (v, k) => { ListWrapper.push(keys, k); });
+    ListWrapper.sort(keys);
+    for (let i = 0; i < keys.length; i++) {
+      var key = keys[i];
+      var attValue = MapWrapper.get(attributeMap, key);
+      if (!isString(attValue)) {
+        result += ` ${key}`;
+      } else {
+        result += ` ${key}="${attValue}"`;
+      }
+    }
+    result += '>';
+
+    // Children
+    var children = DOM.childNodes(DOM.templateAwareRoot(el));
+    for (let j = 0; j < children.length; j++) {
+      result += stringifyElement(children[j]);
+    }
+
+    // Closing tag
+    if (!ListWrapper.contains(_singleTagWhitelist, tagName)) {
+      result += `</${tagName}>`;
+    }
+  } else {
+    result += DOM.getText(el);
+  }
+
+  return result;
+}