fix selected index binding to not count microtasks

pkg/template_binding/test/template_binding_test.dart

 // Copyright (c) 2013, 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.
 
 library template_binding.test.template_binding_test;
 
 import 'dart:async';
 import 'dart:collection';
 import 'dart:html';
 import 'dart:math' as math;
@@ skipping 1129 matching lines @@
 
     m[0] = toObservable({'name': 'Item 1 changed'});
 
     i = 1;
     performMicrotaskCheckpoint();
     expect(div.nodes[i++].text, 'Item 1 changed');
     expect(div.nodes[i++].tagName, 'TEMPLATE');
     expect(div.nodes[i++].text, 'Item 2');
   });
 
-  observeTest('Attribute Template Option/Optgroup', () {
+  // Note: we don't need a zone for this test, and we don't want to alter timing
+  // since we're testing a rather subtle relationship between select and option.
+  test('Attribute Template Option/Optgroup', () {
     var div = createTestHtml(
         '<template bind>'
           '<select selectedIndex="{{ selected }}">'
             '<optgroup template repeat="{{ groups }}" label="{{ name }}">'
               '<option template repeat="{{ items }}">{{ val }}</option>'
             '</optgroup>'
           '</select>'
         '</template>');
 
     var m = toObservable({
       'selected': 1,
       'groups': [{
         'name': 'one', 'items': [{ 'val': 0 }, { 'val': 1 }]
       }],
     });
 
     recursivelySetTemplateModel(div, m);
-    performMicrotaskCheckpoint();
+    Observable.dirtyCheck();
 
-    var select = div.nodes[0].nextNode;
-    expect(select.nodes.length, 2);
+    // Use a timer so it's slower than mutation observers.
+    return new Future(() {
+      var select = div.nodes[0].nextNode;
+      expect(select.nodes.length, 2);
 
-    scheduleMicrotask(expectAsync0(() {
-      scheduleMicrotask(expectAsync0(() {
-        // TODO(jmesserly): this should be called sooner.
-        expect(select.selectedIndex, 1);
-      }));
-    }));
-    expect(select.nodes[0].tagName, 'TEMPLATE');
-    expect((templateBind(templateBind(select.nodes[0]).ref)
-        .content.nodes[0] as Element).tagName, 'OPTGROUP');
+      expect(select.selectedIndex, 1, reason: 'selected index should update by '
+          'animationFrame time');
 
-    var optgroup = select.nodes[1];
-    expect(optgroup.nodes[0].tagName, 'TEMPLATE');
-    expect(optgroup.nodes[1].tagName, 'OPTION');
-    expect(optgroup.nodes[1].text, '0');
-    expect(optgroup.nodes[2].tagName, 'OPTION');
-    expect(optgroup.nodes[2].text, '1');
+      expect(select.nodes[0].tagName, 'TEMPLATE');
+      expect((templateBind(templateBind(select.nodes[0]).ref)
+          .content.nodes[0] as Element).tagName, 'OPTGROUP');
+
+      var optgroup = select.nodes[1];
+      expect(optgroup.nodes[0].tagName, 'TEMPLATE');
+      expect(optgroup.nodes[1].tagName, 'OPTION');
+      expect(optgroup.nodes[1].text, '0');
+      expect(optgroup.nodes[2].tagName, 'OPTION');
+      expect(optgroup.nodes[2].text, '1');
+    });
   });
 
   observeTest('NestedIterateTableMixedSemanticNative', () {
     if (!parserHasNativeTemplate) return;
 
     var div = createTestHtml(
         '<table><tbody>'
           '<template repeat="{{}}">'
             '<tr>'
               '<td template repeat="{{}}" class="{{ val }}">{{ val }}</td>'
@@ skipping 655 matching lines @@
   prepareBinding(path, name, node) {
     if (name != 'text' || path != 'age') return null;
 
     return (model, node) {
       expect(model['age'], expectedAge);
       count++;
       return model;
     };
   }
 }