feat(change_detection): added changeDetection to Component

modules/angular2/change_detection.js

@@ -5,9 +5,9 @@ export {Locals}
   from './src/change_detection/parser/locals';
 export {ExpressionChangedAfterItHasBeenChecked, ChangeDetectionError}
     from './src/change_detection/exceptions';
-export {ChangeRecord, ChangeDispatcher, ChangeDetector,
+export {ProtoChangeDetector, ChangeRecord, ChangeDispatcher, ChangeDetector, ChangeDetection} from './src/change_detection/interfaces';
-    CHECK_ONCE, CHECK_ALWAYS, DETACHED, CHECKED} from './src/change_detection/interfaces';
+export {CHECK_ONCE, CHECK_ALWAYS, DETACHED, CHECKED, ON_PUSH, DEFAULT} from './src/change_detection/constants';
-export {ProtoChangeDetector, DynamicProtoChangeDetector, JitProtoChangeDetector, BindingRecord}
+export {DynamicProtoChangeDetector, JitProtoChangeDetector, BindingRecord}
     from './src/change_detection/proto_change_detector';
 export {DynamicChangeDetector}
     from './src/change_detection/dynamic_change_detector';
@@ -17,19 +17,14 @@ export * from './src/change_detection/pipes/pipe_registry';
 export {uninitialized} from './src/change_detection/change_detection_util';
 export * from './src/change_detection/pipes/pipe';
 
-import {ProtoChangeDetector, DynamicProtoChangeDetector, JitProtoChangeDetector}
+import {DynamicProtoChangeDetector, JitProtoChangeDetector}
     from './src/change_detection/proto_change_detector';
 import {PipeRegistry} from './src/change_detection/pipes/pipe_registry';
 import {IterableChangesFactory} from './src/change_detection/pipes/iterable_changes';
 import {KeyValueChangesFactory} from './src/change_detection/pipes/keyvalue_changes';
 import {NullPipeFactory} from './src/change_detection/pipes/null_pipe';
