| Index: pkg/template_binding/test/node_bind_test.dart
 | 
| diff --git a/pkg/template_binding/test/node_bind_test.dart b/pkg/template_binding/test/node_bind_test.dart
 | 
| index fbedcfa3271724e2151f29ee29d02f95bc3800c7..93bcd8fe2ff1fea8cdd5148e366ab5516552a853 100644
 | 
| --- a/pkg/template_binding/test/node_bind_test.dart
 | 
| +++ b/pkg/template_binding/test/node_bind_test.dart
 | 
| @@ -4,11 +4,12 @@
 | 
|  
 | 
|  library template_binding.test.node_bind_test;
 | 
|  
 | 
| +import 'dart:async';
 | 
|  import 'dart:html';
 | 
|  
 | 
| -import 'package:observe/observe.dart' show toObservable, PathObserver;
 | 
| +import 'package:observe/observe.dart'
 | 
| +    show toObservable, PathObserver, PropertyPath;
 | 
|  import 'package:template_binding/template_binding.dart' show nodeBind;
 | 
| -import 'package:template_binding/src/node_binding.dart' show getObserverForTest;
 | 
|  
 | 
|  import 'package:unittest/html_config.dart';
 | 
|  import 'package:unittest/unittest.dart';
 | 
| @@ -17,7 +18,7 @@ import 'utils.dart';
 | 
|  // Note: this file ported from
 | 
|  // https://github.com/toolkitchen/mdv/blob/master/tests/node_bindings.js
 | 
|  
 | 
