feat(core): add binding name to content changed error (#20352)

Garbett1 · alexeagle · commit d3bf54bdeb0f · 2018-01-17T07:16:40.000-08:00
Adding the binding name to the error message recieved by the user gives extra context on what exactly changed. The tests are also updated to reflect the new error message. PR Close #20352
diff --git a/packages/core/src/view/util.ts b/packages/core/src/view/util.ts
@@ -98,9 +98,10 @@ export function checkBindingNoChanges(
     view: ViewData, def: NodeDef, bindingIdx: number, value: any) {
   const oldValue = view.oldValues[def.bindingIndex + bindingIdx];
   if ((view.state & ViewState.BeforeFirstCheck) || !devModeEqual(oldValue, value)) {
+    const bindingName = def.bindings[def.bindingIndex].name;
     throw expressionChangedAfterItHasBeenCheckedError(
-        Services.createDebugContext(view, def.nodeIndex), oldValue, value,
-        (view.state & ViewState.BeforeFirstCheck) !== 0);
+        Services.createDebugContext(view, def.nodeIndex), `${bindingName}: ${oldValue}`,
+        `${bindingName}: ${value}`, (view.state & ViewState.BeforeFirstCheck) !== 0);
   }
 }
 
diff --git a/packages/core/test/view/component_view_spec.ts b/packages/core/test/view/component_view_spec.ts
@@ -132,7 +132,7 @@ const addEventListener = '__zone_symbol__addEventListener';
         value = 'v2';
         expect(() => Services.checkNoChangesView(view))
             .toThrowError(
-                `ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'v1'. Current value: 'v2'.`);
+                `ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'a: v1'. Current value: 'a: v2'.`);
       });
 
       it('should support detaching and attaching component views for dirty checking', () => {
diff --git a/packages/core/test/view/embedded_view_spec.ts b/packages/core/test/view/embedded_view_spec.ts
@@ -145,7 +145,7 @@ import {compViewDef, compViewDefFactory, createAndGetRootNodes, createEmbeddedVi
       childValue = 'v2';
       expect(() => Services.checkNoChangesView(parentView))
           .toThrowError(
-              `ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'v1'. Current value: 'v2'.`);
+              `ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'name: v1'. Current value: 'name: v2'.`);
     });
 
     it('should destroy embedded views', () => {

Original file line number	Diff line number	Diff line change
`@@ -98,9 +98,10 @@ export function checkBindingNoChanges(`
`98`	`98`	`view: ViewData, def: NodeDef, bindingIdx: number, value: any) {`
`99`	`99`	`const oldValue = view.oldValues[def.bindingIndex + bindingIdx];`
`100`	`100`	`if ((view.state & ViewState.BeforeFirstCheck) \|\| !devModeEqual(oldValue, value)) {`
	`101`	`+ const bindingName = def.bindings[def.bindingIndex].name;`
`101`	`102`	`throw expressionChangedAfterItHasBeenCheckedError(`
`102`		`- Services.createDebugContext(view, def.nodeIndex), oldValue, value,`
`103`		`- (view.state & ViewState.BeforeFirstCheck) !== 0);`
	`103`	+ Services.createDebugContext(view, def.nodeIndex), `${bindingName}: ${oldValue}`,
	`104`	+ `${bindingName}: ${value}`, (view.state & ViewState.BeforeFirstCheck) !== 0);
`104`	`105`	`}`
`105`	`106`	`}`
`106`	`107`