Version 1.5.0-dev.4.14

dart/pkg/template_binding/test/node_bind_test.dart

Index: dart/pkg/template_binding/test/node_bind_test.dart
===================================================================
--- dart/pkg/template_binding/test/node_bind_test.dart	(revision 37358)
+++ dart/pkg/template_binding/test/node_bind_test.dart	(working copy)
@@ -9,25 +9,30 @@
 
 import 'package:observe/observe.dart'
     show toObservable, PathObserver, PropertyPath;
-import 'package:template_binding/template_binding.dart' show nodeBind;
+import 'package:template_binding/template_binding.dart'
+    show nodeBind, enableBindingsReflection;
 
 import 'package:unittest/html_config.dart';
 import 'package:unittest/unittest.dart';
 import 'utils.dart';
 
-// Note: this file ported from
-// https://github.com/toolkitchen/mdv/blob/master/tests/node_bindings.js
+// Ported from: https://github.com/Polymer/NodeBind/blob/master/tests/tests.js
 
+var bindings;
+
 main() => dirtyCheckZone().run(() {
   useHtmlConfiguration();
 
   setUp(() {
     document.body.append(testDiv = new DivElement());
+    bindings = [];
   });
 
   tearDown(() {
     testDiv.remove();
     testDiv = null;
+    for (var b in bindings) if (b != null) b.close();
+    bindings = null;
   });
 
   group('Text bindings', testBindings);
@@ -39,31 +44,25 @@
   test('Basic', () {
     var text = new Text('hi');
     var model = toObservable({'a': 1});
-    nodeBind(text).bind('text', new PathObserver(model, 'a'));
+    bindings.add(nodeBind(text).bind('text', new PathObserver(model, 'a')));
     expect(text.text, '1');
 
     model['a'] = 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');
     });
   });
 
   test('oneTime', () {
     var text = new Text('hi');
-    nodeBind(text).bind('text', 1, oneTime: true);
+    bindings.add(nodeBind(text).bind('text', 1, oneTime: true));
     expect(text.text, '1');
   });
 
   test('No Path', () {
     var text = new Text('hi');
     var model = 1;
-    nodeBind(text).bind('text', new PathObserver(model));
+    bindings.add(nodeBind(text).bind('text', new PathObserver(model)));
     expect(text.text, '1');
   });
 
@@ -76,28 +75,37 @@
   });
 
   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);
-    expect(text.text, '1');
+    // Dart note: we don't have _allObserversCount so we use binding reflection
+    // instead.
+    enableBindingsReflection = true;
 
