Fix HTML enhanced config.

pkg/unittest/lib/html_enhanced_config.dart

 // Copyright (c) 2011, the Dart project authors.  Please see the AUTHORS file
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.
 
 /**
  * A simple unit test library for running tests in a browser.
  *
  * Provides enhanced HTML output with collapsible group headers
  * and other at-a-glance information about the test results.
  */
 library unittest_html_enhanced_config;
 
+import 'dart:async';
 import 'dart:collection' show LinkedHashMap;
 import 'dart:html';
 import 'unittest.dart';
 
 class HtmlEnhancedConfiguration extends Configuration {
   /** Whether this is run within dartium layout tests. */
   final bool _isLayoutTest;
   HtmlEnhancedConfiguration(this._isLayoutTest);
 
-  // TODO(rnystrom): Get rid of this if we get canonical closures for methods.
-  EventListener _onErrorClosure;
-  EventListener _onMessageClosure;
+  var _onErrorSubscription = null;
+  var _onMessageSubscription = null;
 
-  void _installHandlers() {
-    if (_onErrorClosure == null) {
-      _onErrorClosure =
-          (e) => handleExternalError(e, '(DOM callback has errors)');
+  void _installOnErrorHandler() {
+    if (_onErrorSubscription == null) {
       // Listen for uncaught errors.
-      window.on.error.add(_onErrorClosure);
-    }
-    if (_onMessageClosure == null) {
-      _onMessageClosure = (e) => processMessage(e);
-      // Listen for errors from JS.
-      window.on.message.add(_onMessageClosure);
+      _onErrorSubscription = window.onError.listen(
+          (e) => handleExternalError(e, '(DOM callback has errors)'));
     }
   }
 
-  void _uninstallHandlers() {
-    if (_onErrorClosure != null) {
-      window.on.error.remove(_onErrorClosure);
-      _onErrorClosure = null;
-    }
-    if (_onMessageClosure != null) {
-      window.on.message.remove(_onMessageClosure);
-      _onMessageClosure = null;
+  void _installOnMessageHandler() {
+    if (_onMessageSubscription == null) {
+      // Listen for errors from JS.
+      _onMessageSubscription = window.onMessage.listen(
+          (e) => processMessage(e));
     }
   }
 
+  void _installHandlers() {
+    _installOnErrorHandler();
+    _installOnMessageHandler();
+  }
+
+  void _uninstallHandlers() {
+    if (_onErrorSubscription != null) {
+      _onErrorSubscription.cancel();
+      _onErrorSubscription = null;
+    }
+    if (_onMessageSubscription != null) {
+      _onMessageSubscription.cancel();
+      _onMessageSubscription = null;
+    }
+  }
+
   void processMessage(e) {
     if ('unittest-suite-external-error' == e.data) {
       handleExternalError('<unknown>', '(external error detected)');
     }
   }
 
   void onInit() {
     _installHandlers();
     //initialize and load CSS
     final String _CSSID = '_unittestcss_';
 
     var cssElement = document.head.query('#${_CSSID}');
     if (cssElement == null){
-      document.head.elements.add(new Element.html(
+      document.head.children.add(new Element.html(
           '<style id="${_CSSID}"></style>'));
       cssElement = document.head.query('#${_CSSID}');
     }
 
     cssElement.innerHtml = _htmlTestCSS;
     window.postMessage('unittest-suite-wait-for-done', '*');
   }
 
   void onStart() {
     // Listen for uncaught errors.
-    window.on.error.add(_onErrorClosure);
+    _installOnErrorHandler();
   }
 
   void onTestResult(TestCase testCase) {}
 
   void onSummary(int passed, int failed, int errors, List<TestCase> results,
       String uncaughtError) {
     _showInteractiveResultsInPage(passed, failed, errors, results,
         _isLayoutTest, uncaughtError);
   }
 
   void onDone(bool success) {
     _uninstallHandlers();
     window.postMessage('unittest-suite-done', '*');
   }
 
   void _showInteractiveResultsInPage(int passed, int failed, int errors,
       List<TestCase> results, bool isLayoutTest, String uncaughtError) {
     if (isLayoutTest && passed == results.length) {
       document.body.innerHtml = "PASS";
     } else {
       // changed the StringBuffer to an Element fragment
       Element te = new Element.html('<div class="unittest-table"></div>');
 
-      te.elements.add(new Element.html(passed == results.length
+      te.children.add(new Element.html(passed == results.length
           ? "<div class='unittest-overall unittest-pass'>PASS</div>"
           : "<div class='unittest-overall unittest-fail'>FAIL</div>"));
 
       // moved summary to the top since web browsers
       // don't auto-scroll to the bottom like consoles typically do.
       if (passed == results.length && uncaughtError == null) {
-        te.elements.add(new Element.html("""
+        te.children.add(new Element.html("""
           <div class='unittest-pass'>All ${passed} tests passed</div>"""));
       } else {
 
         if (uncaughtError != null) {
-          te.elements.add(new Element.html("""
+          te.children.add(new Element.html("""
             <div class='unittest-summary'>
               <span class='unittest-error'>Uncaught error: $uncaughtError</span>
             </div>"""));
         }
 
-        te.elements.add(new Element.html("""
+        te.children.add(new Element.html("""
           <div class='unittest-summary'>
             <span class='unittest-pass'>Total ${passed} passed</span>,
             <span class='unittest-fail'>${failed} failed</span>,
             <span class='unittest-error'>
             ${errors + (uncaughtError == null ? 0 : 1)} errors</span>
           </div>"""));
       }
 
-      te.elements.add(new Element.html("""
+      te.children.add(new Element.html("""
         <div><button id='btnCollapseAll'>Collapse All</button></div>
        """));
 
       // handle the click event for the collapse all button
-      te.query('#btnCollapseAll').on.click.add((_){
+      te.query('#btnCollapseAll').onClick.listen((_){
         document
           .queryAll('.unittest-row')
           .forEach((el) => el.attributes['class'] = el.attributes['class']
               .replaceAll('unittest-row ', 'unittest-row-hidden '));
       });
 
       var previousGroup = '';
       var groupPassFail = true;
       final indentAmount = 50;
 
@@ skipping 35 matching lines @@
           var testsInGroup = results
               .where((TestCase t) => t.currentGroup == previousGroup)
               .toList();
           var groupTotalTestCount = testsInGroup.length;
           var groupTestPassedCount = testsInGroup.where(
               (TestCase t) => t.result == 'pass').length;
           groupPassFail = groupTotalTestCount == groupTestPassedCount;
           var passFailClass = "unittest-group-status unittest-group-"
               "status-${groupPassFail ? 'pass' : 'fail'}";
 
-          te.elements.add(new Element.html("""
+          te.children.add(new Element.html("""
             <div>
               <div id='${safeGroup}'
                    class='unittest-group ${safeGroup} test${safeGroup}'>
                 <div ${_isIE ? "style='display:inline-block' ": ""}
                      class='unittest-row-status'>
                   <div class='$passFailClass'></div>
                 </div>
                 <div ${_isIE ? "style='display:inline-block' ": ""}>
                     ${test_.currentGroup}</div>
                 &nbsp;
                 <div ${_isIE ? "style='display:inline-block' ": ""}>
                     (${groupTestPassedCount}/${groupTotalTestCount})</div>
               </div>
             </div>"""));
 
           // 'safeGroup' could be empty
           var grp = (safeGroup == '') ? null : te.query('#${safeGroup}');
           if (grp != null){
-            grp.on.click.add((_){
+            grp.onClick.listen((_){
               var row = document.query('.unittest-row-${safeGroup}');
               if (row.attributes['class'].contains('unittest-row ')){
                 document.queryAll('.unittest-row-${safeGroup}').forEach(
                     (e) => e.attributes['class'] =  e.attributes['class']
                         .replaceAll('unittest-row ', 'unittest-row-hidden '));
               }else{
                 document.queryAll('.unittest-row-${safeGroup}').forEach(
                     (e) => e.attributes['class'] = e.attributes['class']
                         .replaceAll('unittest-row-hidden', 'unittest-row'));
               }
             });
           }
         }
 
         _buildRow(test_, te, safeGroup, !groupPassFail);
       }
 
-      document.body.elements.clear();
-      document.body.elements.add(te);
+      document.body.children.clear();
+      document.body.children.add(te);
     }
   }
 
   void _buildRow(TestCase test_, Element te, String groupID, bool isVisible) {
     var background = 'unittest-row-${test_.id % 2 == 0 ? "even" : "odd"}';
     var display = '${isVisible ? "unittest-row" : "unittest-row-hidden"}';
 
     // TODO (prujohn@gmail.com) I had to borrow this from html_print.dart
     // Probably should put it in some more common location.
     String _htmlEscape(String string) {
       return string.replaceAll('&', '&amp;')
                    .replaceAll('<','&lt;')
                    .replaceAll('>','&gt;');
     }
 
     addRowElement(id, status, description){
-      te.elements.add(
+      te.children.add(
         new Element.html(
           ''' <div>
                 <div class='$display unittest-row-${groupID} $background'>
                   <div ${_isIE ? "style='display:inline-block' ": ""}
                        class='unittest-row-id'>$id</div>
                   <div ${_isIE ? "style='display:inline-block' ": ""}
                        class="unittest-row-status unittest-${test_.result}">
                        $status</div>
                   <div ${_isIE ? "style='display:inline-block' ": ""}
                        class='unittest-row-description'>$description</div>
@@ skipping 10 matching lines @@
 
     addRowElement('${test_.id}', '${test_.result.toUpperCase()}',
         '${test_.description}. ${_htmlEscape(test_.message)}');
 
     if (test_.stackTrace != null) {
       addRowElement('', '', '<pre>${_htmlEscape(test_.stackTrace)}</pre>');
     }
   }
 
 
-  static bool get _isIE => document.window.navigator.userAgent.contains('MSIE');
+  static bool get _isIE => window.navigator.userAgent.contains('MSIE');
 
   String get _htmlTestCSS =>
   '''
   body{
     font-size: 14px;
     font-family: 'Open Sans', 'Lucida Sans Unicode', 'Lucida Grande','''
   ''' sans-serif;
     background: WhiteSmoke;
   }
 
@@ skipping 125 matching lines @@
   {
   }
 
   ''';
 }
 
 void useHtmlEnhancedConfiguration([bool isLayoutTest = false]) {
   if (config != null) return;
   configure(new HtmlEnhancedConfiguration(isLayoutTest));
 }