| 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');
|
| + });
|
| });
|
| }
|
|
|