Revert "test(upgrade): remove setTimeout from lifecycle hook tests (#13027)"

This reverts commit a4ab14bf74.
This commit is contained in:
Tobias Bosch
2016-11-23 12:08:38 -08:00
parent 9c954740d1
commit 4a5c8bd25f

View File

@ -6,8 +6,8 @@
* found in the LICENSE file at https://angular.io/license * found in the LICENSE file at https://angular.io/license
*/ */
import {ChangeDetectorRef, Class, Component, EventEmitter, NO_ERRORS_SCHEMA, NgModule, SimpleChanges, Testability, destroyPlatform, forwardRef} from '@angular/core'; import {Class, Component, EventEmitter, NO_ERRORS_SCHEMA, NgModule, SimpleChanges, Testability, destroyPlatform, forwardRef} from '@angular/core';
import {async, fakeAsync, flushMicrotasks, tick} from '@angular/core/testing'; import {async, fakeAsync, flushMicrotasks} from '@angular/core/testing';
import {BrowserModule} from '@angular/platform-browser'; import {BrowserModule} from '@angular/platform-browser';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic'; import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {UpgradeAdapter} from '@angular/upgrade'; import {UpgradeAdapter} from '@angular/upgrade';
@ -96,6 +96,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function Ng2Module() {}}); }).Class({constructor: function Ng2Module() {}});
ng1Module.directive('ng1', () => { ng1Module.directive('ng1', () => {
@ -169,6 +170,7 @@ export function main() {
adapter.upgradeNg1Component('ng1a'), adapter.upgradeNg1Component('ng1b'), Ng2 adapter.upgradeNg1Component('ng1a'), adapter.upgradeNg1Component('ng1b'), Ng2
], ],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -274,6 +276,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [Ng2], declarations: [Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
const element = html(`<div> const element = html(`<div>
@ -317,6 +320,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [Ng2], declarations: [Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -350,6 +354,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [Ng2], declarations: [Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -404,6 +409,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -447,6 +453,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -494,6 +501,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -539,6 +547,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -571,6 +580,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -598,6 +608,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -622,6 +633,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -646,6 +658,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -671,6 +684,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -714,6 +728,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -746,6 +761,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -778,6 +794,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -817,6 +834,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -861,6 +879,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -873,156 +892,154 @@ export function main() {
it('should call $onInit of components', async(() => { it('should call $onInit of components', async(() => {
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module)); const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
const $onInitSpy = jasmine.createSpy('$onInit'); const ng1Module = angular.module('ng1', []);
const valueToFind = '$onInit';
@Component({selector: 'ng2', template: '<ng1></ng1>'}) const ng1 = {
class Ng2Component { bindings: {},
} template: '{{$ctrl.value}}',
controller: Class(
{constructor: function() {}, $onInit: function() { this.value = valueToFind; }})
};
ng1Module.component('ng1', ng1);
angular.module('ng1', []) const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
.component('ng1', { constructor: function() {}
bindings: {}, });
template: '',
controller: function() { this.$onInit = $onInitSpy; }
})
.directive('ng2', adapter.downgradeNg2Component(Ng2Component));
@NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2Component], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
}) schemas: [NO_ERRORS_SCHEMA],
class Ng2Module { }).Class({constructor: function() {}});
}
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
const element = html(`<div><ng2></ng2></div>`); const element = html(`<div><ng2></ng2></div>`);
adapter.bootstrap(element, ['ng1']).ready((ref) => { adapter.bootstrap(element, ['ng1']).ready((ref) => {
expect($onInitSpy).toHaveBeenCalled(); expect(multiTrim(document.body.textContent)).toEqual(valueToFind);
ref.dispose(); ref.dispose();
}); });
})); }));
it('should call $doCheck of components', async(() => { it('should call $doCheck of components', async(() => {
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module)); const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
const $doCheckSpy = jasmine.createSpy('$doCheck'); const ng1Module = angular.module('ng1', []);
let changeDetector: ChangeDetectorRef; const valueToFind = '$doCheck';
@Component({selector: 'ng2', template: '<ng1></ng1>'}) let spy = jasmine.createSpy('doCheck');
class Ng2Component {
constructor(cd: ChangeDetectorRef) { changeDetector = cd; }
}
angular.module('ng1', []) const ng1 = {
.component('ng1', { bindings: {},
bindings: {}, template: '{{$ctrl.value}}',
template: '{{$ctrl.value}}', controller: Class({
controller: function() { this.$doCheck = $doCheckSpy; } constructor: function() {},
}) $doCheck: function() {
.directive('ng2', adapter.downgradeNg2Component(Ng2Component)); this.value = valueToFind;
spy();
}
})
};
ng1Module.component('ng1', ng1);
const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
constructor: function() {}
});
@NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2Component], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
}) schemas: [NO_ERRORS_SCHEMA],
class Ng2Module { }).Class({constructor: function() {}});
}
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
const element = html(`<div><ng2></ng2></div>`); const element = html(`<div><ng2></ng2></div>`);
adapter.bootstrap(element, ['ng1']).ready((ref) => { adapter.bootstrap(element, ['ng1']).ready((ref) => {
expect($doCheckSpy).toHaveBeenCalled(); expect(multiTrim(document.body.textContent)).toEqual(valueToFind);
expect(spy).toHaveBeenCalled();
$doCheckSpy.calls.reset(); let count = spy.calls.count();
changeDetector.detectChanges(); setTimeout(() => {
expect(spy.calls.count()).toBeGreaterThan(count);
expect($doCheckSpy).toHaveBeenCalled(); ref.dispose();
}, 100);
ref.dispose();
}); });
})); }));
it('should call $onChanges of components', fakeAsync(() => { it('should call $onChanges of components', async(() => {
const EXPECTED_VALUE = '$onChanges called';
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module)); const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
const $onChangesSpy = jasmine.createSpy('$onChanges'); const ng1Module = angular.module('ng1', []);
let ng2Instance: any; const valueToFind = '$onChanges init';
const valueToChange = '$onChanges changed';
@Component({selector: 'ng2', template: '<ng1 [val]="val"></ng1>'}) const ng1 = {
class Ng2Component { bindings: {val: '<'},
constructor() { ng2Instance = this; } template: '{{$ctrl.value}}',
} controller: Class({
constructor: function() {},
$onChanges: function(changes: any) { this.value = changes.val.currentValue; }
})
};
ng1Module.component('ng1', ng1);
angular.module('ng1Module', []) const Ng2 = Component({selector: 'ng2', template: '<ng1 [val]="val"></ng1>'}).Class({
.component('ng1', { constructor: function() { this.val = valueToFind; },
bindings: {val: '<'}, ngOnInit: function() { setTimeout(() => { this.val = valueToChange; }, 100); }
template: '', });
controller: function() { this.$onChanges = $onChangesSpy; }
})
.directive('ng2', adapter.downgradeNg2Component(Ng2Component));
@NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2Component], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
}) schemas: [NO_ERRORS_SCHEMA],
class Ng2Module { }).Class({constructor: function() {}});
}
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
const element = html(`<div><ng2></ng2></div>`); const element = html(`<div><ng2></ng2></div>`);
adapter.bootstrap(element, ['ng1Module']).ready((ref) => { adapter.bootstrap(element, ['ng1']).ready((ref) => {
expect(multiTrim(document.body.textContent)).toEqual(valueToFind);
ng2Instance.val = EXPECTED_VALUE; setTimeout(() => {
tick(); expect(multiTrim(document.body.textContent)).toEqual(valueToChange);
ref.ng1RootScope.$digest(); ref.dispose();
}, 200);
expect($onChangesSpy).toHaveBeenCalled();
const changes = $onChangesSpy.calls.mostRecent().args[0] as SimpleChanges;
expect(changes['val'].currentValue).toEqual(EXPECTED_VALUE);
ref.dispose();
}); });
})); }));
it('should call $onDestroy of components', fakeAsync(() => { it('should call $onDestroy of components', async(() => {
const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module)); const adapter: UpgradeAdapter = new UpgradeAdapter(forwardRef(() => Ng2Module));
const $onDestroySpy = jasmine.createSpy('$onDestroy'); const ng1Module = angular.module('ng1', []);
@Component({selector: 'ng2', template: '<ng1></ng1>'}) let spy = jasmine.createSpy('$onDestroy');
class Ng2Component {
}
angular.module('ng1', []) const ng1 = {
.component('ng1', { bindings: {},
bindings: {}, template: '<div>ng1</div>',
template: '<div>ng1</div>', controller: function($rootScope: any) { this.$onDestroy = function() { spy(); }; }
controller: function() { this.$onDestroy = $onDestroySpy; } };
}) ng1Module.component('ng1', ng1);
.directive('ng2', adapter.downgradeNg2Component(Ng2Component));
const Ng2 = Component({selector: 'ng2', template: '<ng1></ng1>'}).Class({
constructor: function() {}
});
@NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2Component], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
}) schemas: [NO_ERRORS_SCHEMA],
class Ng2Module { }).Class({constructor: function() {}});
}
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
const element = html(`<div ng-if="!destroy"><ng2></ng2></div>`); const element = html(`<div ng-if="!destroy"><ng2></ng2></div>`);
adapter.bootstrap(element, ['ng1']).ready((ref) => { adapter.bootstrap(element, ['ng1']).ready((ref) => {
const $rootScope = ref.ng1RootScope as any; (<any>ref.ng1RootScope).destroy = false;
setTimeout(() => {
$rootScope.destroy = false; (<any>ref.ng1RootScope).destroy = true;
tick(); setTimeout(() => {
$rootScope.$digest(); expect(spy).toHaveBeenCalled();
ref.dispose();
expect($onDestroySpy).not.toHaveBeenCalled(); }, 100);
}, 100);
$rootScope.destroy = true;
tick();
$rootScope.$digest();
expect($onDestroySpy).toHaveBeenCalled();
ref.dispose();
}); });
})); }));
@ -1045,6 +1062,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2)); ng1Module.directive('ng2', adapter.downgradeNg2Component(Ng2));
@ -1077,6 +1095,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2a, Ng2b], declarations: [adapter.upgradeNg1Component('ng1'), Ng2a, Ng2b],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
const element = html(`<div><ng2a></ng2a></div>`); const element = html(`<div><ng2a></ng2a></div>`);
@ -1093,6 +1112,7 @@ export function main() {
const MyNg2Module = NgModule({ const MyNg2Module = NgModule({
providers: [{provide: SomeToken, useValue: 'correct_value'}], providers: [{provide: SomeToken, useValue: 'correct_value'}],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
const adapter: UpgradeAdapter = new UpgradeAdapter(MyNg2Module); const adapter: UpgradeAdapter = new UpgradeAdapter(MyNg2Module);
@ -1220,6 +1240,7 @@ export function main() {
const Ng2Module = NgModule({ const Ng2Module = NgModule({
declarations: [adapter.upgradeNg1Component('ng1'), Ng2], declarations: [adapter.upgradeNg1Component('ng1'), Ng2],
imports: [BrowserModule], imports: [BrowserModule],
schemas: [NO_ERRORS_SCHEMA],
}).Class({constructor: function() {}}); }).Class({constructor: function() {}});
module.directive('ng2', adapter.downgradeNg2Component(Ng2)); module.directive('ng2', adapter.downgradeNg2Component(Ng2));