implement dirty checking for @observable objects

pkg/mdv/test/binding_syntax_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 binding_syntax_test;
 
 import 'dart:async';
 import 'dart:collection';
 import 'dart:html';
 import 'package:mdv/mdv.dart' as mdv;
 import 'package:observe/observe.dart';
 import 'package:unittest/html_config.dart';
 import 'package:unittest/unittest.dart';
-import 'observe_utils.dart';
+import 'mdv_test_utils.dart';
 
 // Note: this file ported from
 // https://github.com/toolkitchen/mdv/blob/master/tests/syntax.js
 
 main() {
   mdv.initialize();
   useHtmlConfiguration();
-  group('Syntax', syntaxTests);
+
+  group('Syntax FooBarModel', () {
+    syntaxTests(([f, b]) => new FooBarModel(f, b));
+  });
+  group('Syntax FooBarNotifyModel', () {
+    syntaxTests(([f, b]) => new FooBarNotifyModel(f, b));
+  });
 }
 
-syntaxTests() {
+syntaxTests(FooBarModel fooModel([foo, bar])) {
   var testDiv;
 
   setUp(() {
     document.body.append(testDiv = new DivElement());
   });
 
   tearDown(() {
     testDiv.remove();
     testDiv = null;
   });
 
   createTestHtml(s) {
     var div = new DivElement();
     div.innerHtml = s;
     testDiv.append(div);
 
     for (var node in div.queryAll('*')) {
       if (node.isTemplate) TemplateElement.decorate(node);
     }
 
     return div;
   }
 
   recursivelySetTemplateModel(element, model) {
     for (var node in element.queryAll('*')) {
       if (node.isTemplate) node.model = model;
     }
   }
 
-  test('Registration', () {
-    var model = toSymbolMap({'foo': 'bar'});
+  observeTest('Registration', () {
+    var model = fooModel('bar');
 
     var testSyntax = new TestBindingSyntax();
     TemplateElement.syntax['Test'] = testSyntax;
     try {
       var div = createTestHtml(
           '<template bind syntax="Test">{{ foo }}' +
           '<template bind>{{ foo }}</template></template>');
       recursivelySetTemplateModel(div, model);
-      deliverChangeRecords();
+      performMicrotaskCheckpoint();
       expect(div.nodes.length, 4);
       expect(div.nodes.last.text, 'bar');
       expect(div.nodes[2].tagName, 'TEMPLATE');
       expect(div.nodes[2].attributes['syntax'], 'Test');
 
       expect(testSyntax.log, [
         [model, '', 'bind', 'TEMPLATE'],
         [model, 'foo', 'text', null],
         [model, '', 'bind', 'TEMPLATE'],
         [model, 'foo', 'text', null],
       ]);
     } finally {
       TemplateElement.syntax.remove('Test');
     }
   });
 
-  test('getInstanceModel', () {
-    var model = toObservable([{'foo': 1}, {'foo': 2}, {'foo': 3}]
-        .map(toSymbolMap));
+  observeTest('getInstanceModel', () {
+    var model = toObservable([fooModel(1), fooModel(2), fooModel(3)]);
 
     var testSyntax = new TestModelSyntax();
-    testSyntax.altModels.addAll([{'foo': 'a'}, {'foo': 'b'}, {'foo': 'c'}]
-        .map(toSymbolMap));
+    testSyntax.altModels.addAll([fooModel('a'), fooModel('b'), fooModel('c')]);
 
     TemplateElement.syntax['Test'] = testSyntax;
     try {
 
       var div = createTestHtml(
           '<template repeat syntax="Test">' +
           '{{ foo }}</template>');
 
       var template = div.nodes[0];
       recursivelySetTemplateModel(div, model);
-      deliverChangeRecords();
+      performMicrotaskCheckpoint();
 
       expect(div.nodes.length, 4);
       expect(div.nodes[0].tagName, 'TEMPLATE');
       expect(div.nodes[1].text, 'a');
       expect(div.nodes[2].text, 'b');
       expect(div.nodes[3].text, 'c');
 
       expect(testSyntax.log, [
         [template, model[0]],
         [template, model[1]],
         [template, model[2]],
       ]);
 
     } finally {
       TemplateElement.syntax.remove('Test');
     }
   });
 
-  test('Basic', () {
-    var model = toSymbolMap({'foo': 2, 'bar': 4});
+  observeTest('Basic', () {
+    var model = fooModel(2, 4);
 
     TemplateElement.syntax['2x'] = new TimesTwoSyntax();
 
     var div = createTestHtml(
         '<template bind syntax="2x">'
         '{{ foo }} + {{ 2x: bar }} + {{ 4x: bar }}</template>');
     recursivelySetTemplateModel(div, model);
-    deliverChangeRecords();
+    performMicrotaskCheckpoint();
     expect(div.nodes.length, 2);
     expect(div.nodes.last.text, '2 + 8 + ');
 
-    model[const Symbol('foo')] = 4;
-    model[const Symbol('bar')] = 8;
-    deliverChangeRecords();
+    model.foo = 4;
+    model.bar = 8;
+    performMicrotaskCheckpoint();
     expect(div.nodes.last.text, '4 + 16 + ');
 
     TemplateElement.syntax.remove('2x');
   });
 
-  test('Different Sub-Template Syntax', () {
-    var model = toSymbolMap({'foo': 'bar'});
+  observeTest('Different Sub-Template Syntax', () {
+    var model = fooModel('bar');
 
     TemplateElement.syntax['Test'] = new TestBindingSyntax();
     TemplateElement.syntax['Test2'] = new TestBindingSyntax();
 
     var div = createTestHtml(
         '<template bind syntax="Test">{{ foo }}'
         '<template bind syntax="Test2">{{ foo }}</template></template>');
     recursivelySetTemplateModel(div, model);
-    deliverChangeRecords();
+    performMicrotaskCheckpoint();
     expect(div.nodes.length, 4);
     expect(div.nodes.last.text, 'bar');
     expect(div.nodes[2].tagName, 'TEMPLATE');
     expect(div.nodes[2].attributes['syntax'], 'Test2');
 
     var testLog = TemplateElement.syntax['Test'].log;
     var test2Log = TemplateElement.syntax['Test2'].log;
 
     expect(testLog, [
       [model, '', 'bind', 'TEMPLATE'],
@@ skipping 53 matching lines @@
       }
     }
 
     for (var node in toRemove) node.remove();
     removed += toRemove.length;
 
     return instance;
   }
 }
 
-
 class TimesTwoSyntax extends CustomBindingSyntax {
   getBinding(model, path, name, node) {
     path = path.trim();
     if (!path.startsWith('2x:')) return null;
 
     path = path.substring(3);
     return new CompoundBinding((values) => values['value'] * 2)
         ..bind('value', model, path);
   }
 }