diff --git a/packages/upgrade/src/common/downgrade_component_adapter.ts b/packages/upgrade/src/common/downgrade_component_adapter.ts index 314cd8cf3c..906bd21869 100644 --- a/packages/upgrade/src/common/downgrade_component_adapter.ts +++ b/packages/upgrade/src/common/downgrade_component_adapter.ts @@ -151,7 +151,7 @@ export class DowngradeComponentAdapter { } // Attach the view so that it will be dirty-checked. - if (needsNgZone) { + if (needsNgZone || !propagateDigest) { const appRef = this.parentInjector.get(ApplicationRef); appRef.attachView(this.componentRef.hostView); } diff --git a/packages/upgrade/test/static/integration/downgrade_component_spec.ts b/packages/upgrade/test/static/integration/downgrade_component_spec.ts index bbc3e525ec..01906ec5c2 100644 --- a/packages/upgrade/test/static/integration/downgrade_component_spec.ts +++ b/packages/upgrade/test/static/integration/downgrade_component_spec.ts @@ -7,7 +7,7 @@ */ import {ChangeDetectorRef, Compiler, Component, ComponentFactoryResolver, EventEmitter, Injector, Input, NgModule, NgModuleRef, OnChanges, OnDestroy, SimpleChanges, destroyPlatform} from '@angular/core'; -import {async} from '@angular/core/testing'; +import {async, fakeAsync, tick} from '@angular/core/testing'; import {BrowserModule} from '@angular/platform-browser'; import {platformBrowserDynamic} from '@angular/platform-browser-dynamic'; import * as angular from '@angular/upgrade/src/common/angular1'; @@ -274,6 +274,42 @@ export function main() { }); })); + it('should still run normal Angular change-detection regardless of `propagateDigest`', + fakeAsync(() => { + let ng2Component: Ng2Component; + + @Component({selector: 'ng2', template: '{{ value }}'}) + class Ng2Component { + value = 'foo'; + constructor() { setTimeout(() => this.value = 'bar', 1000); } + } + + @NgModule({ + imports: [BrowserModule, UpgradeModule], + declarations: [Ng2Component], + entryComponents: [Ng2Component] + }) + class Ng2Module { + ngDoBootstrap() {} + } + + const ng1Module = + angular.module('ng1', []) + .directive( + 'ng2A', downgradeComponent({component: Ng2Component, propagateDigest: true})) + .directive( + 'ng2B', downgradeComponent({component: Ng2Component, propagateDigest: false})); + + const element = html(' | '); + + bootstrap(platformBrowserDynamic(), Ng2Module, element, ng1Module).then(upgrade => { + expect(element.textContent).toBe('foo | foo'); + + tick(1000); + expect(element.textContent).toBe('bar | bar'); + }); + })); + it('should initialize inputs in time for `ngOnChanges`', async(() => { @Component({ selector: 'ng2',