| -main() {
 | 
| +main() => dirtyCheckZone().run(() {
 | 
|    useHtmlConfiguration();
 | 
|  
 | 
|    setUp(() {
 | 
| @@ -29,147 +30,162 @@ main() {
 | 
|      testDiv = null;
 | 
|    });
 | 
|  
 | 
| -
 | 
|    group('Text bindings', testBindings);
 | 
|    group('Element attribute bindings', elementBindings);
 | 
|    group('Form Element bindings', formBindings);
 | 
| -}
 | 
| +});
 | 
|  
 | 
|  testBindings() {
 | 
| -  observeTest('Basic', () {
 | 
| +  test('Basic', () {
 | 
|      var text = new Text('hi');
 | 
|      var model = toObservable({'a': 1});
 | 
| -    nodeBind(text).bind('text', model, 'a');
 | 
| +    nodeBind(text).bind('text', new PathObserver(model, 'a'));
 | 
|      expect(text.text, '1');
 | 
|  
 | 
|      model['a'] = 2;
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(text.text, '2');
 | 
| -
 | 
| -    nodeBind(text).unbind('text');
 | 
| -    model['a'] = 3;
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(text.text, '2');
 | 
| +    return new Future(() {
 | 
| +      expect(text.text, '2');
 | 
| +
 | 
| +      nodeBind(text).unbind('text');
 | 
| +      model['a'] = 3;
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      // TODO(rafaelw): Throw on binding to unavailable property?
 | 
| +      expect(text.text, '2');
 | 
| +    });
 | 
| +  });
 | 
|  
 | 
| -    // TODO(rafaelw): Throw on binding to unavailable property?
 | 
| +  test('oneTime', () {
 | 
| +    var text = new Text('hi');
 | 
| +    nodeBind(text).bind('text', 1, oneTime: true);
 | 
| +    expect(text.text, '1');
 | 
|    });
 | 
|  
 | 
| -  observeTest('No Path', () {
 | 
| +  test('No Path', () {
 | 
|      var text = new Text('hi');
 | 
|      var model = 1;
 | 
| -    nodeBind(text).bind('text', model);
 | 
| +    nodeBind(text).bind('text', new PathObserver(model));
 | 
|      expect(text.text, '1');
 | 
|    });
 | 
|  
 | 
| -  observeTest('Path unreachable', () {
 | 
| +  test('Path unreachable', () {
 | 
|      var text = testDiv.append(new Text('hi'));
 | 
|      var model = 1;
 | 
| -    nodeBind(text).bind('text', model, 'a');
 | 
| +    nodeBind(text).bind('text', new PathObserver(model, 'a'));
 | 
|      expect(text.text, '');
 | 
|    });
 | 
|  
 | 
| -  observeTest('Observer is Model', () {
 | 
| +  test('Observer is Model', () {
 | 
|      var text = new Text('');
 | 
|      var model = toObservable({'a': {'b': {'c': 1}}});
 | 
|      var observer = new PathObserver(model, 'a.b.c');
 | 
| -    nodeBind(text).bind('text', observer, 'value');
 | 
| +    nodeBind(text).bind('text', observer);
 | 
|      expect(text.text, '1');
 | 
|  
 | 
|      var binding = nodeBind(text).bindings['text'];
 | 
| -    expect(binding, isNotNull);
 | 
| -    expect(getObserverForTest(binding), observer,
 | 
| -        reason: 'should reuse observer');
 | 
| +    expect(binding, observer, reason: 'should reuse observer');
 | 
|  
 | 
|      model['a']['b']['c'] = 2;
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(text.text, '2');
 | 
| -    nodeBind(text).unbind('text');
 | 
| +    return new Future(() {
 | 
| +      expect(text.text, '2');
 | 
| +      nodeBind(text).unbind('text');
 | 
| +    });
 | 
|    });
 | 
|  }
 | 
|  
 | 
|  elementBindings() {
 | 
| -  observeTest('Basic', () {
 | 
| +  test('Basic', () {
 | 
|      var el = new DivElement();
 | 
|      var model = toObservable({'a': '1'});
 | 
| -    nodeBind(el).bind('foo', model, 'a');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.attributes['foo'], '1');
 | 
| -
 | 
| -    model['a'] = '2';
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.attributes['foo'], '2');
 | 
| -
 | 
| -    model['a'] = 232.2;
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.attributes['foo'], '232.2');
 | 
| -
 | 
| -    model['a'] = 232;
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.attributes['foo'], '232');
 | 
| +    nodeBind(el).bind('foo', new PathObserver(model, 'a'));
 | 
| +
 | 
| +    return new Future(() {
 | 
| +      expect(el.attributes['foo'], '1');
 | 
| +      model['a'] = '2';
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(el.attributes['foo'], '2');
 | 
| +      model['a'] = 232.2;
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(el.attributes['foo'], '232.2');
 | 
| +      model['a'] = 232;
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(el.attributes['foo'], '232');
 | 
| +      model['a'] = null;
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(el.attributes['foo'], '');
 | 
| +    });
 | 
| +  });
 | 
|  
 | 
| -    model['a'] = null;
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.attributes['foo'], '');
 | 
| +  test('oneTime', () {
 | 
| +    var el = testDiv.append(new DivElement());
 | 
| +    var model = toObservable({'a': '1'});
 | 
| +    nodeBind(el).bind('foo', 1, oneTime: true);
 | 
| +    expect('1', el.attributes['foo']);
 | 
|    });
 | 
|  
 | 
| -  observeTest('No Path', () {
 | 
| +  test('No Path', () {
 | 
|      var el = testDiv.append(new DivElement());
 | 
|      var model = 1;
 | 
| -    nodeBind(el).bind('foo', model);
 | 
| -    expect(el.attributes['foo'], '1');
 | 
| +    nodeBind(el).bind('foo', new PathObserver(model));
 | 
| +    return new Future(() {
 | 
| +      expect(el.attributes['foo'], '1');
 | 
| +    });
 | 
|    });
 | 
|  
 | 
| -  observeTest('Path unreachable', () {
 | 
| +  test('Path unreachable', () {
 | 
|      var el = testDiv.append(new DivElement());
 | 
|      var model = toObservable({});
 | 
| -    nodeBind(el).bind('foo', model, 'bar');
 | 
| -    expect(el.attributes['foo'], '');
 | 
| +    nodeBind(el).bind('foo', new PathObserver(model, 'bar'));
 | 
| +    return new Future(() {
 | 
| +      expect(el.attributes['foo'], '');
 | 
| +    });
 | 
|    });
 | 
|  
 | 
| -  observeTest('Dashes', () {
 | 
| +  test('Dashes', () {
 | 
|      var el = testDiv.append(new DivElement());
 | 
|      var model = toObservable({'a': '1'});
 | 
| -    nodeBind(el).bind('foo-bar', model, 'a');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.attributes['foo-bar'], '1');
 | 
| +    nodeBind(el).bind('foo-bar', new PathObserver(model, 'a'));
 | 
| +    return new Future(() {
 | 
| +      expect(el.attributes['foo-bar'], '1');
 | 
| +      model['a'] = '2';
 | 
|  
 | 
| -    model['a'] = '2';
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.attributes['foo-bar'], '2');
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(el.attributes['foo-bar'], '2');
 | 
| +    });
 | 
|    });
 | 
|  
 | 
| -  observeTest('Element.id, Element.hidden?', () {
 | 
| +  test('Element.id, Element.hidden?', () {
 | 
|      var element = new DivElement();
 | 
|      var model = toObservable({'a': 1, 'b': 2});
 | 
| -    nodeBind(element).bind('hidden?', model, 'a');
 | 
| -    nodeBind(element).bind('id', model, 'b');
 | 
| +    nodeBind(element).bind('hidden?', new PathObserver(model, 'a'));
 | 
| +    nodeBind(element).bind('id', new PathObserver(model, 'b'));
 | 
|  
 | 
|      expect(element.attributes, contains('hidden'));
 | 
|      expect(element.attributes['hidden'], '');
 | 
|      expect(element.id, '2');
 | 
|  
 | 
|      model['a'] = null;
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(element.attributes, isNot(contains('hidden')),
 | 
| -        reason: 'null is false-y');
 | 
| -
 | 
| -    model['a'] = false;
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(element.attributes, isNot(contains('hidden')));
 | 
| -
 | 
| -    model['a'] = 'foo';
 | 
| -    model['b'] = 'x';
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(element.attributes, contains('hidden'));
 | 
| -    expect(element.attributes['hidden'], '');
 | 
| -    expect(element.id, 'x');
 | 
| +    return new Future(() {
 | 
| +      expect(element.attributes, isNot(contains('hidden')),
 | 
| +          reason: 'null is false-y');
 | 
| +
 | 
| +      model['a'] = false;
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(element.attributes, isNot(contains('hidden')));
 | 
| +
 | 
| +      model['a'] = 'foo';
 | 
| +      model['b'] = 'x';
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(element.attributes, contains('hidden'));
 | 
| +      expect(element.attributes['hidden'], '');
 | 
| +      expect(element.id, 'x');
 | 
| +    });
 | 
|    });
 | 
|  
 | 
| -  observeTest('Element.id - path unreachable', () {
 | 
| +  test('Element.id - path unreachable', () {
 | 
|      var element = testDiv.append(new DivElement());
 | 
|      var model = toObservable({});
 | 
| -    nodeBind(element).bind('id', model, 'a');
 | 
| -    expect(element.id, '');
 | 
| +    nodeBind(element).bind('id', new PathObserver(model, 'a'));
 | 
| +    return new Future(() => expect(element.id, ''));
 | 
|    });
 | 
|  }
 | 
|  
 | 
| @@ -178,237 +194,284 @@ formBindings() {
 | 
|      var el = new Element.tag(tagName);
 | 
|      testDiv.nodes.add(el);
 | 
|      var model = toObservable({'x': 42});
 | 
| -    nodeBind(el).bind('value', model, 'x');
 | 
| +    nodeBind(el).bind('value', new PathObserver(model, 'x'));
 | 
|      expect(el.value, '42');
 | 
|  
 | 
|      model['x'] = 'Hi';
 | 
|      expect(el.value, '42', reason: 'changes delivered async');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.value, 'Hi');
 | 
| +    return new Future(() {
 | 
| +      expect(el.value, 'Hi');
 | 
|  
 | 
| -    el.value = 'changed';
 | 
| -    dispatchEvent('input', el);
 | 
| -    expect(model['x'], 'changed');
 | 
| +      el.value = 'changed';
 | 
| +      dispatchEvent('input', el);
 | 
| +      expect(model['x'], 'changed');
 | 
|  
 | 
| -    nodeBind(el).unbind('value');
 | 
| +      nodeBind(el).unbind('value');
 | 
|  
 | 
| -    el.value = 'changed again';
 | 
| -    dispatchEvent('input', el);
 | 
| -    expect(model['x'], 'changed');
 | 
| +      el.value = 'changed again';
 | 
| +      dispatchEvent('input', el);
 | 
| +      expect(model['x'], 'changed');
 | 
|  
 | 
| -    nodeBind(el).bind('value', model, 'x');
 | 
| -    model['x'] = null;
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.value, '');
 | 
| +      nodeBind(el).bind('value', new PathObserver(model, 'x'));
 | 
| +      model['x'] = null;
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(el.value, '');
 | 
| +    });
 | 
| +  }
 | 
| +
 | 
| +  inputTextAreaValueOnetime(String tagName) {
 | 
| +    var el = testDiv.append(new Element.tag(tagName));
 | 
| +    nodeBind(el).bind('value', 42, oneTime: true);
 | 
| +    expect(el.value, '42');
 | 
|    }
 | 
|  
 | 
|    inputTextAreaNoPath(String tagName) {
 | 
|      var el = testDiv.append(new Element.tag(tagName));
 | 
|      var model = 42;
 | 
| -    nodeBind(el).bind('value', model);
 | 
| +    nodeBind(el).bind('value', new PathObserver(model));
 | 
|      expect(el.value, '42');
 | 
|    }
 | 
|  
 | 
|    inputTextAreaPathUnreachable(String tagName) {
 | 
|      var el = testDiv.append(new Element.tag(tagName));
 | 
|      var model = toObservable({});
 | 
| -    nodeBind(el).bind('value', model, 'a');
 | 
| +    nodeBind(el).bind('value', new PathObserver(model, 'a'));
 | 
|      expect(el.value, '');
 | 
|    }
 | 
|  
 | 
| -  observeTest('Input.value',
 | 
| +  test('Input.value',
 | 
|        () => inputTextAreaValueTest('input'));
 | 
| -  observeTest('Input.value - no path',
 | 
| +
 | 
| +  test('Input.value - oneTime',
 | 
| +      () => inputTextAreaValueOnetime('input'));
 | 
| +
 | 
| +  test('Input.value - no path',
 | 
|        () => inputTextAreaNoPath('input'));
 | 
| -  observeTest('Input.value - path unreachable',
 | 
| +
 | 
| +  test('Input.value - path unreachable',
 | 
|        () => inputTextAreaPathUnreachable('input'));
 | 
| -  observeTest('TextArea.value',
 | 
| +
 | 
| +  test('TextArea.value',
 | 
|        () => inputTextAreaValueTest('textarea'));
 | 
| -  observeTest('TextArea.value - no path',
 | 
| +
 | 
| +  test('TextArea.value - oneTime',
 | 
| +      () => inputTextAreaValueOnetime('textarea'));
 | 
| +
 | 
| +  test('TextArea.value - no path',
 | 
|        () => inputTextAreaNoPath('textarea'));
 | 
| -  observeTest('TextArea.value - path unreachable',
 | 
| +
 | 
| +  test('TextArea.value - path unreachable',
 | 
|        () => inputTextAreaPathUnreachable('textarea'));
 | 
|  
 | 
| -  observeTest('Radio Input', () {
 | 
| +  test('Radio Input', () {
 | 
|      var input = new InputElement();
 | 
|      input.type = 'radio';
 | 
|      var model = toObservable({'x': true});
 | 
| -    nodeBind(input).bind('checked', model, 'x');
 | 
| +    nodeBind(input).bind('checked', new PathObserver(model, 'x'));
 | 
|      expect(input.checked, true);
 | 
|  
 | 
|      model['x'] = false;
 | 
|      expect(input.checked, true);
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(input.checked, false,reason: 'model change should update checked');
 | 
| +    return new Future(() {
 | 
| +      expect(input.checked, false,reason: 'model change should update checked');
 | 
|  
 | 
| -    input.checked = true;
 | 
| -    dispatchEvent('change', input);
 | 
| -    expect(model['x'], true, reason: 'input.checked should set model');
 | 
| +      input.checked = true;
 | 
| +      dispatchEvent('change', input);
 | 
| +      expect(model['x'], true, reason: 'input.checked should set model');
 | 
|  
 | 
| -    nodeBind(input).unbind('checked');
 | 
| +      nodeBind(input).unbind('checked');
 | 
|  
 | 
| -    input.checked = false;
 | 
| -    dispatchEvent('change', input);
 | 
| -    expect(model['x'], true,
 | 
| -        reason: 'disconnected binding should not fire');
 | 
| +      input.checked = false;
 | 
| +      dispatchEvent('change', input);
 | 
| +      expect(model['x'], true,
 | 
| +          reason: 'disconnected binding should not fire');
 | 
| +    });
 | 
|    });
 | 
|  
 | 
| -  observeTest('Input.value - user value rejected', () {
 | 
| +  test('Input.value - user value rejected', () {
 | 
|      var model = toObservable({'val': 'ping'});
 | 
|  
 | 
|      var el = new InputElement();
 | 
| -    nodeBind(el).bind('value', model, 'val');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.value, 'ping');
 | 
| -
 | 
| -    el.value = 'pong';
 | 
| -    dispatchEvent('input', el);
 | 
| -    expect(model['val'], 'pong');
 | 
| -
 | 
| -    // Try a deep path.
 | 
| -    model = toObservable({'a': {'b': {'c': 'ping'}}});
 | 
| -
 | 
| -    nodeBind(el).bind('value', model, 'a.b.c');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.value, 'ping');
 | 
| -
 | 
| -    el.value = 'pong';
 | 
| -    dispatchEvent('input', el);
 | 
| -    expect(new PathObserver(model, 'a.b.c').value, 'pong');
 | 
| -
 | 
| -    // Start with the model property being absent.
 | 
| -    model['a']['b'].remove('c');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.value, '');
 | 
| -
 | 
| -    el.value = 'pong';
 | 
| -    dispatchEvent('input', el);
 | 
| -    expect(new PathObserver(model, 'a.b.c').value, 'pong');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -
 | 
| -    // Model property unreachable (and unsettable).
 | 
| -    model['a'].remove('b');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.value, '');
 | 
| -
 | 
| -    el.value = 'pong';
 | 
| -    dispatchEvent('input', el);
 | 
| -    expect(new PathObserver(model, 'a.b.c').value, null);
 | 
| +    nodeBind(el).bind('value', new PathObserver(model, 'val'));
 | 
| +    return new Future(() {
 | 
| +      expect(el.value, 'ping');
 | 
| +
 | 
| +      el.value = 'pong';
 | 
| +      dispatchEvent('input', el);
 | 
| +      expect(model['val'], 'pong');
 | 
| +
 | 
| +      // Try a deep path.
 | 
| +      model = toObservable({'a': {'b': {'c': 'ping'}}});
 | 
| +
 | 
| +      nodeBind(el).bind('value', new PathObserver(model, 'a.b.c'));
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(el.value, 'ping');
 | 
| +
 | 
| +      el.value = 'pong';
 | 
| +      dispatchEvent('input', el);
 | 
| +      expect(new PropertyPath('a.b.c').getValueFrom(model), 'pong');
 | 
| +
 | 
| +      // Start with the model property being absent.
 | 
| +      model['a']['b'].remove('c');
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(el.value, '');
 | 
| +
 | 
| +      el.value = 'pong';
 | 
| +      dispatchEvent('input', el);
 | 
| +      expect(new PropertyPath('a.b.c').getValueFrom(model), 'pong');
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +
 | 
| +      // Model property unreachable (and unsettable).
 | 
| +      model['a'].remove('b');
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(el.value, '');
 | 
| +
 | 
| +      el.value = 'pong';
 | 
| +      dispatchEvent('input', el);
 | 
| +      expect(new PropertyPath('a.b.c').getValueFrom(model), null);
 | 
| +    });
 | 
|    });
 | 
|  
 | 
| -  observeTest('(Checkbox)Input.checked', () {
 | 
| +  test('Checkbox Input.checked', () {
 | 
|      var el = testDiv.append(new InputElement());
 | 
|      el.type = 'checkbox';
 | 
|  
 | 
|      var model = toObservable({'x': true});
 | 
| -    nodeBind(el).bind('checked', model, 'x');
 | 
| +    nodeBind(el).bind('checked', new PathObserver(model, 'x'));
 | 
|      expect(el.checked, true);
 | 
|  
 | 
|      model['x'] = false;
 | 
|      expect(el.checked, true, reason: 'changes delivered async');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.checked, false);
 | 
| +    return new Future(() {
 | 
| +      expect(el.checked, false);
 | 
|  
 | 
| -    el.click();
 | 
| -    expect(model['x'], true);
 | 
| -    performMicrotaskCheckpoint();
 | 
| +      el.click();
 | 
| +      expect(model['x'], true);
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
|  
 | 
| -    el.click();
 | 
| -    expect(model['x'], false);
 | 
| +      el.click();
 | 
| +      expect(model['x'], false);
 | 
| +    });
 | 
| +  });
 | 
| +
 | 
| +  test('Checkbox Input.checked - oneTime', () {
 | 
| +    var input = testDiv.append(new InputElement());
 | 
| +    input.type = 'checkbox';
 | 
| +    nodeBind(input).bind('checked', true, oneTime: true);
 | 
| +    expect(input.checked, true, reason: 'checked was set');
 | 
|    });
 | 
|  
 | 
| -  observeTest('(Checkbox)Input.checked - path unreachable', () {
 | 
| +  test('Checkbox Input.checked - path unreachable', () {
 | 
|      var input = testDiv.append(new InputElement());
 | 
|      input.type = 'checkbox';
 | 
|      var model = toObservable({});
 | 
| -    nodeBind(input).bind('checked', model, 'x');
 | 
| +    nodeBind(input).bind('checked', new PathObserver(model, 'x'));
 | 
|      expect(input.checked, false);
 | 
|    });
 | 
|  
 | 
| -  observeTest('(Checkbox)Input.checked 2', () {
 | 
| +  test('Checkbox Input.checked 2', () {
 | 
|      var model = toObservable({'val': true});
 | 
|  
 | 
|      var el = testDiv.append(new InputElement());
 | 
|      el.type = 'checkbox';
 | 
| -    nodeBind(el).bind('checked', model, 'val');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.checked, true);
 | 
| +    nodeBind(el).bind('checked', new PathObserver(model, 'val'));
 | 
| +    return new Future(() {
 | 
| +      expect(el.checked, true);
 | 
|  
 | 
| -    model['val'] = false;
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.checked, false);
 | 
| +      model['val'] = false;
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(el.checked, false);
 | 
|  
 | 
| -    el.click();
 | 
| -    expect(model['val'], true);
 | 
| +      el.click();
 | 
| +      expect(model['val'], true);
 | 
|  
 | 
| -    el.click();
 | 
| -    expect(model['val'], false);
 | 
| +      el.click();
 | 
| +      expect(model['val'], false);
 | 
|  
 | 
| -    el.onClick.listen((_) {
 | 
| -      expect(model['val'], true);
 | 
| -    });
 | 
| -    el.onChange.listen((_) {
 | 
| -      expect(model['val'], true);
 | 
| -    });
 | 
| +      el.onClick.listen((_) {
 | 
| +        expect(model['val'], true);
 | 
| +      });
 | 
| +      el.onChange.listen((_) {
 | 
| +        expect(model['val'], true);
 | 
| +      });
 | 
|  
 | 
| -    el.dispatchEvent(new MouseEvent('click', view: window));
 | 
| +      el.dispatchEvent(new MouseEvent('click', view: window));
 | 
| +    });
 | 
|    });
 | 
|  
 | 
| -  observeTest('(Checkbox)Input.checked - binding updated on click', () {
 | 
| +  test('Checkbox Input.checked - binding updated on click', () {
 | 
|      var model = toObservable({'val': true});
 | 
|  
 | 
|      var el = new InputElement();
 | 
|      testDiv.append(el);
 | 
|      el.type = 'checkbox';
 | 
| -    nodeBind(el).bind('checked', model, 'val');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.checked, true);
 | 
| +    nodeBind(el).bind('checked', new PathObserver(model, 'val'));
 | 
| +    return new Future(() {
 | 
| +      expect(el.checked, true);
 | 
|  
 | 
| -    el.onClick.listen((_) {
 | 
| -      expect(model['val'], false);
 | 
| -    });
 | 
| +      int fired = 0;
 | 
| +      el.onClick.listen((_) {
 | 
| +        fired++;
 | 
| +        expect(model['val'], false);
 | 
| +      });
 | 
| +
 | 
| +      el.dispatchEvent(new MouseEvent('click', view: window));
 | 
|  
 | 
| -    el.dispatchEvent(new MouseEvent('click', view: window));
 | 
| +      expect(fired, 1, reason: 'events dispatched synchronously');
 | 
| +    });
 | 
|    });
 | 
|  
 | 
| -  observeTest('(Checkbox)Input.checked - binding updated on change', () {
 | 
| +  test('Checkbox Input.checked - binding updated on change', () {
 | 
|      var model = toObservable({'val': true});
 | 
|  
 | 
|      var el = new InputElement();
 | 
|      testDiv.append(el);
 | 
|      el.type = 'checkbox';
 | 
| -    nodeBind(el).bind('checked', model, 'val');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el.checked, true);
 | 
| +    nodeBind(el).bind('checked', new PathObserver(model, 'val'));
 | 
| +    return new Future(() {
 | 
| +      expect(el.checked, true);
 | 
|  
 | 
| -    el.onChange.listen((_) {
 | 
| -      expect(model['val'], false);
 | 
| -    });
 | 
| +      int fired = 0;
 | 
| +      el.onChange.listen((_) {
 | 
| +        fired++;
 | 
| +        expect(model['val'], false);
 | 
| +      });
 | 
|  
 | 
| -    el.dispatchEvent(new MouseEvent('click', view: window));
 | 
| +      el.dispatchEvent(new MouseEvent('click', view: window));
 | 
| +
 | 
| +      expect(fired, 1, reason: 'events dispatched synchronously');
 | 
| +    });
 | 
|    });
 | 
|  
 | 
| -  observeTest('(Radio)Input.checked', () {
 | 
| +  test('Radio Input.checked', () {
 | 
|      var input = testDiv.append(new InputElement());
 | 
|      input.type = 'radio';
 | 
|      var model = toObservable({'x': true});
 | 
| -    nodeBind(input).bind('checked', model, 'x');
 | 
| +    nodeBind(input).bind('checked', new PathObserver(model, 'x'));
 | 
|      expect(input.checked, true);
 | 
|  
 | 
|      model['x'] = false;
 | 
|      expect(input.checked, true);
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(input.checked, false);
 | 
| +    return new Future(() {
 | 
| +      expect(input.checked, false);
 | 
|  
 | 
| -    input.checked = true;
 | 
| -    dispatchEvent('change', input);
 | 
| -    expect(model['x'], true);
 | 
| +      input.checked = true;
 | 
| +      dispatchEvent('change', input);
 | 
| +      expect(model['x'], true);
 | 
|  
 | 
| -    nodeBind(input).unbind('checked');
 | 
| +      nodeBind(input).unbind('checked');
 | 
|  
 | 
| -    input.checked = false;
 | 
| -    dispatchEvent('change', input);
 | 
| -    expect(model['x'], true);
 | 
| +      input.checked = false;
 | 
| +      dispatchEvent('change', input);
 | 
| +      expect(model['x'], true);
 | 
| +    });
 | 
| +  });
 | 
| +
 | 
| +  test('Radio Input.checked - oneTime', () {
 | 
| +    var input = testDiv.append(new InputElement());
 | 
| +    input.type = 'radio';
 | 
| +    nodeBind(input).bind('checked', true, oneTime: true);
 | 
| +    expect(input.checked, true, reason: 'checked was set');
 | 
|    });
 | 
|  
 | 
|    radioInputChecked2(host) {
 | 
| @@ -421,69 +484,67 @@ formBindings() {
 | 
|      var el1 = container.append(new InputElement());
 | 
|      el1.type = 'radio';
 | 
|      el1.name = RADIO_GROUP_NAME;
 | 
| -    nodeBind(el1).bind('checked', model, 'val1');
 | 
| +    nodeBind(el1).bind('checked', new PathObserver(model, 'val1'));
 | 
|  
 | 
|      var el2 = container.append(new InputElement());
 | 
|      el2.type = 'radio';
 | 
|      el2.name = RADIO_GROUP_NAME;
 | 
| -    nodeBind(el2).bind('checked', model, 'val2');
 | 
| +    nodeBind(el2).bind('checked', new PathObserver(model, 'val2'));
 | 
|  
 | 
|      var el3 = container.append(new InputElement());
 | 
|      el3.type = 'radio';
 | 
|      el3.name = RADIO_GROUP_NAME;
 | 
| -    nodeBind(el3).bind('checked', model, 'val3');
 | 
| +    nodeBind(el3).bind('checked', new PathObserver(model, 'val3'));
 | 
|  
 | 
|      var el4 = container.append(new InputElement());
 | 
|      el4.type = 'radio';
 | 
|      el4.name = 'othergroup';
 | 
| -    nodeBind(el4).bind('checked', model, 'val4');
 | 
| -
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el1.checked, true);
 | 
| -    expect(el2.checked, false);
 | 
| -    expect(el3.checked, false);
 | 
| -    expect(el4.checked, true);
 | 
| -
 | 
| -    model['val1'] = false;
 | 
| -    model['val2'] = true;
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el1.checked, false);
 | 
| -    expect(el2.checked, true);
 | 
| -    expect(el3.checked, false);
 | 
| -    expect(el4.checked, true);
 | 
| -
 | 
| -    el1.checked = true;
 | 
| -    dispatchEvent('change', el1);
 | 
| -    expect(model['val1'], true);
 | 
| -    expect(model['val2'], false);
 | 
| -    expect(model['val3'], false);
 | 
| -    expect(model['val4'], true);
 | 
| -
 | 
| -    el3.checked = true;
 | 
| -    dispatchEvent('change', el3);
 | 
| -    expect(model['val1'], false);
 | 
| -    expect(model['val2'], false);
 | 
| -    expect(model['val3'], true);
 | 
| -    expect(model['val4'], true);
 | 
| +    nodeBind(el4).bind('checked', new PathObserver(model, 'val4'));
 | 
| +
 | 
| +    return new Future(() {
 | 
| +      expect(el1.checked, true);
 | 
| +      expect(el2.checked, false);
 | 
| +      expect(el3.checked, false);
 | 
| +      expect(el4.checked, true);
 | 
| +
 | 
| +      model['val1'] = false;
 | 
| +      model['val2'] = true;
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(el1.checked, false);
 | 
| +      expect(el2.checked, true);
 | 
| +      expect(el3.checked, false);
 | 
| +      expect(el4.checked, true);
 | 
| +
 | 
| +      el1.checked = true;
 | 
| +      dispatchEvent('change', el1);
 | 
| +      expect(model['val1'], true);
 | 
| +      expect(model['val2'], false);
 | 
| +      expect(model['val3'], false);
 | 
| +      expect(model['val4'], true);
 | 
| +
 | 
| +      el3.checked = true;
 | 
| +      dispatchEvent('change', el3);
 | 
| +      expect(model['val1'], false);
 | 
| +      expect(model['val2'], false);
 | 
| +      expect(model['val3'], true);
 | 
| +      expect(model['val4'], true);
 | 
| +    });
 | 
|    }
 | 
|  
 | 
| -  observeTest('(Radio)Input.checked 2', () {
 | 
| -    radioInputChecked2(testDiv);
 | 
| -  });
 | 
| +  test('Radio Input.checked 2', () => radioInputChecked2(testDiv));
 | 
|  
 | 
| -  observeTest('(Radio)Input.checked 2 - ShadowRoot', () {
 | 
| -    if (!ShadowRoot.supported) return;
 | 
| +  test('Radio Input.checked 2 - ShadowRoot', () {
 | 
| +    if (!ShadowRoot.supported) return null;
 | 
|  
 | 
| -    var div = new DivElement();
 | 
| -    var shadowRoot = div.createShadowRoot();
 | 
| -    radioInputChecked2(shadowRoot);
 | 
| -    unbindAll(shadowRoot);
 | 
| +    var shadowRoot = new DivElement().createShadowRoot();
 | 
| +    return radioInputChecked2(shadowRoot)
 | 
| +        .whenComplete(() => unbindAll(shadowRoot));
 | 
|    });
 | 
|  
 | 
|    radioInputCheckedMultipleForms(host) {
 | 
|      var model = toObservable({'val1': true, 'val2': false, 'val3': false,
 | 
|          'val4': true});
 | 
| -    var RADIO_GROUP_NAME = 'observeTest';
 | 
| +    var RADIO_GROUP_NAME = 'test';
 | 
|  
 | 
|      var container = testDiv.append(new DivElement());
 | 
|      var form1 = new FormElement();
 | 
| @@ -495,64 +556,65 @@ formBindings() {
 | 
|      form1.append(el1);
 | 
|      el1.type = 'radio';
 | 
|      el1.name = RADIO_GROUP_NAME;
 | 
| -    nodeBind(el1).bind('checked', model, 'val1');
 | 
| +    nodeBind(el1).bind('checked', new PathObserver(model, 'val1'));
 | 
|  
 | 
|      var el2 = new InputElement();
 | 
|      form1.append(el2);
 | 
|      el2.type = 'radio';
 | 
|      el2.name = RADIO_GROUP_NAME;
 | 
| -    nodeBind(el2).bind('checked', model, 'val2');
 | 
| +    nodeBind(el2).bind('checked', new PathObserver(model, 'val2'));
 | 
|  
 | 
|      var el3 = new InputElement();
 | 
|      form2.append(el3);
 | 
|      el3.type = 'radio';
 | 
|      el3.name = RADIO_GROUP_NAME;
 | 
| -    nodeBind(el3).bind('checked', model, 'val3');
 | 
| +    nodeBind(el3).bind('checked', new PathObserver(model, 'val3'));
 | 
|  
 | 
|      var el4 = new InputElement();
 | 
|      form2.append(el4);
 | 
|      el4.type = 'radio';
 | 
|      el4.name = RADIO_GROUP_NAME;
 | 
| -    nodeBind(el4).bind('checked', model, 'val4');
 | 
| -
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(el1.checked, true);
 | 
| -    expect(el2.checked, false);
 | 
| -    expect(el3.checked, false);
 | 
| -    expect(el4.checked, true);
 | 
| -
 | 
| -    el2.checked = true;
 | 
| -    dispatchEvent('change', el2);
 | 
| -    expect(model['val1'], false);
 | 
| -    expect(model['val2'], true);
 | 
| -
 | 
| -    // Radio buttons in form2 should be unaffected
 | 
| -    expect(model['val3'], false);
 | 
| -    expect(model['val4'], true);
 | 
| -
 | 
| -    el3.checked = true;
 | 
| -    dispatchEvent('change', el3);
 | 
| -    expect(model['val3'], true);
 | 
| -    expect(model['val4'], false);
 | 
| -
 | 
| -    // Radio buttons in form1 should be unaffected
 | 
| -    expect(model['val1'], false);
 | 
| -    expect(model['val2'], true);
 | 
| +    nodeBind(el4).bind('checked', new PathObserver(model, 'val4'));
 | 
| +
 | 
| +    return new Future(() {
 | 
| +      expect(el1.checked, true);
 | 
| +      expect(el2.checked, false);
 | 
| +      expect(el3.checked, false);
 | 
| +      expect(el4.checked, true);
 | 
| +
 | 
| +      el2.checked = true;
 | 
| +      dispatchEvent('change', el2);
 | 
| +      expect(model['val1'], false);
 | 
| +      expect(model['val2'], true);
 | 
| +
 | 
| +      // Radio buttons in form2 should be unaffected
 | 
| +      expect(model['val3'], false);
 | 
| +      expect(model['val4'], true);
 | 
| +
 | 
| +      el3.checked = true;
 | 
| +      dispatchEvent('change', el3);
 | 
| +      expect(model['val3'], true);
 | 
| +      expect(model['val4'], false);
 | 
| +
 | 
| +      // Radio buttons in form1 should be unaffected
 | 
| +      expect(model['val1'], false);
 | 
| +      expect(model['val2'], true);
 | 
| +    });
 | 
|    }
 | 
|  
 | 
| -  observeTest('(Radio)Input.checked - multiple forms', () {
 | 
| -    radioInputCheckedMultipleForms(testDiv);
 | 
| +  test('Radio Input.checked - multiple forms', () {
 | 
| +    return radioInputCheckedMultipleForms(testDiv);
 | 
|    });
 | 
|  
 | 
| -  observeTest('(Radio)Input.checked 2 - ShadowRoot', () {
 | 
| -    if (!ShadowRoot.supported) return;
 | 
| +  test('Radio Input.checked - multiple forms - ShadowRoot', () {
 | 
| +    if (!ShadowRoot.supported) return null;
 | 
|  
 | 
|      var shadowRoot = new DivElement().createShadowRoot();
 | 
| -    radioInputChecked2(shadowRoot);
 | 
| -    unbindAll(shadowRoot);
 | 
| +    return radioInputCheckedMultipleForms(shadowRoot)
 | 
| +        .whenComplete(() => unbindAll(shadowRoot));
 | 
|    });
 | 
|  
 | 
| -  observeTest('Select.selectedIndex', () {
 | 
| +  test('Select.selectedIndex', () {
 | 
|      var select = new SelectElement();
 | 
|      testDiv.append(select);
 | 
|      var option0 = select.append(new OptionElement());
 | 
| @@ -561,16 +623,28 @@ formBindings() {
 | 
|  
 | 
|      var model = toObservable({'val': 2});
 | 
|  
 | 
| -    nodeBind(select).bind('selectedIndex', model, 'val');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(select.selectedIndex, 2);
 | 
| +    nodeBind(select).bind('selectedIndex', new PathObserver(model, 'val'));
 | 
| +    return new Future(() {
 | 
| +      expect(select.selectedIndex, 2);
 | 
| +
 | 
| +      select.selectedIndex = 1;
 | 
| +      dispatchEvent('change', select);
 | 
| +      expect(model['val'], 1);
 | 
| +    });
 | 
| +  });
 | 
| +
 | 
| +  test('Select.selectedIndex - oneTime', () {
 | 
| +    var select = new SelectElement();
 | 
| +    testDiv.append(select);
 | 
| +    var option0 = select.append(new OptionElement());
 | 
| +    var option1 = select.append(new OptionElement());
 | 
| +    var option2 = select.append(new OptionElement());
 | 
|  
 | 
| -    select.selectedIndex = 1;
 | 
| -    dispatchEvent('change', select);
 | 
| -    expect(model['val'], 1);
 | 
| +    nodeBind(select).bind('selectedIndex', 2, oneTime: true);
 | 
| +    return new Future(() => expect(select.selectedIndex, 2));
 | 
|    });
 | 
|  
 | 
| -  observeTest('Select.selectedIndex - path NaN', () {
 | 
| +  test('Select.selectedIndex - invalid path', () {
 | 
|      var select = new SelectElement();
 | 
|      testDiv.append(select);
 | 
|      var option0 = select.append(new OptionElement());
 | 
| @@ -580,12 +654,11 @@ formBindings() {
 | 
|  
 | 
|      var model = toObservable({'val': 'foo'});
 | 
|  
 | 
| -    nodeBind(select).bind('selectedIndex', model, 'val');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(select.selectedIndex, 0);
 | 
| +    nodeBind(select).bind('selectedIndex', new PathObserver(model, 'val'));
 | 
| +    return new Future(() => expect(select.selectedIndex, 0));
 | 
|    });
 | 
|  
 | 
| -  observeTest('Select.selectedIndex - path unreachable', () {
 | 
| +  test('Select.selectedIndex - path unreachable', () {
 | 
|      var select = new SelectElement();
 | 
|      testDiv.append(select);
 | 
|      var option0 = select.append(new OptionElement());
 | 
| @@ -595,24 +668,28 @@ formBindings() {
 | 
|  
 | 
|      var model = toObservable({});
 | 
|  
 | 
| -    nodeBind(select).bind('selectedIndex', model, 'val');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(select.selectedIndex, 0);
 | 
| +    nodeBind(select).bind('selectedIndex', new PathObserver(model, 'val'));
 | 
| +    return new Future(() => expect(select.selectedIndex, 0));
 | 
|    });
 | 
|  
 | 
| -  observeTest('Option.value', () {
 | 
| +  test('Option.value', () {
 | 
|      var option = testDiv.append(new OptionElement());
 | 
|      var model = toObservable({'x': 42});
 | 
| -    nodeBind(option).bind('value', model, 'x');
 | 
| +    nodeBind(option).bind('value', new PathObserver(model, 'x'));
 | 
|      expect(option.value, '42');
 | 
|  
 | 
|      model['x'] = 'Hi';
 | 
|      expect(option.value, '42');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(option.value, 'Hi');
 | 
| +    return new Future(() => expect(option.value, 'Hi'));
 | 
| +  });
 | 
| +
 | 
| +  test('Option.value - oneTime', () {
 | 
| +    var option = testDiv.append(new OptionElement());
 | 
| +    nodeBind(option).bind('value', 42, oneTime: true);
 | 
| +    expect(option.value, '42');
 | 
|    });
 | 
|  
 | 
| -  observeTest('Select.value', () {
 | 
| +  test('Select.value', () {
 | 
|      var select = testDiv.append(new SelectElement());
 | 
|      testDiv.append(select);
 | 
|      var option0 = select.append(new OptionElement());
 | 
| @@ -626,25 +703,26 @@ formBindings() {
 | 
|        'selected': 'b'
 | 
|      });
 | 
|  
 | 
| -    nodeBind(option0).bind('value', model, 'opt0');
 | 
| -    nodeBind(option1).bind('value', model, 'opt1');
 | 
| -    nodeBind(option2).bind('value', model, 'opt2');
 | 
| +    nodeBind(option0).bind('value', new PathObserver(model, 'opt0'));
 | 
| +    nodeBind(option1).bind('value', new PathObserver(model, 'opt1'));
 | 
| +    nodeBind(option2).bind('value', new PathObserver(model, 'opt2'));
 | 
|  
 | 
| -    nodeBind(select).bind('value', model, 'selected');
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(select.value, 'b');
 | 
| +    nodeBind(select).bind('value', new PathObserver(model, 'selected'));
 | 
| +    return new Future(() {
 | 
| +      expect(select.value, 'b');
 | 
|  
 | 
| -    select.value = 'c';
 | 
| -    dispatchEvent('change', select);
 | 
| -    expect(model['selected'], 'c');
 | 
| +      select.value = 'c';
 | 
| +      dispatchEvent('change', select);
 | 
| +      expect(model['selected'], 'c');
 | 
|  
 | 
| -    model['opt2'] = 'X';
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(select.value, 'X');
 | 
| -    expect(model['selected'], 'X');
 | 
| +      model['opt2'] = 'X';
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(select.value, 'X');
 | 
| +      expect(model['selected'], 'X');
 | 
|  
 | 
| -    model['selected'] = 'a';
 | 
| -    performMicrotaskCheckpoint();
 | 
| -    expect(select.value, 'a');
 | 
| +      model['selected'] = 'a';
 | 
| +    }).then(endOfMicrotask).then((_) {
 | 
| +      expect(select.value, 'a');
 | 
| +    });
 | 
|    });
 | 
|  }
 | 
| 
 |