-
+import {DEFAULT} from './src/change_detection/constants';
-export class ChangeDetection {
+import {ChangeDetection, ProtoChangeDetector} from './src/change_detection/interfaces';
-  createProtoChangeDetector(name:string):ProtoChangeDetector{
-    // TODO: this should be abstract, once supported in AtScript
-    return null;
-  }
-}
 
 export var defaultPipes = {
   "iterableDiff" : [
@@ -50,8 +45,8 @@ export class DynamicChangeDetection extends ChangeDetection {
     this.registry = registry;
   }
 
-  createProtoChangeDetector(name:string):ProtoChangeDetector{
+  createProtoChangeDetector(name:string, changeControlStrategy:string = DEFAULT):ProtoChangeDetector{
-    return new DynamicProtoChangeDetector(this.registry);
+    return new DynamicProtoChangeDetector(this.registry, changeControlStrategy);
   }
 }
 
@@ -63,8 +58,8 @@ export class JitChangeDetection extends ChangeDetection {
     this.registry = registry;
   }
 
-  createProtoChangeDetector(name:string):ProtoChangeDetector{
+  createProtoChangeDetector(name:string, changeControlStrategy:string = DEFAULT):ProtoChangeDetector{
-    return new JitProtoChangeDetector(this.registry);
+    return new JitProtoChangeDetector(this.registry, changeControlStrategy);
   }
 }
 

modules/angular2/src/change_detection/abstract_change_detector.js

@@ -1,7 +1,8 @@
 import {isPresent} from 'angular2/src/facade/lang';
 import {List, ListWrapper} from 'angular2/src/facade/collection';
 import {BindingPropagationConfig} from './binding_propagation_config';
-import {ChangeDetector, CHECK_ALWAYS, CHECK_ONCE, CHECKED, DETACHED} from './interfaces';
+import {ChangeDetector} from './interfaces';
+import {CHECK_ALWAYS, CHECK_ONCE, CHECKED, DETACHED, ON_PUSH} from './constants';
 
 export class AbstractChangeDetector extends ChangeDetector {
   lightDomChildren:List;
@@ -15,7 +16,7 @@ export class AbstractChangeDetector extends ChangeDetector {
     this.lightDomChildren = [];
     this.shadowDomChildren = [];
     this.bindingPropagationConfig = new BindingPropagationConfig(this);
-    this.mode = CHECK_ALWAYS;
+    this.mode = null;
   }
 
   addChild(cd:ChangeDetector) {

modules/angular2/src/change_detection/binding_propagation_config.js

@@ -1,4 +1,5 @@
-import {ChangeDetector, CHECK_ONCE, DETACHED, CHECK_ALWAYS} from './interfaces';
+import {ChangeDetector} from './interfaces';
+import {CHECK_ONCE, DETACHED, CHECK_ALWAYS} from './constants';
 
 /**
  * @publicModule angular2/angular2

modules/angular2/src/change_detection/change_detection_jit_generator.dart

@@ -1,7 +1,7 @@
 library change_detectoin.change_detection_jit_generator;
 
 class ChangeDetectorJITGenerator {
-  ChangeDetectorJITGenerator(typeName, records, directiveMementos) {
+  ChangeDetectorJITGenerator(typeName, strategy,  records, directiveMementos) {
   }
 
   generate() {

modules/angular2/src/change_detection/change_detection_jit_generator.es6

@@ -24,74 +24,10 @@ import {
  * that "emulates" what the developer would write by hand to implement the same
  * kind of behaviour.
  *
- * For example: An expression `address.city` will result in the following class:
- *
- * var ChangeDetector0 = function ChangeDetector0(dispatcher, protos) {
- *   AbstractChangeDetector.call(this);
- *   this.dispatcher = dispatcher;
- *   this.protos = protos;
- *
- *   this.context = ChangeDetectionUtil.unitialized();
- *   this.address0 = ChangeDetectionUtil.unitialized();
- *   this.city1 = ChangeDetectionUtil.unitialized();
- * }
- * ChangeDetector0.prototype = Object.create(AbstractChangeDetector.prototype);
- *
- * ChangeDetector0.prototype.detectChangesInRecords = function(throwOnChange) {
- *   var address0;
- *   var city1;
- *   var change;
- *   var changes = null;
- *   var temp;
- *   var context = this.context;
- *
- *   address0 = context.address;
- *   if (address0 !== this.address0) {
- *     this.address0 = address0;
- *   }
- *
- *   city1 = address0.city;
- *   if (city1 !== this.city1) {
- *     changes = ChangeDetectionUtil.addRecord(changes,
- *       ChangeDetectionUtil.simpleChangeRecord(this.protos[1].bindingMemento, this.city1, city1));
- *     this.city1 = city1;
- *   }
- *
- *   if (changes.length > 0) {
- *     if(throwOnChange) ChangeDetectionUtil.throwOnChange(this.protos[1], changes[0]);
- *     this.dispatcher.onRecordChange('address.city', changes);
- *     changes = null;
- *   }
- * }
- *
- * ChangeDetector0.prototype.callOnAllChangesDone = function() {}
- *
- * ChangeDetector0.prototype.hydrate = function(context, locals) {
- *   this.context = context;
- *   this.locals = locals;
- * }
- *
- * ChangeDetector0.prototype.dehydrate = function(context) {
- *   this.context = ChangeDetectionUtil.unitialized();
- *   this.address0 = ChangeDetectionUtil.unitialized();
- *   this.city1 = ChangeDetectionUtil.unitialized();
- *   this.locals = null;
- * }
- *
- * ChangeDetector0.prototype.hydrated = function() {
- *   return this.context !== ChangeDetectionUtil.unitialized();
- * }
- *
- * return ChangeDetector0;
- *
- *
- * The only thing the generated class depends on is the super class AbstractChangeDetector.
- *
  * The implementation comprises two parts:
  * * ChangeDetectorJITGenerator has the logic of how everything fits together.
  * * template functions (e.g., constructorTemplate) define what code is generated.
 */
-
 var ABSTRACT_CHANGE_DETECTOR = "AbstractChangeDetector";
 var UTIL = "ChangeDetectionUtil";
 var DISPATCHER_ACCESSOR = "this.dispatcher";
@@ -102,6 +38,7 @@ var CONTEXT_ACCESSOR = "this.context";
 var CHANGE_LOCAL = "change";
 var CHANGES_LOCAL = "changes";
 var LOCALS_ACCESSOR = "this.locals";
+var MODE_ACCESSOR = "this.mode";
 var TEMP_LOCAL = "temp";
 
 function typeTemplate(type:string, cons:string, detectChanges:string,
@@ -137,9 +74,10 @@ function pipeOnDestroyTemplate(pipeNames:List) {
   return pipeNames.map((p) => `${p}.onDestroy()`).join("\n");
 }
 
-function hydrateTemplate(type:string, fieldsDefinitions:string, pipeOnDestroy:string):string {
+function hydrateTemplate(type:string, mode:string, fieldsDefinitions:string, pipeOnDestroy:string):string {
   return `
 ${type}.prototype.hydrate = function(context, locals) {
+  ${MODE_ACCESSOR} = "${mode}";
   ${CONTEXT_ACCESSOR} = context;
   ${LOCALS_ACCESSOR} = locals;
 }
@@ -265,13 +203,15 @@ export class ChangeDetectorJITGenerator {
   typeName:string;
   records:List<ProtoRecord>;
   directiveMementos:List;
-  localNames:List<String>;
+  localNames:List<string>;
-  changeNames:List<String>;
+  changeNames:List<string>;
-  fieldNames:List<String>;
+  fieldNames:List<string>;
-  pipeNames:List<String>;
+  pipeNames:List<string>;
+  changeDetectionStrategy:stirng;
 
-  constructor(typeName:string, records:List<ProtoRecord>, directiveMementos:List) {
+  constructor(typeName:string, changeDetectionStrategy:string, records:List<ProtoRecord>, directiveMementos:List) {
     this.typeName = typeName;
+    this.changeDetectionStrategy = changeDetectionStrategy;
     this.records = records;
     this.directiveMementos = directiveMementos;
 
@@ -281,7 +221,7 @@ export class ChangeDetectorJITGenerator {
     this.pipeNames = this.getPipeNames(this.localNames);
   }
 
-  getLocalNames(records:List<ProtoRecord>):List<String> {
+  getLocalNames(records:List<ProtoRecord>):List<string> {
     var index = 0;
     var names = records.map((r) => {
       var sanitizedName = r.name.replace(new RegExp("\\W", "g"), '');
@@ -290,15 +230,15 @@ export class ChangeDetectorJITGenerator {
     return ["context"].concat(names);
   }
 
-  getChangeNames(localNames:List<String>):List<String> {
+  getChangeNames(localNames:List<string>):List<string> {
     return localNames.map((n) => `change_${n}`);
   }
 
-  getFieldNames(localNames:List<String>):List<String> {
+  getFieldNames(localNames:List<string>):List<string> {
     return localNames.map((n) => `this.${n}`);
   }
 
-  getPipeNames(localNames:List<String>):List<String> {
+  getPipeNames(localNames:List<string>):List<string> {
     return localNames.map((n) => `this.${n}_pipe`);
   }
 
@@ -314,7 +254,8 @@ export class ChangeDetectorJITGenerator {
   }
 
   genHydrate():string {
-    return hydrateTemplate(this.typeName, this.genFieldDefinitions(),
+    var mode = ChangeDetectionUtil.changeDetectionMode(this.changeDetectionStrategy);
+    return hydrateTemplate(this.typeName, mode, this.genFieldDefinitions(),
       pipeOnDestroyTemplate(this.getNonNullPipeNames()));
   }
 
@@ -325,7 +266,7 @@ export class ChangeDetectorJITGenerator {
     return fieldDefinitionsTemplate(fields);
   }
 
-  getNonNullPipeNames():List<String> {
+  getNonNullPipeNames():List<string> {
     var pipes = [];
     this.records.forEach((r) => {
       if (r.mode === RECORD_TYPE_PIPE || r.mode === RECORD_TYPE_BINDING_PIPE) {

modules/angular2/src/change_detection/change_detection_util.js

@@ -3,7 +3,8 @@ import {List, ListWrapper, MapWrapper, StringMapWrapper} from 'angular2/src/faca
 import {ProtoRecord} from './proto_record';
 import {ExpressionChangedAfterItHasBeenChecked} from './exceptions';
 import {NO_CHANGE} from './pipes/pipe';
-import {ChangeRecord, ChangeDetector, CHECK_ALWAYS, CHECK_ONCE, CHECKED, DETACHED} from './interfaces';
+import {ChangeRecord, ChangeDetector} from './interfaces';
+import {CHECK_ALWAYS, CHECK_ONCE, CHECKED, DETACHED, ON_PUSH} from './constants';
 
 export var uninitialized = new Object();
 
@@ -163,6 +164,10 @@ export class ChangeDetectionUtil {
     return _changeRecord(memento, _simpleChange(previousValue, currentValue));
   }
 
+  static changeDetectionMode(strategy:string) {
+    return strategy == ON_PUSH ? CHECK_ONCE : CHECK_ALWAYS;
+  }
+
   static addRecord(updatedRecords:List, changeRecord:ChangeRecord):List {
     if (isBlank(updatedRecords)) {
       updatedRecords = _singleElementList;

modules/angular2/src/change_detection/constants.js

@@ -0,0 +1,35 @@
+//TODO:vsavkin Use enums after switching to TypeScript
+
+/**
+ * CHECK_ONCE means that after calling detectChanges the mode of the change detector
+ * will become CHECKED.
+ */
+export const CHECK_ONCE="CHECK_ONCE";
+
+/**
+ * CHECKED means that the change detector should be skipped until its mode changes to
+ * CHECK_ONCE or CHECK_ALWAYS.
+ */
+export const CHECKED="CHECKED";
+
+/**
+ * CHECK_ALWAYS means that after calling detectChanges the mode of the change detector
+ * will remain CHECK_ALWAYS.
+ */
+export const CHECK_ALWAYS="ALWAYS_CHECK";
+
+/**
+ * DETACHED means that the change detector sub tree is not a part of the main tree and
+ * should be skipped.
+ */
+export const DETACHED="DETACHED";
+
+/**
+ * ON_PUSH means that the change detector's mode will be set to CHECK_ONCE during hydration.
+ */
+export const ON_PUSH = "ON_PUSH";
+
+/**
+ * DEFAULT means that the change detector's mode will be set to CHECK_ALWAYS during hydration.
+ */
+export const DEFAULT = "DEFAULT";

modules/angular2/src/change_detection/dynamic_change_detector.js

@@ -35,8 +35,10 @@ export class DynamicChangeDetector extends AbstractChangeDetector {
 
   protos:List<ProtoRecord>;
   directiveMementos:List;
+  changeControlStrategy:string;
 
-  constructor(dispatcher:any, pipeRegistry:PipeRegistry, protoRecords:List<ProtoRecord>, directiveMementos:List) {
+  constructor(changeControlStrategy:string, dispatcher:any, pipeRegistry:PipeRegistry,
+              protoRecords:List<ProtoRecord>, directiveMementos:List) {
     super();
     this.dispatcher = dispatcher;
     this.pipeRegistry = pipeRegistry;
@@ -54,9 +56,11 @@ export class DynamicChangeDetector extends AbstractChangeDetector {
 
     this.protos = protoRecords;
     this.directiveMementos = directiveMementos;
+    this.changeControlStrategy = changeControlStrategy;
   }
 
   hydrate(context:any, locals:any) {
+    this.mode = ChangeDetectionUtil.changeDetectionMode(this.changeControlStrategy);
     this.values[0] = context;
     this.locals = locals;
   }

modules/angular2/src/change_detection/interfaces.js

@@ -1,5 +1,19 @@
 import {List} from 'angular2/src/facade/collection';
 import {Locals} from './parser/locals';
+import {AST} from './parser/ast';
+
+export class ProtoChangeDetector  {
+  addAst(ast:AST, bindingMemento:any, directiveMemento:any = null){}
+  instantiate(dispatcher:any, bindingRecords:List, variableBindings:List, directiveMemento:List):ChangeDetector{
+    return null;
+  }
+}
+
+export class ChangeDetection {
+  createProtoChangeDetector(name:string, changeControlStrategy:string):ProtoChangeDetector{
+    return null;
+  }
+}
 
 export class ChangeRecord {
   bindingMemento:any;
@@ -20,31 +34,6 @@ export class ChangeRecord {
   }
 }
 
-
-/**
- * CHECK_ONCE means that after calling detectChanges the mode of the change detector
- * will become CHECKED.
- */
-export const CHECK_ONCE="CHECK_ONCE";
-
-/**
- * CHECKED means that the change detector should be skipped until its mode changes to
- * CHECK_ONCE or CHECK_ALWAYS.
- */
-export const CHECKED="CHECKED";
-
-/**
- * CHECK_ALWAYS means that after calling detectChanges the mode of the change detector
- * will remain CHECK_ALWAYS.
- */
-export const CHECK_ALWAYS="ALWAYS_CHECK";
-
-/**
- * DETACHED means that the change detector sub tree is not a part of the main tree and
- * should be skipped.
- */
-export const DETACHED="DETACHED";
-
 export class ChangeDispatcher {
   onRecordChange(directiveMemento, records:List<ChangeRecord>) {}
 }

modules/angular2/src/change_detection/proto_change_detector.js

@@ -22,7 +22,7 @@ import {
   PrefixNot
   } from './parser/ast';
 
-import {ChangeRecord, ChangeDispatcher, ChangeDetector} from './interfaces';
+import {ChangeRecord, ChangeDispatcher, ChangeDetector, ProtoChangeDetector} from './interfaces';
 import {ChangeDetectionUtil} from './change_detection_util';
 import {DynamicChangeDetector} from './dynamic_change_detector';
 import {ChangeDetectorJITGenerator} from './change_detection_jit_generator';
@@ -45,13 +45,6 @@ import {
   RECORD_TYPE_INTERPOLATE
   } from './proto_record';
 
-export class ProtoChangeDetector  {
-  addAst(ast:AST, bindingMemento:any, directiveMemento:any = null){}
-  instantiate(dispatcher:any, bindingRecords:List, variableBindings:List, directiveMemento:List):ChangeDetector{
-    return null;
-  }
-}
-
 export class BindingRecord {
   ast:AST;
   bindingMemento:any;
@@ -67,15 +60,18 @@ export class BindingRecord {
 export class DynamicProtoChangeDetector extends ProtoChangeDetector {
   _pipeRegistry:PipeRegistry;
   _records:List<ProtoRecord>;
+  _changeControlStrategy:string;
 
-  constructor(pipeRegistry:PipeRegistry) {
+  constructor(pipeRegistry:PipeRegistry, changeControlStrategy:string) {
     super();
     this._pipeRegistry = pipeRegistry;
+    this._changeControlStrategy = changeControlStrategy;
   }
 
   instantiate(dispatcher:any, bindingRecords:List, variableBindings:List, directiveMementos:List) {
     this._createRecordsIfNecessary(bindingRecords, variableBindings);
-    return new DynamicChangeDetector(dispatcher, this._pipeRegistry, this._records, directiveMementos);
+    return new DynamicChangeDetector(this._changeControlStrategy, dispatcher,
+      this._pipeRegistry, this._records, directiveMementos);
   }
 
   _createRecordsIfNecessary(bindingRecords:List, variableBindings:List) {
@@ -93,11 +89,13 @@ var _jitProtoChangeDetectorClassCounter:number = 0;
 export class JitProtoChangeDetector extends ProtoChangeDetector {
   _factory:Function;
   _pipeRegistry;
+  _changeControlStrategy:string;
 
-  constructor(pipeRegistry) {
+  constructor(pipeRegistry, changeControlStrategy:string) {
     super();
     this._pipeRegistry = pipeRegistry;
     this._factory = null;
+    this._changeControlStrategy = changeControlStrategy;
   }
 
   instantiate(dispatcher:any, bindingRecords:List, variableBindings:List, directiveMementos:List) {
@@ -114,7 +112,8 @@ export class JitProtoChangeDetector extends ProtoChangeDetector {
       var c = _jitProtoChangeDetectorClassCounter++;
       var records = coalesce(recordBuilder.records);
       var typeName = `ChangeDetector${c}`;
-      this._factory = new ChangeDetectorJITGenerator(typeName, records, directiveMementos).generate();
+      this._factory = new ChangeDetectorJITGenerator(typeName, this._changeControlStrategy, records,
+        directiveMementos).generate();
     }
   }
 }

modules/angular2/src/core/annotations/annotations.js

@@ -480,6 +480,17 @@ export class Directive extends Injectable {
  * @publicModule angular2/annotations
  */
 export class Component extends Directive {
+  /**
+   * Defines the used change detection strategy.
+   *
+   * When a component is instantiated, Angular creates a change detector, which is responsible for propagating
+   * the component's bindings.
+   *
+   * The changeDetection property defines if the change detection will be checked every time or only when the component
+   * tell it too.
+   */
+  changeDetection:string;
+
   /**
    * Defines the set of injectable objects that are visible to a Component and its children.
    *
@@ -534,13 +545,15 @@ export class Component extends Directive {
     bind,
     events,
     services,
-    lifecycle
+    lifecycle,
+    changeDetection
     }:{
-      selector:String,
+      selector:string,
       bind:Object,
       events:Object,
       services:List,
-      lifecycle:List
+      lifecycle:List,
+      changeDetection:string
     }={})
   {
     super({
@@ -550,6 +563,7 @@ export class Component extends Directive {
       lifecycle: lifecycle
     });
 
+    this.changeDetection = changeDetection;
     this.services = services;
   }
 }

modules/angular2/src/core/compiler/pipeline/default_steps.js

@@ -36,9 +36,9 @@ export function createDefaultSteps(
     new DirectiveParser(directives),
     new TextInterpolationParser(parser),
     new ElementBindingMarker(),
-    new ProtoViewBuilder(changeDetection, shadowDomStrategy),
+    new ProtoViewBuilder(compiledComponent, changeDetection, shadowDomStrategy),
     new ProtoElementInjectorBuilder(),
-    new ElementBinderBuilder(parser),
+    new ElementBinderBuilder(parser)
   ];
 
   return steps;

modules/angular2/src/core/compiler/pipeline/proto_view_builder.js

@@ -8,6 +8,8 @@ import {CompileStep} from './compile_step';
 import {CompileElement} from './compile_element';
 import {CompileControl} from './compile_control';
 import {ShadowDomStrategy} from '../shadow_dom_strategy';
+import {DirectiveMetadata} from '../directive_metadata';
+import {Component} from 'angular2/src/core/annotations/annotations';
 
 /**
  * Creates ProtoViews and forwards variable bindings from parent to children.
@@ -24,8 +26,12 @@ import {ShadowDomStrategy} from '../shadow_dom_strategy';
 export class ProtoViewBuilder extends CompileStep {
   changeDetection:ChangeDetection;
   _shadowDomStrategy:ShadowDomStrategy;
-  constructor(changeDetection:ChangeDetection, shadowDomStrategy:ShadowDomStrategy) {
+  _compiledComponent:DirectiveMetadata;
+
+  constructor(compiledComponent:DirectiveMetadata,
+              changeDetection:ChangeDetection, shadowDomStrategy:ShadowDomStrategy) {
     super();
+    this._compiledComponent = compiledComponent;
     this._shadowDomStrategy = shadowDomStrategy;
     this.changeDetection = changeDetection;
   }
@@ -33,7 +39,10 @@ export class ProtoViewBuilder extends CompileStep {
   process(parent:CompileElement, current:CompileElement, control:CompileControl) {
     var inheritedProtoView = null;
     if (current.isViewRoot) {
-      var protoChangeDetector = this.changeDetection.createProtoChangeDetector('dummy');
+      var componentAnnotation:Component = this._compiledComponent.annotation;
+      var protoChangeDetector = this.changeDetection.createProtoChangeDetector('dummy',
+        componentAnnotation.changeDetection);
+
       inheritedProtoView = new ProtoView(current.element, protoChangeDetector,
         this._shadowDomStrategy, this._getParentProtoView(parent));
 

modules/angular2/test/change_detection/change_detection_spec.js

@@ -8,7 +8,7 @@ import {Lexer} from 'angular2/src/change_detection/parser/lexer';
 import {Locals} from 'angular2/src/change_detection/parser/locals';
 
 import {ChangeDispatcher, DynamicChangeDetector, ChangeDetectionError, BindingRecord,
-  PipeRegistry, Pipe, NO_CHANGE, CHECK_ALWAYS, CHECK_ONCE, CHECKED, DETACHED} from 'angular2/change_detection';
+  PipeRegistry, Pipe, NO_CHANGE, CHECK_ALWAYS, CHECK_ONCE, CHECKED, DETACHED, ON_PUSH, DEFAULT} from 'angular2/change_detection';
 
 import {ChangeDetectionUtil} from 'angular2/src/change_detection/change_detection_util';
 
@@ -18,8 +18,8 @@ import {JitProtoChangeDetector, DynamicProtoChangeDetector} from 'angular2/src/c
 export function main() {
   describe("change detection", () => {
     StringMapWrapper.forEach(
-      { "dynamic": (registry = null) => new DynamicProtoChangeDetector(registry),
+      { "dynamic": (registry = null, strategy = null) => new DynamicProtoChangeDetector(registry, strategy),
-        "JIT": (registry = null) => new JitProtoChangeDetector(registry)
+        "JIT": (registry = null, strategy = null) => new JitProtoChangeDetector(registry, strategy)
       }, (createProtoChangeDetector, name) => {
 
         if (name == "JIT" && IS_DARTIUM) return;
@@ -464,6 +464,25 @@ export function main() {
         });
 
         describe("mode", () => {
+          it("should set the mode to CHECK_ALWAYS when the default change detection is used", () => {
+            var proto = createProtoChangeDetector(null, DEFAULT);
+            var cd = proto.instantiate(null, [], [], []);
+
+            expect(cd.mode).toEqual(null);
+
+            cd.hydrate(null, null);
+
+            expect(cd.mode).toEqual(CHECK_ALWAYS);
+          });
+
+          it("should set the mode to CHECK_ONCE when the push change detection is used", () => {
+            var proto = createProtoChangeDetector(null, ON_PUSH);
+            var cd = proto.instantiate(null, [], [], []);
+            cd.hydrate(null, null);
+
+            expect(cd.mode).toEqual(CHECK_ONCE);
+          });
+
           it("should not check a detached change detector", () => {
             var c = createChangeDetector('name', 'a', new TestData("value"));
             var cd = c["changeDetector"];

modules/angular2/test/core/compiler/integration_spec.js

@@ -18,7 +18,7 @@ import {PromiseWrapper} from 'angular2/src/facade/async';
 
 import {Injector, bind} from 'angular2/di';
 import {Lexer, Parser, dynamicChangeDetection,
-  DynamicChangeDetection, Pipe, PipeRegistry, BindingPropagationConfig} from 'angular2/change_detection';
+  DynamicChangeDetection, Pipe, PipeRegistry, BindingPropagationConfig, ON_PUSH} from 'angular2/change_detection';
 
 import {Compiler, CompilerCache} from 'angular2/src/core/compiler/compiler';
 import {DirectiveMetadataReader} from 'angular2/src/core/compiler/directive_metadata_reader';
@@ -723,7 +723,8 @@ class MyDir {
   selector: 'push-cmp',
   bind: {
     'prop': 'prop'
-  }
+  },
+  changeDetection:ON_PUSH
 })
 @Template({inline: '{{field}}'})
 class PushBasedComp {
@@ -734,7 +735,6 @@ class PushBasedComp {
   constructor(bpc:BindingPropagationConfig) {
     this.numberOfChecks = 0;
     this.bpc = bpc;
-    bpc.shouldBePropagated();
   }
 
   get field(){

modules/angular2/test/core/compiler/pipeline/element_binder_builder_spec.js

@@ -71,7 +71,7 @@ export function main() {
               current.isViewRoot = true;
               current.inheritedProtoView = new ProtoView(
                 current.element,
-                new DynamicProtoChangeDetector(normalizeBlank(registry)),
+                new DynamicProtoChangeDetector(normalizeBlank(registry), null),
                 new NativeShadowDomStrategy(null));
             } else if (isPresent(parent)) {
               current.inheritedProtoView = parent.inheritedProtoView;
@@ -467,7 +467,7 @@ export function main() {
       var results = pipeline.process(el('<div viewroot prop-binding directives></div>'));
       var pv = results[0].inheritedProtoView;
       results[0].inheritedElementBinder.nestedProtoView = new ProtoView(
-          el('<div></div>'), new DynamicProtoChangeDetector(null), new NativeShadowDomStrategy(null));
+          el('<div></div>'), new DynamicProtoChangeDetector(null, null), new NativeShadowDomStrategy(null));
 
       instantiateView(pv);
       evalContext.prop1 = 'a';
@@ -503,7 +503,7 @@ export function main() {
       var results = pipeline.process(el('<div viewroot prop-binding directives></div>'));
       var pv = results[0].inheritedProtoView;
       results[0].inheritedElementBinder.nestedProtoView = new ProtoView(
-        el('<div></div>'), new DynamicProtoChangeDetector(registry), new NativeShadowDomStrategy(null));
+        el('<div></div>'), new DynamicProtoChangeDetector(registry, null), new NativeShadowDomStrategy(null));
 
       instantiateView(pv);
       evalContext.prop1 = 'a';

modules/angular2/test/core/compiler/pipeline/proto_view_builder_spec.js

@@ -4,16 +4,20 @@ import {DOM} from 'angular2/src/dom/dom_adapter';
 import {dynamicChangeDetection} from 'angular2/change_detection';
 import {ElementBinder} from 'angular2/src/core/compiler/element_binder';
 import {ProtoViewBuilder} from 'angular2/src/core/compiler/pipeline/proto_view_builder';
+import {Component} from 'angular2/annotations';
 import {CompilePipeline} from 'angular2/src/core/compiler/pipeline/compile_pipeline';
 import {CompileElement} from 'angular2/src/core/compiler/pipeline/compile_element';
 import {CompileStep} from 'angular2/src/core/compiler/pipeline/compile_step'
 import {CompileControl} from 'angular2/src/core/compiler/pipeline/compile_control';
+import {DirectiveMetadata} from 'angular2/src/core/compiler/directive_metadata';
 import {NativeShadowDomStrategy} from 'angular2/src/core/compiler/shadow_dom_strategy';
 import {MapWrapper} from 'angular2/src/facade/collection';
 
 export function main() {
   describe('ProtoViewBuilder', () => {
     function createPipeline(variableBindings = null) {
+      var component = new DirectiveMetadata(null, new Component());
+
       return new CompilePipeline([new MockStep((parent, current, control) => {
         if (isPresent(DOM.getAttribute(current.element, 'viewroot'))) {
           current.isViewRoot = true;
@@ -22,7 +26,7 @@ export function main() {
           current.variableBindings = MapWrapper.createFromStringMap(variableBindings);
         }
         current.inheritedElementBinder = new ElementBinder(0, null, 0, null, null, null);
-      }), new ProtoViewBuilder(dynamicChangeDetection, new NativeShadowDomStrategy(null))]);
+      }), new ProtoViewBuilder(component, dynamicChangeDetection, new NativeShadowDomStrategy(null))]);
     }
 
     it('should not create a ProtoView when the isViewRoot flag is not set', () => {

modules/angular2/test/core/compiler/shadow_dom_strategy_spec.js

@@ -47,7 +47,7 @@ export function main() {
     it('should attach the view nodes to the shadow root', () => {
       var host = el('<div></div>');
       var nodes = el('<div>view</div>');
-      var pv = new ProtoView(nodes, new DynamicProtoChangeDetector(null), null);
+      var pv = new ProtoView(nodes, new DynamicProtoChangeDetector(null, null), null);
       var view = pv.instantiate(null, null);
 
       strategy.attachTemplate(host, view);
@@ -89,7 +89,7 @@ export function main() {
     it('should attach the view nodes as child of the host element', () => {
       var host = el('<div><span>original content</span></div>');
       var nodes = el('<div>view</div>');
-      var pv = new ProtoView(nodes, new DynamicProtoChangeDetector(null), null);
+      var pv = new ProtoView(nodes, new DynamicProtoChangeDetector(null, null), null);
       var view = pv.instantiate(null, null);
 
       strategy.attachTemplate(host, view);
@@ -224,7 +224,7 @@ export function main() {
     it('should attach the view nodes as child of the host element', () => {
       var host = el('<div><span>original content</span></div>');
       var nodes = el('<div>view</div>');
-      var pv = new ProtoView(nodes, new DynamicProtoChangeDetector(null), null);
+      var pv = new ProtoView(nodes, new DynamicProtoChangeDetector(null, null), null);
       var view = pv.instantiate(null, null);
 
       strategy.attachTemplate(host, view);

modules/angular2/test/core/compiler/view_container_spec.js

@@ -11,7 +11,7 @@ import {DynamicProtoChangeDetector, ChangeDetector, Lexer, Parser} from 'angular
 
 function createView(nodes) {
   var view = new View(null, nodes, MapWrapper.create());
-  var cd = new DynamicProtoChangeDetector(null).instantiate(view, [], null, []);
+  var cd = new DynamicProtoChangeDetector(null, null).instantiate(view, [], null, []);
   view.init(cd, [], [], [], [], [], [], [], [], []);
   return view;
 }
@@ -71,7 +71,7 @@ export function main() {
       dom = el(`<div><stuff></stuff><div insert-after-me></div><stuff></stuff></div>`);
       var insertionElement = dom.childNodes[1];
       parentView = createView([dom.childNodes[0]]);
-      protoView = new ProtoView(el('<div>hi</div>'), new DynamicProtoChangeDetector(null),
+      protoView = new ProtoView(el('<div>hi</div>'), new DynamicProtoChangeDetector(null, null),
         new NativeShadowDomStrategy(null));
       elementInjector = new ElementInjector(null, null, null);
       viewContainer = new ViewContainer(parentView, insertionElement, protoView, elementInjector,
@@ -217,7 +217,7 @@ export function main() {
         viewContainer.hydrate(new Injector([]), null, null);
 
         var pv = new ProtoView(el('<div class="ng-binding">{{}}</div>'),
-          new DynamicProtoChangeDetector(null), new NativeShadowDomStrategy(null));
+          new DynamicProtoChangeDetector(null, null), new NativeShadowDomStrategy(null));
         pv.bindElement(null, 0, new ProtoElementInjector(null, 1, [SomeDirective]));
         pv.bindTextNode(0, parser.parseBinding('foo', null));
         fancyView = pv.instantiate(null, null);

modules/angular2/test/core/compiler/view_spec.js

@@ -63,7 +63,7 @@ export function main() {
     describe('instantiated from protoView', () => {
       var view;
       beforeEach(() => {
-        var pv = new ProtoView(el('<div id="1"></div>'), new DynamicProtoChangeDetector(null), null);
+        var pv = new ProtoView(el('<div id="1"></div>'), new DynamicProtoChangeDetector(null, null), null);
         view = pv.instantiate(null, null);
       });
 
@@ -90,7 +90,7 @@ export function main() {
       });
 
       it('should use the view pool to reuse views', () => {
-        var pv = new ProtoView(el('<div id="1"></div>'), new DynamicProtoChangeDetector(null), null);
+        var pv = new ProtoView(el('<div id="1"></div>'), new DynamicProtoChangeDetector(null, null), null);
         var fakeView = new FakeView();
         pv.returnToPool(fakeView);
 
@@ -101,7 +101,7 @@ export function main() {
     describe('with locals', function() {
       var view;
       beforeEach(() => {
-        var pv = new ProtoView(el('<div id="1"></div>'), new DynamicProtoChangeDetector(null), null);
+        var pv = new ProtoView(el('<div id="1"></div>'), new DynamicProtoChangeDetector(null, null), null);
         pv.bindVariable('context-foo', 'template-foo');
         view = createView(pv);
       });
@@ -138,7 +138,7 @@ export function main() {
 
         it('should collect the root node in the ProtoView element', () => {
           var pv = new ProtoView(templateAwareCreateElement('<div id="1"></div>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
           var view = pv.instantiate(null, null);
           view.hydrate(null, null, null, null, null);
           expect(view.nodes.length).toBe(1);
@@ -149,7 +149,7 @@ export function main() {
 
           it('should collect property bindings on the root element if it has the ng-binding class', () => {
             var pv = new ProtoView(templateAwareCreateElement('<div [prop]="a" class="ng-binding"></div>'),
-              new DynamicProtoChangeDetector(null), null);
+              new DynamicProtoChangeDetector(null, null), null);
             pv.bindElement(null, 0, null);
             pv.bindElementProperty(parser.parseBinding('a', null), 'prop', reflector.setter('prop'));
 
@@ -161,7 +161,7 @@ export function main() {
 
           it('should collect property bindings on child elements with ng-binding class', () => {
             var pv = new ProtoView(templateAwareCreateElement('<div><span></span><span class="ng-binding"></span></div>'),
-              new DynamicProtoChangeDetector(null), null);
+              new DynamicProtoChangeDetector(null, null), null);
             pv.bindElement(null, 0, null);
             pv.bindElementProperty(parser.parseBinding('b', null), 'a', reflector.setter('a'));
 
@@ -177,7 +177,7 @@ export function main() {
 
           it('should collect text nodes under the root element', () => {
             var pv = new ProtoView(templateAwareCreateElement('<div class="ng-binding">{{}}<span></span>{{}}</div>'),
-              new DynamicProtoChangeDetector(null), null);
+              new DynamicProtoChangeDetector(null, null), null);
             pv.bindElement(null, 0, null);
             pv.bindTextNode(0, parser.parseBinding('a', null));
             pv.bindTextNode(2, parser.parseBinding('b', null));
@@ -191,7 +191,7 @@ export function main() {
 
           it('should collect text nodes with bindings on child elements with ng-binding class', () => {
             var pv = new ProtoView(templateAwareCreateElement('<div><span> </span><span class="ng-binding">{{}}</span></div>'),
-              new DynamicProtoChangeDetector(null), null);
+              new DynamicProtoChangeDetector(null, null), null);
             pv.bindElement(null, 0, null);
             pv.bindTextNode(0, parser.parseBinding('b', null));
 
@@ -207,7 +207,7 @@ export function main() {
       describe('inplace instantiation', () => {
         it('should be supported.', () => {
           var template = el('<div></div>');
-          var pv = new ProtoView(template, new DynamicProtoChangeDetector(null),
+          var pv = new ProtoView(template, new DynamicProtoChangeDetector(null, null),
             new NativeShadowDomStrategy(null));
           pv.instantiateInPlace = true;
           var view = pv.instantiate(null, null);
@@ -217,7 +217,7 @@ export function main() {
 
         it('should be off by default.', () => {
           var template = el('<div></div>')
-          var pv = new ProtoView(template, new DynamicProtoChangeDetector(null),
+          var pv = new ProtoView(template, new DynamicProtoChangeDetector(null, null),
             new NativeShadowDomStrategy(null))
           var view = pv.instantiate(null, null);
           view.hydrate(null, null, null, null, null);
@@ -236,7 +236,7 @@ export function main() {
       describe('create ElementInjectors', () => {
         it('should use the directives of the ProtoElementInjector', () => {
           var pv = new ProtoView(el('<div class="ng-binding"></div>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
           pv.bindElement(null, 0, new ProtoElementInjector(null, 1, [SomeDirective]));
 
           var view = pv.instantiate(null, null);
@@ -247,7 +247,7 @@ export function main() {
 
         it('should use the correct parent', () => {
           var pv = new ProtoView(el('<div class="ng-binding"><span class="ng-binding"></span></div>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
           var protoParent = new ProtoElementInjector(null, 0, [SomeDirective]);
           pv.bindElement(null, 0, protoParent);
           pv.bindElement(null, 0, new ProtoElementInjector(protoParent, 1, [AnotherDirective]));
@@ -261,7 +261,7 @@ export function main() {
 
         it('should not pass the host injector when a parent injector exists', () => {
           var pv = new ProtoView(el('<div class="ng-binding"><span class="ng-binding"></span></div>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
           var protoParent = new ProtoElementInjector(null, 0, [SomeDirective]);
           pv.bindElement(null, 0, protoParent);
           var testProtoElementInjector = new TestProtoElementInjector(protoParent, 1, [AnotherDirective]);
@@ -277,7 +277,7 @@ export function main() {
 
         it('should pass the host injector when there is no parent injector', () => {
           var pv = new ProtoView(el('<div class="ng-binding"><span class="ng-binding"></span></div>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
           pv.bindElement(null, 0, new ProtoElementInjector(null, 0, [SomeDirective]));
           var testProtoElementInjector = new TestProtoElementInjector(null, 1, [AnotherDirective]);
           pv.bindElement(null, 0, testProtoElementInjector);
@@ -294,7 +294,7 @@ export function main() {
 
         it('should collect a single root element injector', () => {
           var pv = new ProtoView(el('<div class="ng-binding"><span class="ng-binding"></span></div>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
           var protoParent = new ProtoElementInjector(null, 0, [SomeDirective]);
           pv.bindElement(null, 0, protoParent);
           pv.bindElement(null, 0, new ProtoElementInjector(protoParent, 1, [AnotherDirective]));
@@ -307,7 +307,7 @@ export function main() {
 
         it('should collect multiple root element injectors', () => {
           var pv = new ProtoView(el('<div><span class="ng-binding"></span><span class="ng-binding"></span></div>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
           pv.bindElement(null, 0, new ProtoElementInjector(null, 1, [SomeDirective]));
           pv.bindElement(null, 0, new ProtoElementInjector(null, 2, [AnotherDirective]));
 
@@ -325,7 +325,7 @@ export function main() {
 
         function createComponentWithSubPV(subProtoView) {
           var pv = new ProtoView(el('<cmp class="ng-binding"></cmp>'),
-            new DynamicProtoChangeDetector(null), new NativeShadowDomStrategy(null));
+            new DynamicProtoChangeDetector(null, null), new NativeShadowDomStrategy(null));
           var binder = pv.bindElement(null, 0, new ProtoElementInjector(null, 0, [SomeComponent], true));
           binder.componentDirective = someComponentDirective;
           binder.nestedProtoView = subProtoView;
@@ -340,7 +340,7 @@ export function main() {
         }
 
         it('should expose component services to the component', () => {
-          var subpv = new ProtoView(el('<span></span>'), new DynamicProtoChangeDetector(null), null);
+          var subpv = new ProtoView(el('<span></span>'), new DynamicProtoChangeDetector(null, null), null);
           var pv = createComponentWithSubPV(subpv);
 
           var view = createNestedView(pv);
@@ -353,7 +353,7 @@ export function main() {
           () => {
             var subpv = new ProtoView(
               el('<div dec class="ng-binding">hello shadow dom</div>'),
-              new DynamicProtoChangeDetector(null),
+              new DynamicProtoChangeDetector(null, null),
               null);
             subpv.bindElement(null, 0,
               new ProtoElementInjector(null, 0, [ServiceDependentDecorator]));
@@ -378,7 +378,7 @@ export function main() {
         it('dehydration should dehydrate child component views too', () => {
           var subpv = new ProtoView(
             el('<div dec class="ng-binding">hello shadow dom</div>'),
-            new DynamicProtoChangeDetector(null),
+            new DynamicProtoChangeDetector(null, null),
             null);
           subpv.bindElement(null, 0,
             new ProtoElementInjector(null, 0, [ServiceDependentDecorator]));
@@ -395,7 +395,7 @@ export function main() {
 
         it('should create shadow dom (Native Strategy)', () => {
           var subpv = new ProtoView(el('<span>hello shadow dom</span>'),
-            new DynamicProtoChangeDetector(null),
+            new DynamicProtoChangeDetector(null, null),
             null);
           var pv = createComponentWithSubPV(subpv);
 
@@ -406,10 +406,10 @@ export function main() {
 
         it('should emulate shadow dom (Emulated Strategy)', () => {
           var subpv = new ProtoView(el('<span>hello shadow dom</span>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
 
           var pv = new ProtoView(el('<cmp class="ng-binding"></cmp>'),
-            new DynamicProtoChangeDetector(null), new EmulatedScopedShadowDomStrategy(null, null, null));
+            new DynamicProtoChangeDetector(null, null), new EmulatedScopedShadowDomStrategy(null, null, null));
           var binder = pv.bindElement(null, 0, new ProtoElementInjector(null, 0, [SomeComponent], true));
           binder.componentDirective = new DirectiveMetadataReader().read(SomeComponent);
           binder.nestedProtoView = subpv;
@@ -423,9 +423,9 @@ export function main() {
       describe('with template views', () => {
         function createViewWithViewport() {
           var templateProtoView = new ProtoView(
-            el('<div id="1"></div>'), new DynamicProtoChangeDetector(null), null);
+            el('<div id="1"></div>'), new DynamicProtoChangeDetector(null, null), null);
           var pv = new ProtoView(el('<someTmpl class="ng-binding"></someTmpl>'),
-            new DynamicProtoChangeDetector(null), new NativeShadowDomStrategy(null));
+            new DynamicProtoChangeDetector(null, null), new NativeShadowDomStrategy(null));
           var binder = pv.bindElement(null, 0, new ProtoElementInjector(null, 0, [SomeViewport]));
           binder.viewportDirective = someViewportDirective;
           binder.nestedProtoView = templateProtoView;
@@ -471,7 +471,7 @@ export function main() {
 
           function createProtoView() {
             var pv = new ProtoView(el('<div class="ng-binding"><div></div></div>'),
-              new DynamicProtoChangeDetector(null), null);
+              new DynamicProtoChangeDetector(null, null), null);
             pv.bindElement(null, 0, new TestProtoElementInjector(null, 0, []));
             pv.bindEvent('click', parser.parseBinding('callMe($event)', null));
             return pv;
@@ -506,7 +506,7 @@ export function main() {
 
           it('should support custom event emitters', () => {
             var pv = new ProtoView(el('<div class="ng-binding"><div></div></div>'),
-              new DynamicProtoChangeDetector(null), null);
+              new DynamicProtoChangeDetector(null, null), null);
             pv.bindElement(null, 0, new TestProtoElementInjector(null, 0, [EventEmitterDirective]));
             pv.bindEvent('click', parser.parseBinding('callMe($event)', null));
 
@@ -527,7 +527,7 @@ export function main() {
 
           it('should bind to directive events', () => {
             var pv = new ProtoView(el('<div class="ng-binding"></div>'),
-              new DynamicProtoChangeDetector(null), null);
+              new DynamicProtoChangeDetector(null, null), null);
             pv.bindElement(null, 0, new ProtoElementInjector(null, 0, [SomeDirectiveWithEventHandler]));
             pv.bindEvent('click', parser.parseAction('onEvent($event)', null), 0);
             view = createView(pv, new EventManager([new DomEventsPlugin()], new FakeVmTurnZone()));
@@ -552,7 +552,7 @@ export function main() {
 
         it('should consume text node changes', () => {
           var pv = new ProtoView(el('<div class="ng-binding">{{}}</div>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
           pv.bindElement(null, 0, null);
           pv.bindTextNode(0, parser.parseBinding('foo', null));
           createViewAndChangeDetector(pv);
@@ -564,7 +564,7 @@ export function main() {
 
         it('should consume element binding changes', () => {
           var pv = new ProtoView(el('<div class="ng-binding"></div>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
           pv.bindElement(null, 0, null);
           pv.bindElementProperty(parser.parseBinding('foo', null), 'id', reflector.setter('id'));
           createViewAndChangeDetector(pv);
@@ -576,7 +576,7 @@ export function main() {
 
         it('should consume directive watch expression change', () => {
           var pv = new ProtoView(el('<div class="ng-binding"></div>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
           pv.bindElement(null, 0, new ProtoElementInjector(null, 0, [SomeDirective]));
           pv.bindDirectiveProperty(0, parser.parseBinding('foo', null), 'prop', reflector.setter('prop'));
           createViewAndChangeDetector(pv);
@@ -588,7 +588,7 @@ export function main() {
 
         it('should notify a directive about changes after all its properties have been set', () => {
           var pv = new ProtoView(el('<div class="ng-binding"></div>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
 
           pv.bindElement(null, 0, new ProtoElementInjector(null, 0, [
             DirectiveBinding.createFromType(DirectiveImplementingOnChange,
@@ -608,7 +608,7 @@ export function main() {
 
         it('should provide a map of updated properties using onChange callback', () => {
           var pv = new ProtoView(el('<div class="ng-binding"></div>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
 
           pv.bindElement(null, 0, new ProtoElementInjector(null, 0, [
             DirectiveBinding.createFromType(DirectiveImplementingOnChange,
@@ -636,7 +636,7 @@ export function main() {
 
         it('should invoke the onAllChangesDone callback', () => {
           var pv = new ProtoView(el('<div class="ng-binding"></div>'),
-            new DynamicProtoChangeDetector(null), null);
+            new DynamicProtoChangeDetector(null, null), null);
 
           pv.bindElement(null, 0, new ProtoElementInjector(null, 0, [
             DirectiveBinding.createFromType(DirectiveImplementingOnAllChangesDone,
@@ -656,13 +656,13 @@ export function main() {
       var element, pv;
       beforeEach(() => {
         element = DOM.createElement('div');
-        pv = new ProtoView(el('<div>hi</div>'), new DynamicProtoChangeDetector(null),
+        pv = new ProtoView(el('<div>hi</div>'), new DynamicProtoChangeDetector(null, null),
           new NativeShadowDomStrategy(null));
       });
 
       it('should create the root component when instantiated', () => {
         var rootProtoView = ProtoView.createRootProtoView(pv, element,
-          someComponentDirective, new DynamicProtoChangeDetector(null),
+          someComponentDirective, new DynamicProtoChangeDetector(null, null),
           new NativeShadowDomStrategy(null));
         var view = rootProtoView.instantiate(null, null);
         view.hydrate(new Injector([]), null, null, null, null);
@@ -671,7 +671,7 @@ export function main() {
 
       it('should inject the protoView into the shadowDom', () => {
         var rootProtoView = ProtoView.createRootProtoView(pv, element,
-          someComponentDirective, new DynamicProtoChangeDetector(null),
+          someComponentDirective, new DynamicProtoChangeDetector(null, null),
           new NativeShadowDomStrategy(null));
         var view = rootProtoView.instantiate(null, null);
         view.hydrate(new Injector([]), null, null, null, null);