-    var binding = nodeBind(text).bindings['text'];
-    expect(binding, observer, reason: 'should reuse observer');
+    // This future is here so we can turn off bindings reflection reliably.
+    Text text;
+    return new Future(() {
+      text = new Text('');
+      var model = toObservable({'a': {'b': {'c': 1}}});
+      var observer = new PathObserver(model, 'a.b.c');
+      bindings.add(nodeBind(text).bind('text', observer));
+      expect(text.text, '1');
 
-    model['a']['b']['c'] = 2;
-    return new Future(() {
+      var binding = nodeBind(text).bindings['text'];
+      expect(binding, observer, reason: 'should reuse observer');
+
+      model['a']['b']['c'] = 2;
+    }).then(endOfMicrotask).then((_) {
       expect(text.text, '2');
-      nodeBind(text).unbind('text');
+    }).whenComplete(() {
+      enableBindingsReflection = false;
     });
   });
 }
 
 elementBindings() {
+
   test('Basic', () {
     var el = new DivElement();
     var model = toObservable({'a': '1'});
-    nodeBind(el).bind('foo', new PathObserver(model, 'a'));
+    bindings.add(nodeBind(el).bind('foo', new PathObserver(model, 'a')));
 
     return new Future(() {
       expect(el.attributes['foo'], '1');
@@ -116,17 +124,45 @@
     });
   });
 
+  // Dart specific test
+  test('enableBindingsReflection defaults to off', () {
+    expect(enableBindingsReflection, false);
+
+    var el = new DivElement();
+    var model = toObservable({'a': '1'});
+    bindings.add(nodeBind(el).bind('foo', new PathObserver(model, 'a')));
+
+    expect(nodeBind(el).bindings, null);
+  });
+
+  test('enableBindingsReflection', () {
+    enableBindingsReflection = true;
+    try {
+      var el = testDiv.append(new DivElement());
+      var model = toObservable({'a': '1'});
+      bindings.add(nodeBind(el).bind('foo', new PathObserver(model, 'a')));
+      bindings.add(nodeBind(el).bind('bar', new PathObserver(model, 'a')));
+      bindings.add(nodeBind(el).bind('baz', new PathObserver(model, 'a')));
+
+      expect(nodeBind(el).bindings.keys,
+          unorderedEquals(['foo', 'bar', 'baz']));
+
+    } finally {
+      enableBindingsReflection = false;
+    }
+  });
+
   test('oneTime', () {
     var el = testDiv.append(new DivElement());
     var model = toObservable({'a': '1'});
-    nodeBind(el).bind('foo', 1, oneTime: true);
+    bindings.add(nodeBind(el).bind('foo', 1, oneTime: true));
     expect('1', el.attributes['foo']);
   });
 
   test('No Path', () {
     var el = testDiv.append(new DivElement());
     var model = 1;
-    nodeBind(el).bind('foo', new PathObserver(model));
+    bindings.add(nodeBind(el).bind('foo', new PathObserver(model)));
     return new Future(() {
       expect(el.attributes['foo'], '1');
     });
@@ -135,7 +171,7 @@
   test('Path unreachable', () {
     var el = testDiv.append(new DivElement());
     var model = toObservable({});
-    nodeBind(el).bind('foo', new PathObserver(model, 'bar'));
+    bindings.add(nodeBind(el).bind('foo', new PathObserver(model, 'bar')));
     return new Future(() {
       expect(el.attributes['foo'], '');
     });
@@ -144,7 +180,7 @@
   test('Dashes', () {
     var el = testDiv.append(new DivElement());
     var model = toObservable({'a': '1'});
-    nodeBind(el).bind('foo-bar', new PathObserver(model, 'a'));
+    bindings.add(nodeBind(el).bind('foo-bar', new PathObserver(model, 'a')));
     return new Future(() {
       expect(el.attributes['foo-bar'], '1');
       model['a'] = '2';
@@ -157,8 +193,9 @@
   test('Element.id, Element.hidden?', () {
     var element = new DivElement();
     var model = toObservable({'a': 1, 'b': 2});
-    nodeBind(element).bind('hidden?', new PathObserver(model, 'a'));
-    nodeBind(element).bind('id', new PathObserver(model, 'b'));
+    bindings.add(
+        nodeBind(element).bind('hidden?', new PathObserver(model, 'a')));
+    bindings.add(nodeBind(element).bind('id', new PathObserver(model, 'b')));
 
     expect(element.attributes, contains('hidden'));
     expect(element.attributes['hidden'], '');
@@ -185,7 +222,7 @@
   test('Element.id - path unreachable', () {
     var element = testDiv.append(new DivElement());
     var model = toObservable({});
-    nodeBind(element).bind('id', new PathObserver(model, 'a'));
+    bindings.add(nodeBind(element).bind('id', new PathObserver(model, 'a')));
     return new Future(() => expect(element.id, ''));
   });
 }
@@ -195,7 +232,7 @@
     var el = new Element.tag(tagName);
     testDiv.nodes.add(el);
     var model = toObservable({'x': 42});
-    nodeBind(el).bind('value', new PathObserver(model, 'x'));
+    bindings.add(nodeBind(el).bind('value', new PathObserver(model, 'x')));
     expect(el.value, '42');
 
     model['x'] = 'Hi';
@@ -206,37 +243,26 @@
       el.value = 'changed';
       dispatchEvent('input', el);
       expect(model['x'], 'changed');
-
-      nodeBind(el).unbind('value');
-
-      el.value = 'changed again';
-      dispatchEvent('input', el);
-      expect(model['x'], 'changed');
-
-      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);
+    bindings.add(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', new PathObserver(model));
+    bindings.add(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', new PathObserver(model, 'a'));
+    bindings.add(nodeBind(el).bind('value', new PathObserver(model, 'a')));
     expect(el.value, '');
   }
 
@@ -268,7 +294,7 @@
     var input = new InputElement();
     input.type = 'radio';
     var model = toObservable({'x': true});
-    nodeBind(input).bind('checked', new PathObserver(model, 'x'));
+    bindings.add(nodeBind(input).bind('checked', new PathObserver(model, 'x')));
     expect(input.checked, true);
 
     model['x'] = false;
@@ -280,7 +306,7 @@
       dispatchEvent('change', input);
       expect(model['x'], true, reason: 'input.checked should set model');
 
-      nodeBind(input).unbind('checked');
+      bindings[0].close();
 
       input.checked = false;
       dispatchEvent('change', input);
@@ -292,44 +318,25 @@
   test('Input.value - user value rejected', () {
     var model = toObservable({'val': 'ping'});
 
+    var rejector = new PathObserver(model, 'val');
+    rejector.open(() {
+      model['val'] = 'ping';
+    });
+
     var el = new InputElement();
-    nodeBind(el).bind('value', new PathObserver(model, 'val'));
+    bindings.add(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((_) {
+      // rejector will have set the bound value back to 'ping'.
       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);
+      rejector.close();
     });
   });
 
@@ -338,7 +345,7 @@
     el.type = 'checkbox';
 
     var model = toObservable({'x': true});
-    nodeBind(el).bind('checked', new PathObserver(model, 'x'));
+    bindings.add(nodeBind(el).bind('checked', new PathObserver(model, 'x')));
     expect(el.checked, true);
 
     model['x'] = false;
@@ -358,7 +365,7 @@
   test('Checkbox Input.checked - oneTime', () {
     var input = testDiv.append(new InputElement());
     input.type = 'checkbox';
-    nodeBind(input).bind('checked', true, oneTime: true);
+    bindings.add(nodeBind(input).bind('checked', true, oneTime: true));
     expect(input.checked, true, reason: 'checked was set');
   });
 
@@ -366,7 +373,7 @@
     var input = testDiv.append(new InputElement());
     input.type = 'checkbox';
     var model = toObservable({});
-    nodeBind(input).bind('checked', new PathObserver(model, 'x'));
+    bindings.add(nodeBind(input).bind('checked', new PathObserver(model, 'x')));
     expect(input.checked, false);
   });
 
@@ -375,7 +382,7 @@
 
     var el = testDiv.append(new InputElement());
     el.type = 'checkbox';
-    nodeBind(el).bind('checked', new PathObserver(model, 'val'));
+    bindings.add(nodeBind(el).bind('checked', new PathObserver(model, 'val')));
     return new Future(() {
       expect(el.checked, true);
 
@@ -406,7 +413,7 @@
     var el = new InputElement();
     testDiv.append(el);
     el.type = 'checkbox';
-    nodeBind(el).bind('checked', new PathObserver(model, 'val'));
+    bindings.add(nodeBind(el).bind('checked', new PathObserver(model, 'val')));
     return new Future(() {
       expect(el.checked, true);
 
@@ -428,7 +435,7 @@
     var el = new InputElement();
     testDiv.append(el);
     el.type = 'checkbox';
-    nodeBind(el).bind('checked', new PathObserver(model, 'val'));
+    bindings.add(nodeBind(el).bind('checked', new PathObserver(model, 'val')));
     return new Future(() {
       expect(el.checked, true);
 
@@ -448,7 +455,7 @@
     var input = testDiv.append(new InputElement());
     input.type = 'radio';
     var model = toObservable({'x': true});
-    nodeBind(input).bind('checked', new PathObserver(model, 'x'));
+    bindings.add(nodeBind(input).bind('checked', new PathObserver(model, 'x')));
     expect(input.checked, true);
 
     model['x'] = false;
@@ -459,19 +466,13 @@
       input.checked = true;
       dispatchEvent('change', input);
       expect(model['x'], true);
-
-      nodeBind(input).unbind('checked');
-
-      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);
+    bindings.add(nodeBind(input).bind('checked', true, oneTime: true));
     expect(input.checked, true, reason: 'checked was set');
   });
 
@@ -485,22 +486,26 @@
     var el1 = container.append(new InputElement());
     el1.type = 'radio';
     el1.name = RADIO_GROUP_NAME;
-    nodeBind(el1).bind('checked', new PathObserver(model, 'val1'));
+    bindings.add(
+        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', new PathObserver(model, 'val2'));
+    bindings.add(
+        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', new PathObserver(model, 'val3'));
+    bindings.add(
+        nodeBind(el3).bind('checked', new PathObserver(model, 'val3')));
 
     var el4 = container.append(new InputElement());
     el4.type = 'radio';
     el4.name = 'othergroup';
-    nodeBind(el4).bind('checked', new PathObserver(model, 'val4'));
+    bindings.add(
+        nodeBind(el4).bind('checked', new PathObserver(model, 'val4')));
 
     return new Future(() {
       expect(el1.checked, true);
@@ -538,8 +543,7 @@
     if (!ShadowRoot.supported) return null;
 
     var shadowRoot = new DivElement().createShadowRoot();
-    return radioInputChecked2(shadowRoot)
-        .whenComplete(() => unbindAll(shadowRoot));
+    return radioInputChecked2(shadowRoot);
   });
 
   radioInputCheckedMultipleForms(host) {
@@ -557,25 +561,29 @@
     form1.append(el1);
     el1.type = 'radio';
     el1.name = RADIO_GROUP_NAME;
-    nodeBind(el1).bind('checked', new PathObserver(model, 'val1'));
+    bindings.add(
+        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', new PathObserver(model, 'val2'));
+    bindings.add(
+        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', new PathObserver(model, 'val3'));
+    bindings.add(
+        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', new PathObserver(model, 'val4'));
+    bindings.add(
+        nodeBind(el4).bind('checked', new PathObserver(model, 'val4')));
 
     return new Future(() {
       expect(el1.checked, true);
@@ -611,8 +619,7 @@
     if (!ShadowRoot.supported) return null;
 
     var shadowRoot = new DivElement().createShadowRoot();
-    return radioInputCheckedMultipleForms(shadowRoot)
-        .whenComplete(() => unbindAll(shadowRoot));
+    return radioInputCheckedMultipleForms(shadowRoot);
   });
 
   test('Select.selectedIndex', () {
@@ -624,7 +631,8 @@
 
     var model = toObservable({'val': 2});
 
-    nodeBind(select).bind('selectedIndex', new PathObserver(model, 'val'));
+    bindings.add(
+        nodeBind(select).bind('selectedIndex', new PathObserver(model, 'val')));
     return new Future(() {
       expect(select.selectedIndex, 2);
 
@@ -641,7 +649,7 @@
     var option1 = select.append(new OptionElement());
     var option2 = select.append(new OptionElement());
 
-    nodeBind(select).bind('selectedIndex', 2, oneTime: true);
+    bindings.add(nodeBind(select).bind('selectedIndex', 2, oneTime: true));
     return new Future(() => expect(select.selectedIndex, 2));
   });
 
@@ -655,7 +663,8 @@
 
     var model = toObservable({'val': 'foo'});
 
-    nodeBind(select).bind('selectedIndex', new PathObserver(model, 'val'));
+    bindings.add(
+        nodeBind(select).bind('selectedIndex', new PathObserver(model, 'val')));
     return new Future(() => expect(select.selectedIndex, 0));
   });
 
@@ -669,14 +678,15 @@
 
     var model = toObservable({});
 
-    nodeBind(select).bind('selectedIndex', new PathObserver(model, 'val'));
+    bindings.add(
+        nodeBind(select).bind('selectedIndex', new PathObserver(model, 'val')));
     return new Future(() => expect(select.selectedIndex, 0));
   });
 
   test('Option.value', () {
     var option = testDiv.append(new OptionElement());
     var model = toObservable({'x': 42});
-    nodeBind(option).bind('value', new PathObserver(model, 'x'));
+    bindings.add(nodeBind(option).bind('value', new PathObserver(model, 'x')));
     expect(option.value, '42');
 
     model['x'] = 'Hi';
@@ -686,7 +696,7 @@
 
   test('Option.value - oneTime', () {
     var option = testDiv.append(new OptionElement());
-    nodeBind(option).bind('value', 42, oneTime: true);
+    bindings.add(nodeBind(option).bind('value', 42, oneTime: true));
     expect(option.value, '42');
   });
 
@@ -704,11 +714,14 @@
       'selected': 'b'
     });
 
-    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', new PathObserver(model, 'selected'));
+    bindings.add(
+        nodeBind(option0).bind('value', new PathObserver(model, 'opt0')));
+    bindings.add(
+        nodeBind(option1).bind('value', new PathObserver(model, 'opt1')));
+    bindings.add(
+        nodeBind(option2).bind('value', new PathObserver(model, 'opt2')));
+    bindings.add(
+        nodeBind(select).bind('value', new PathObserver(model, 'selected')));
     return new Future(() {
       expect(select.value, 'b');