cargdev/angular
1
0
Fork 0
Code Issues 8 Pull Requests Actions Packages Projects Releases Wiki Activity

build: reformat repo to new clang@1.4.0 (#36628)

Browse Source 
PR Close #36628
This commit is contained in:
Joey Perrott
2020-04-13 17:43:52 -07:00
committed by atscott
parent 4b3f9ac739
commit 26f49151e7
1163 changed files with 31727 additions and 24036 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
packages/upgrade/src/common/src/angular1.ts
View File

@ -8,18 +8,18 @@
export type Ng1Token = string;
export type Ng1Expression = string | Function;
export type Ng1Expression = string|Function;
export interface IAnnotatedFunction extends Function {
// Older versions of `@types/angular` typings extend the global `Function` interface with
// `$inject?: string[]`, which is not compatible with `$inject?: ReadonlyArray<string>` (used in
// latest versions).
$inject?: Function extends{$inject?: string[]}? Ng1Token[]: ReadonlyArray<Ng1Token>;
$inject?: Function extends {$inject?: string[]}? Ng1Token[]: ReadonlyArray<Ng1Token>;
}
export type IInjectable = (Ng1Token | Function)[] | IAnnotatedFunction;
export type IInjectable = (Ng1Token|Function)[]|IAnnotatedFunction;
export type SingleOrListOrMap<T> = T | T[] | {[key: string]: T};
export type SingleOrListOrMap<T> = T|T[]|{[key: string]: T};
export interface IModule {
name: string;
@ -64,7 +64,9 @@ export interface IRootScopeService {
}
export interface IScope extends IRootScopeService {}
export interface IAngularBootstrapConfig { strictDi?: boolean; }
export interface IAngularBootstrapConfig {
strictDi?: boolean;
}
export interface IDirective {
compile?: IDirectiveCompileFn;
controller?: IController;
@ -84,7 +86,7 @@ export interface IDirective {
transclude?: DirectiveTranscludeProperty;
}
export type DirectiveRequireProperty = SingleOrListOrMap<string>;
export type DirectiveTranscludeProperty = boolean | 'element' | {[key: string]: string};
export type DirectiveTranscludeProperty = boolean|'element'|{[key: string]: string};
export interface IDirectiveCompileFn {
(templateElement: IAugmentedJQuery, templateAttributes: IAttributes,
transclude: ITranscludeFunction): IDirectivePrePost;
@ -116,8 +118,10 @@ export interface ITranscludeFunction {
// If one argument is provided, then it's assumed to be the cloneAttachFn.
(cloneAttachFn?: ICloneAttachFunction): IAugmentedJQuery;
}
export interface ICloneAttachFunction { (clonedElement: IAugmentedJQuery, scope: IScope): any; }
export type IAugmentedJQuery = Node[] & {
export interface ICloneAttachFunction {
(clonedElement: IAugmentedJQuery, scope: IScope): any;
}
export type IAugmentedJQuery = Node[]&{
on?: (name: string, fn: () => void) => void;
data?: (name: string, value?: any) => any;
text?: () => string;
@ -125,15 +129,17 @@ export type IAugmentedJQuery = Node[] & {
contents?: () => IAugmentedJQuery;
parent?: () => IAugmentedJQuery;
empty?: () => void;
append?: (content: IAugmentedJQuery | string) => IAugmentedJQuery;
append?: (content: IAugmentedJQuery|string) => IAugmentedJQuery;
controller?: (name: string) => any;
isolateScope?: () => IScope;
injector?: () => IInjectorService;
triggerHandler?: (eventTypeOrObject: string | Event, extraParameters?: any[]) => IAugmentedJQuery;
triggerHandler?: (eventTypeOrObject: string|Event, extraParameters?: any[]) => IAugmentedJQuery;
remove?: () => void;
removeData?: () => void;
};
export interface IProvider { $get: IInjectable; }
export interface IProvider {
$get: IInjectable;
}
export interface IProvideService {
provider(token: Ng1Token, provider: IProvider): IProvider;
factory(token: Ng1Token, factory: IInjectable): IProvider;
@ -142,7 +148,9 @@ export interface IProvideService {
constant(token: Ng1Token, value: any): void;
decorator(token: Ng1Token, factory: IInjectable): void;
}
export interface IParseService { (expression: string): ICompiledExpression; }
export interface IParseService {
(expression: string): ICompiledExpression;
}
export interface ICompiledExpression {
(context: any, locals: any): any;
assign?: (context: any, value: any) => any;
@ -160,7 +168,7 @@ export interface ITemplateRequestService {
(template: string|any /* TrustedResourceUrl */, ignoreRequestError?: boolean): Promise<string>;
totalPendingRequests: number;
}
export type IController = string | IInjectable;
export type IController = string|IInjectable;
export interface IControllerService {
(controllerConstructor: IController, locals?: any, later?: any, ident?: any): any;
(controllerName: string, locals?: any): any;
@ -224,12 +232,12 @@ const noNgElement: typeof angular.element = (() => noNg()) as any;
noNgElement.cleanData = noNg;
let angular: {
bootstrap: (e: Element, modules: (string | IInjectable)[], config?: IAngularBootstrapConfig) =>
IInjectorService,
bootstrap: (e: Element, modules: (string|IInjectable)[], config?: IAngularBootstrapConfig) =>
IInjectorService,
module: (prefix: string, dependencies?: string[]) => IModule,
element: {
(e: string | Element | Document | IAugmentedJQuery): IAugmentedJQuery;
cleanData: (nodes: Node[] | NodeList) => void;
(e: string|Element|Document|IAugmentedJQuery): IAugmentedJQuery;
cleanData: (nodes: Node[]|NodeList) => void;
},
injector: (modules: Array<string|IInjectable>, strictDi?: boolean) => IInjectorService,
version: {major: number},

16
packages/upgrade/src/common/src/component_info.ts
View File

@ -14,19 +14,21 @@
*/
export class PropertyBinding {
// TODO(issue/24571): remove '!'.
bracketAttr !: string;
bracketAttr!: string;
// TODO(issue/24571): remove '!'.
bracketParenAttr !: string;
bracketParenAttr!: string;
// TODO(issue/24571): remove '!'.
parenAttr !: string;
parenAttr!: string;
// TODO(issue/24571): remove '!'.
onAttr !: string;
onAttr!: string;
// TODO(issue/24571): remove '!'.
bindAttr !: string;
bindAttr!: string;
// TODO(issue/24571): remove '!'.
bindonAttr !: string;
bindonAttr!: string;
constructor(public prop: string, public attr: string) { this.parseBinding(); }
constructor(public prop: string, public attr: string) {
this.parseBinding();
}
private parseBinding() {
this.bracketAttr = `[${this.attr}]`;

18
packages/upgrade/src/common/src/downgrade_component.ts
View File

@ -12,7 +12,7 @@ import {IAnnotatedFunction, IAttributes, IAugmentedJQuery, ICompileService, IDir
import {$COMPILE, $INJECTOR, $PARSE, INJECTOR_KEY, LAZY_MODULE_REF, REQUIRE_INJECTOR, REQUIRE_NG_MODEL} from './constants';
import {DowngradeComponentAdapter} from './downgrade_component_adapter';
import {SyncPromise, Thenable} from './promise_util';
import {LazyModuleRef, UpgradeAppType, controllerKey, getDowngradedModuleCount, getTypeName, getUpgradeAppType, validateInjectionKey} from './util';
import {controllerKey, getDowngradedModuleCount, getTypeName, getUpgradeAppType, LazyModuleRef, UpgradeAppType, validateInjectionKey} from './util';
/**
@ -65,7 +65,9 @@ import {LazyModuleRef, UpgradeAppType, controllerKey, getDowngradedModuleCount,
* @publicApi
*/
export function downgradeComponent(info: {
component: Type<any>; downgradedModule?: string; propagateDigest?: boolean;
component: Type<any>;
downgradedModule?: string;
propagateDigest?: boolean;
/** @deprecated since v4. This parameter is no longer used */
inputs?: string[];
/** @deprecated since v4. This parameter is no longer used */
@ -151,12 +153,12 @@ export function downgradeComponent(info: {
// If there is a parent component, use its injector as parent injector.
// If this is a "top-level" Angular component, use the module injector.
const finalParentInjector = parentInjector || moduleInjector !;
const finalParentInjector = parentInjector || moduleInjector!;
// If this is a "top-level" Angular component or the parent component may belong to a
// different `NgModule`, use the module injector for module-specific dependencies.
// If there is a parent component that belongs to the same `NgModule`, use its injector.
const finalModuleInjector = moduleInjector || parentInjector !;
const finalModuleInjector = moduleInjector || parentInjector!;
const doDowngrade = (injector: Injector, moduleInjector: Injector) => {
// Retrieve `ComponentFactoryResolver` from the injector tied to the `NgModule` this
@ -164,7 +166,7 @@ export function downgradeComponent(info: {
const componentFactoryResolver: ComponentFactoryResolver =
moduleInjector.get(ComponentFactoryResolver);
const componentFactory: ComponentFactory<any> =
componentFactoryResolver.resolveComponentFactory(info.component) !;
componentFactoryResolver.resolveComponentFactory(info.component)!;
if (!componentFactory) {
throw new Error(`Expecting ComponentFactory for: ${getTypeName(info.component)}`);
@ -227,15 +229,15 @@ class ParentInjectorPromise extends SyncPromise<Injector> {
super();
// Store the promise on the element.
element.data !(this.injectorKey, this);
element.data!(this.injectorKey, this);
}
resolve(injector: Injector): void {
// Store the real injector on the element.
this.element.data !(this.injectorKey, injector);
this.element.data!(this.injectorKey, injector);
// Release the element to prevent memory leaks.
this.element = null !;
this.element = null!;
// Resolve the promise.
super.resolve(injector);

30
packages/upgrade/src/common/src/downgrade_component_adapter.ts
View File

@ -23,12 +23,12 @@ export class DowngradeComponentAdapter {
private inputChanges: SimpleChanges = {};
private componentScope: IScope;
// TODO(issue/24571): remove '!'.
private componentRef !: ComponentRef<any>;
private componentRef!: ComponentRef<any>;
private component: any;
// TODO(issue/24571): remove '!'.
private changeDetector !: ChangeDetectorRef;
private changeDetector!: ChangeDetectorRef;
// TODO(issue/24571): remove '!'.
private viewChangeDetector !: ChangeDetectorRef;
private viewChangeDetector!: ChangeDetectorRef;
constructor(
private element: IAugmentedJQuery, private attrs: IAttributes, private scope: IScope,
@ -44,12 +44,12 @@ export class DowngradeComponentAdapter {
const projectableNodes: Node[][] = this.groupProjectableNodes();
const linkFns = projectableNodes.map(nodes => this.$compile(nodes));
this.element.empty !();
this.element.empty!();
linkFns.forEach(linkFn => {
linkFn(this.scope, (clone: Node[]) => {
compiledProjectableNodes.push(clone);
this.element.append !(clone);
this.element.append!(clone);
});
});
@ -108,7 +108,7 @@ export class DowngradeComponentAdapter {
// for `ngOnChanges()`. This is necessary if we are already in a `$digest`, which means that
// `ngOnChanges()` (which is called by a watcher) will run before the `$observe()` callback.
let unwatch: Function|null = this.componentScope.$watch(() => {
unwatch !();
unwatch!();
unwatch = null;
observeFn(attrs[input.attr]);
});
@ -140,7 +140,7 @@ export class DowngradeComponentAdapter {
if (this.implementsOnChanges) {
const inputChanges = this.inputChanges;
this.inputChanges = {};
(<OnChanges>this.component).ngOnChanges(inputChanges !);
(<OnChanges>this.component).ngOnChanges(inputChanges!);
}
this.viewChangeDetector.markForCheck();
@ -160,7 +160,7 @@ export class DowngradeComponentAdapter {
// (Allow time for the initial input values to be set and `ngOnChanges()` to be called.)
if (manuallyAttachView || !propagateDigest) {
let unwatch: Function|null = this.componentScope.$watch(() => {
unwatch !();
unwatch!();
unwatch = null;
const appRef = this.parentInjector.get<ApplicationRef>(ApplicationRef);
@ -202,12 +202,12 @@ export class DowngradeComponentAdapter {
const emitter = this.component[output.prop] as EventEmitter<any>;
if (emitter) {
emitter.subscribe({
next: isAssignment ? (v: any) => setter !(this.scope, v) :
next: isAssignment ? (v: any) => setter!(this.scope, v) :
(v: any) => getter(this.scope, {'$event': v})
});
} else {
throw new Error(
`Missing emitter '${output.prop}' on component '${getTypeName(this.componentFactory.componentType)}'!`);
throw new Error(`Missing emitter '${output.prop}' on component '${
getTypeName(this.componentFactory.componentType)}'!`);
}
}
@ -216,7 +216,7 @@ export class DowngradeComponentAdapter {
const destroyComponentRef = this.wrapCallback(() => this.componentRef.destroy());
let destroyed = false;
this.element.on !('$destroy', () => this.componentScope.$destroy());
this.element.on!('$destroy', () => this.componentScope.$destroy());
this.componentScope.$on('$destroy', () => {
if (!destroyed) {
destroyed = true;
@ -226,7 +226,9 @@ export class DowngradeComponentAdapter {
});
}
getInjector(): Injector { return this.componentRef.injector; }
getInjector(): Injector {
return this.componentRef.injector;
}
private updateInput(prop: string, prevValue: any, currValue: any) {
if (this.implementsOnChanges) {
@ -239,7 +241,7 @@ export class DowngradeComponentAdapter {
groupProjectableNodes() {
let ngContentSelectors = this.componentFactory.ngContentSelectors;
return groupNodesBySelector(ngContentSelectors, this.element.contents !());
return groupNodesBySelector(ngContentSelectors, this.element.contents!());
}
}

6
packages/upgrade/src/common/src/promise_util.ts
View File

@ -8,7 +8,9 @@
import {isFunction} from './util';
export interface Thenable<T> { then(callback: (value: T) => any): any; }
export interface Thenable<T> {
then(callback: (value: T) => any): any;
}
export function isThenable<T>(obj: unknown): obj is Thenable<T> {
return !!obj && isFunction((obj as any).then);
@ -57,7 +59,7 @@ export class SyncPromise<T> {
then(callback: (value: T) => unknown): void {
if (this.resolved) {
callback(this.value !);
callback(this.value!);
} else {
this.callbacks.push(callback);
}

24
packages/upgrade/src/common/src/upgrade_helper.ts
View File

@ -8,7 +8,7 @@
import {ElementRef, Injector, SimpleChanges} from '@angular/core';
import {DirectiveRequireProperty, IAugmentedJQuery, ICloneAttachFunction, ICompileService, IController, IControllerService, IDirective, IHttpBackendService, IInjectorService, ILinkFn, IScope, ITemplateCacheService, SingleOrListOrMap, element as angularElement} from './angular1';
import {DirectiveRequireProperty, element as angularElement, IAugmentedJQuery, ICloneAttachFunction, ICompileService, IController, IControllerService, IDirective, IHttpBackendService, IInjectorService, ILinkFn, IScope, ITemplateCacheService, SingleOrListOrMap} from './angular1';
import {$COMPILE, $CONTROLLER, $HTTP_BACKEND, $INJECTOR, $TEMPLATE_CACHE} from './constants';
import {controllerKey, directiveNormalize, isFunction} from './util';
@ -107,7 +107,7 @@ export class UpgradeHelper {
const locals = {'$scope': $scope, '$element': this.$element};
const controller = this.$controller(controllerType, locals, null, this.directive.controllerAs);
this.$element.data !(controllerKey(this.directive.name !), controller);
this.$element.data!(controllerKey(this.directive.name!), controller);
return controller;
}
@ -146,7 +146,7 @@ export class UpgradeHelper {
// there will be no transclusion scope here.
// Provide a dummy `scope.$destroy()` method to prevent `cloneAttachFn` from throwing.
scope = scope || {$destroy: () => undefined};
return cloneAttachFn !($template, scope);
return cloneAttachFn!($template, scope);
};
let $template = contentChildNodes;
@ -192,7 +192,7 @@ export class UpgradeHelper {
Object.keys(slots).filter(slotName => slots[slotName]).forEach(slotName => {
const nodes = slots[slotName];
slots[slotName] = (scope: IScope, cloneAttach: ICloneAttachFunction) => {
return cloneAttach !(nodes, scope);
return cloneAttach!(nodes, scope);
};
});
}
@ -225,7 +225,7 @@ export class UpgradeHelper {
const requiredControllers = this.resolveRequire(directiveRequire);
if (controllerInstance && this.directive.bindToController && isMap(directiveRequire)) {
const requiredControllersMap = requiredControllers as{[key: string]: IControllerInstance};
const requiredControllersMap = requiredControllers as {[key: string]: IControllerInstance};
Object.keys(requiredControllersMap).forEach(key => {
controllerInstance[key] = requiredControllersMap[key];
});
@ -252,12 +252,12 @@ export class UpgradeHelper {
}
private getDirectiveRequire(): DirectiveRequireProperty {
const require = this.directive.require || (this.directive.controller && this.directive.name) !;
const require = this.directive.require || (this.directive.controller && this.directive.name)!;
if (isMap(require)) {
Object.keys(require).forEach(key => {
const value = require[key];
const match = value.match(REQUIRE_PREFIX_RE) !;
const match = value.match(REQUIRE_PREFIX_RE)!;
const name = value.substring(match[0].length);
if (!name) {
@ -277,10 +277,10 @@ export class UpgradeHelper {
return require.map(req => this.resolveRequire(req));
} else if (typeof require === 'object') {
const value: {[key: string]: IControllerInstance} = {};
Object.keys(require).forEach(key => value[key] = this.resolveRequire(require[key]) !);
Object.keys(require).forEach(key => value[key] = this.resolveRequire(require[key])!);
return value;
} else if (typeof require === 'string') {
const match = require.match(REQUIRE_PREFIX_RE) !;
const match = require.match(REQUIRE_PREFIX_RE)!;
const inheritType = match[1] || match[3];
const name = require.substring(match[0].length);
@ -289,8 +289,8 @@ export class UpgradeHelper {
const startOnParent = inheritType === '^^';
const ctrlKey = controllerKey(name);
const elem = startOnParent ? this.$element.parent !() : this.$element;
const value = searchParents ? elem.inheritedData !(ctrlKey) : elem.data !(ctrlKey);
const elem = startOnParent ? this.$element.parent!() : this.$element;
const value = searchParents ? elem.inheritedData!(ctrlKey) : elem.data!(ctrlKey);
if (!value && !isOptional) {
throw new Error(
@ -305,7 +305,7 @@ export class UpgradeHelper {
}
}
function getOrCall<T>(property: T | Function, ...args: any[]): T {
function getOrCall<T>(property: T|Function, ...args: any[]): T {
return isFunction(property) ? property(...args) : property;
}

8
packages/upgrade/src/common/src/util.ts
View File

@ -97,9 +97,9 @@ export function validateInjectionKey(
export class Deferred<R> {
promise: Promise<R>;
// TODO(issue/24571): remove '!'.
resolve !: (value?: R | PromiseLike<R>) => void;
resolve!: (value?: R|PromiseLike<R>) => void;
// TODO(issue/24571): remove '!'.
reject !: (error?: any) => void;
reject!: (error?: any) => void;
constructor() {
this.promise = new Promise((res, rej) => {
@ -144,7 +144,9 @@ function supportsNgModel(component: any) {
*/
export function hookupNgModel(ngModel: INgModelController, component: any) {
if (ngModel && supportsNgModel(component)) {
ngModel.$render = () => { component.writeValue(ngModel.$viewValue); };
ngModel.$render = () => {
component.writeValue(ngModel.$viewValue);
};
component.registerOnChange(ngModel.$setViewValue.bind(ngModel));
if (typeof component.registerOnTouched === 'function') {
component.registerOnTouched(ngModel.$setTouched.bind(ngModel));

21
packages/upgrade/src/common/test/downgrade_component_adapter_spec.ts
View File

@ -78,7 +78,6 @@ withEachNg1Version(() => {
});
describe('testability', () => {
let adapter: DowngradeComponentAdapter;
let content: string;
let compiler: Compiler;
@ -88,7 +87,9 @@ withEachNg1Version(() => {
class mockScope implements angular.IScope {
private destroyListeners: (() => void)[] = [];
$new() { return this; }
$new() {
return this;
}
$watch(exp: angular.Ng1Expression, fn?: (a1?: any, a2?: any) => void) {
return () => {};
}
@ -112,17 +113,17 @@ withEachNg1Version(() => {
return () => {};
}
// TODO(issue/24571): remove '!'.
$$childTail !: angular.IScope;
$$childTail!: angular.IScope;
// TODO(issue/24571): remove '!'.
$$childHead !: angular.IScope;
$$childHead!: angular.IScope;
// TODO(issue/24571): remove '!'.
$$nextSibling !: angular.IScope;
$$nextSibling!: angular.IScope;
[key: string]: any;
$id = 'mockScope';
// TODO(issue/24571): remove '!'.
$parent !: angular.IScope;
$parent!: angular.IScope;
// TODO(issue/24571): remove '!'.
$root !: angular.IScope;
$root!: angular.IScope;
}
function getAdaptor(): DowngradeComponentAdapter {
@ -161,7 +162,7 @@ withEachNg1Version(() => {
const modFactory = compiler.compileModuleSync(NewModule);
const module = modFactory.create(TestBed);
componentFactory = module.componentFactoryResolver.resolveComponentFactory(NewComponent) !;
componentFactory = module.componentFactoryResolver.resolveComponentFactory(NewComponent)!;
parentInjector = TestBed;
return new DowngradeComponentAdapter(
@ -178,7 +179,6 @@ withEachNg1Version(() => {
afterEach(() => registry.unregisterAllApplications());
it('should add testabilities hook when creating components', () => {
let registry = TestBed.inject(TestabilityRegistry);
adapter.createComponent([]);
expect(registry.getAllTestabilities().length).toEqual(1);
@ -194,10 +194,9 @@ withEachNg1Version(() => {
adapter.createComponent([]);
expect(registry.getAllTestabilities().length).toEqual(1);
adapter.registerCleanup();
element.remove !();
element.remove!();
expect(registry.getAllTestabilities().length).toEqual(0);
});
});
});
});

2
packages/upgrade/src/common/test/helpers/common_test_helpers.ts
View File

@ -148,7 +148,7 @@ export function html(html: string): Element {
return div;
}
export function multiTrim(text: string | null | undefined, allSpace = false): string {
export function multiTrim(text: string|null|undefined, allSpace = false): string {
if (typeof text == 'string') {
const repl = allSpace ? '' : ' ';
return text.replace(/\n/g, '').replace(/\s+/g, repl).trim();

10
packages/upgrade/src/common/test/promise_util_spec.ts
View File

@ -6,7 +6,7 @@
* found in the LICENSE file at https://angular.io/license
*/
import {SyncPromise, isThenable} from '../src/promise_util';
import {isThenable, SyncPromise} from '../src/promise_util';
describe('isThenable()', () => {
it('should return false for primitive values', () => {
@ -27,7 +27,6 @@ describe('isThenable()', () => {
expect(isThenable({})).toBe(false);
expect(isThenable({then: true})).toBe(false);
expect(isThenable({then: 'not a function'})).toBe(false);
});
it('should return true if `.then` is a function', () => {
@ -87,8 +86,9 @@ describe('SyncPromise', () => {
});
describe('.all()', () => {
it('should return a `SyncPromise` instance',
() => { expect(SyncPromise.all([])).toEqual(jasmine.any(SyncPromise)); });
it('should return a `SyncPromise` instance', () => {
expect(SyncPromise.all([])).toEqual(jasmine.any(SyncPromise));
});
it('should resolve immediately if the provided values are not thenable', () => {
const spy = jasmine.createSpy('spy');
@ -99,7 +99,7 @@ describe('SyncPromise', () => {
expect(spy).toHaveBeenCalledWith(['foo', 1, {then: false}, []]);
});
it('should wait for any thenables to resolve', async() => {
it('should wait for any thenables to resolve', async () => {
const spy = jasmine.createSpy('spy');
const v1 = 'foo';

71
packages/upgrade/src/dynamic/src/upgrade_adapter.ts
View File

@ -6,14 +6,14 @@
* found in the LICENSE file at https://angular.io/license
*/
import {Compiler, CompilerOptions, Injector, NgModule, NgModuleRef, NgZone, StaticProvider, Testability, Type, isDevMode, resolveForwardRef} from '@angular/core';
import {Compiler, CompilerOptions, Injector, isDevMode, NgModule, NgModuleRef, NgZone, resolveForwardRef, StaticProvider, Testability, Type} from '@angular/core';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {IAngularBootstrapConfig, IAugmentedJQuery, IInjectorService, IModule, IProvideService, IRootScopeService, ITestabilityService, bootstrap, element as angularElement, module_ as angularModule} from '../../common/src/angular1';
import {bootstrap, element as angularElement, IAngularBootstrapConfig, IAugmentedJQuery, IInjectorService, IModule, IProvideService, IRootScopeService, ITestabilityService, module_ as angularModule} from '../../common/src/angular1';
import {$$TESTABILITY, $COMPILE, $INJECTOR, $ROOT_SCOPE, COMPILER_KEY, INJECTOR_KEY, LAZY_MODULE_REF, NG_ZONE_KEY, UPGRADE_APP_TYPE_KEY} from '../../common/src/constants';
import {downgradeComponent} from '../../common/src/downgrade_component';
import {downgradeInjectable} from '../../common/src/downgrade_injectable';
import {Deferred, LazyModuleRef, UpgradeAppType, controllerKey, onError} from '../../common/src/util';
import {controllerKey, Deferred, LazyModuleRef, onError, UpgradeAppType} from '../../common/src/util';
import {UpgradeNg1ComponentAdapterBuilder} from './upgrade_ng1_adapter';
@ -115,12 +115,12 @@ export class UpgradeAdapter {
private ng1ComponentsToBeUpgraded: {[name: string]: UpgradeNg1ComponentAdapterBuilder} = {};
private upgradedProviders: StaticProvider[] = [];
// TODO(issue/24571): remove '!'.
private ngZone !: NgZone;
private ngZone!: NgZone;
// TODO(issue/24571): remove '!'.
private ng1Module !: IModule;
private ng1Module!: IModule;
private moduleRef: NgModuleRef<any>|null = null;
// TODO(issue/24571): remove '!'.
private ng2BootstrapDeferred !: Deferred<IInjectorService>;
private ng2BootstrapDeferred!: Deferred<IInjectorService>;
constructor(private ng2AppModule: Type<any>, private compilerOptions?: CompilerOptions) {
if (!ng2AppModule) {
@ -332,8 +332,9 @@ export class UpgradeAdapter {
this.declareNg1Module(modules);
windowNgMock.module(this.ng1Module.name);
const upgrade = new UpgradeAdapterRef();
this.ng2BootstrapDeferred.promise.then(
(ng1Injector) => { (<any>upgrade)._bootstrapDone(this.moduleRef, ng1Injector); }, onError);
this.ng2BootstrapDeferred.promise.then((ng1Injector) => {
(<any>upgrade)._bootstrapDone(this.moduleRef, ng1Injector);
}, onError);
return upgrade;
}
@ -392,7 +393,9 @@ export class UpgradeAdapter {
const windowAngular = (window as any /** TODO #???? */)['angular'];
windowAngular.resumeBootstrap = undefined;
this.ngZone.run(() => { bootstrap(element, [this.ng1Module.name], config !); });
this.ngZone.run(() => {
bootstrap(element, [this.ng1Module.name], config!);
});
const ng1BootstrapPromise = new Promise((resolve) => {
if (windowAngular.resumeBootstrap) {
const originalResumeBootstrap: () => void = windowAngular.resumeBootstrap;
@ -408,9 +411,10 @@ export class UpgradeAdapter {
});
Promise.all([this.ng2BootstrapDeferred.promise, ng1BootstrapPromise]).then(([ng1Injector]) => {
angularElement(element).data !(controllerKey(INJECTOR_KEY), this.moduleRef !.injector);
this.moduleRef !.injector.get<NgZone>(NgZone).run(
() => { (<any>upgrade)._bootstrapDone(this.moduleRef, ng1Injector); });
angularElement(element).data!(controllerKey(INJECTOR_KEY), this.moduleRef!.injector);
this.moduleRef!.injector.get<NgZone>(NgZone).run(() => {
(<any>upgrade)._bootstrapDone(this.moduleRef, ng1Injector);
});
}, onError);
return upgrade;
}
@ -476,7 +480,9 @@ export class UpgradeAdapter {
*
* ```
*/
downgradeNg2Provider(token: any): Function { return downgradeInjectable(token); }
downgradeNg2Provider(token: any): Function {
return downgradeInjectable(token);
}
/**
* Declare the AngularJS upgrade module for this adapter without bootstrapping the whole
@ -507,12 +513,11 @@ export class UpgradeAdapter {
this.ngZone = new NgZone({enableLongStackTrace: Zone.hasOwnProperty('longStackTraceZoneSpec')});
this.ng2BootstrapDeferred = new Deferred();
ng1Module.constant(UPGRADE_APP_TYPE_KEY, UpgradeAppType.Dynamic)
.factory(INJECTOR_KEY, () => this.moduleRef !.injector.get(Injector))
.factory(INJECTOR_KEY, () => this.moduleRef!.injector.get(Injector))
.factory(
LAZY_MODULE_REF,
[INJECTOR_KEY, (injector: Injector) => ({ injector } as LazyModuleRef)])
LAZY_MODULE_REF, [INJECTOR_KEY, (injector: Injector) => ({injector} as LazyModuleRef)])
.constant(NG_ZONE_KEY, this.ngZone)
.factory(COMPILER_KEY, () => this.moduleRef !.injector.get(Compiler))
.factory(COMPILER_KEY, () => this.moduleRef!.injector.get(Compiler))
.config([
'$provide', '$injector',
(provide: IProvideService, ng1Injector: IInjectorService) => {
@ -540,7 +545,7 @@ export class UpgradeAdapter {
const newWhenStable = function(this: unknown, callback: Function) {
originalWhenStable.call(this, function(this: unknown) {
const ng2Testability: Testability =
upgradeAdapter.moduleRef !.injector.get(Testability);
upgradeAdapter.moduleRef!.injector.get(Testability);
if (ng2Testability.isStable()) {
callback.apply(this, arguments);
} else {
@ -583,7 +588,7 @@ export class UpgradeAdapter {
}
platformRef
.bootstrapModule(
DynamicNgUpgradeModule, [this.compilerOptions !, {ngZone: this.ngZone}])
DynamicNgUpgradeModule, [this.compilerOptions!, {ngZone: this.ngZone}])
.then((ref: NgModuleRef<any>) => {
this.moduleRef = ref;
this.ngZone.run(() => {
@ -612,7 +617,9 @@ export class UpgradeAdapter {
return rootScope.$digest();
}
});
rootScope.$on('$destroy', () => { subscription.unsubscribe(); });
rootScope.$on('$destroy', () => {
subscription.unsubscribe();
});
});
})
.catch((e) => this.ng2BootstrapDeferred.reject(e));
@ -629,12 +636,12 @@ export class UpgradeAdapter {
*/
class ParentInjectorPromise {
// TODO(issue/24571): remove '!'.
private injector !: Injector;
private injector!: Injector;
private callbacks: ((injector: Injector) => any)[] = [];
constructor(private element: IAugmentedJQuery) {
// store the promise on the element
element.data !(controllerKey(INJECTOR_KEY), this);
element.data!(controllerKey(INJECTOR_KEY), this);
}
then(callback: (injector: Injector) => any) {
@ -649,10 +656,10 @@ class ParentInjectorPromise {
this.injector = injector;
// reset the element data to point to the real injector
this.element.data !(controllerKey(INJECTOR_KEY), injector);
this.element.data!(controllerKey(INJECTOR_KEY), injector);
// clean out the element to prevent memory leaks
this.element = null !;
this.element = null!;
// run all the queued callbacks
this.callbacks.forEach((callback) => callback(injector));
@ -672,10 +679,10 @@ export class UpgradeAdapterRef {
/* @internal */
private _readyFn: ((upgradeAdapterRef: UpgradeAdapterRef) => void)|null = null;
public ng1RootScope: IRootScopeService = null !;
public ng1Injector: IInjectorService = null !;
public ng2ModuleRef: NgModuleRef<any> = null !;
public ng2Injector: Injector = null !;
public ng1RootScope: IRootScopeService = null!;
public ng1Injector: IInjectorService = null!;
public ng2ModuleRef: NgModuleRef<any> = null!;
public ng2Injector: Injector = null!;
/* @internal */
private _bootstrapDone(ngModuleRef: NgModuleRef<any>, ng1Injector: IInjectorService) {
@ -693,13 +700,15 @@ export class UpgradeAdapterRef {
* The `ready` callback function is invoked inside the Angular zone, therefore it does not
* require a call to `$apply()`.
*/
public ready(fn: (upgradeAdapterRef: UpgradeAdapterRef) => void) { this._readyFn = fn; }
public ready(fn: (upgradeAdapterRef: UpgradeAdapterRef) => void) {
this._readyFn = fn;
}
/**
* Dispose of running hybrid AngularJS / Angular application.
*/
public dispose() {
this.ng1Injector !.get($ROOT_SCOPE).$destroy();
this.ng2ModuleRef !.destroy();
this.ng1Injector!.get($ROOT_SCOPE).$destroy();
this.ng2ModuleRef!.destroy();
}
}

24
packages/upgrade/src/dynamic/src/upgrade_ng1_adapter.ts
View File

@ -23,7 +23,7 @@ const NOT_SUPPORTED: any = 'NOT_SUPPORTED';
export class UpgradeNg1ComponentAdapterBuilder {
// TODO(issue/24571): remove '!'.
type !: Type<any>;
type!: Type<any>;
inputs: string[] = [];
inputsRename: string[] = [];
outputs: string[] = [];
@ -47,7 +47,7 @@ export class UpgradeNg1ComponentAdapterBuilder {
@Directive({jit: true, ...directive})
class MyClass extends UpgradeNg1ComponentAdapter implements OnInit, OnChanges, DoCheck,
OnDestroy {
OnDestroy {
constructor(@Inject($SCOPE) scope: IScope, injector: Injector, elementRef: ElementRef) {
super(
new UpgradeHelper(injector, name, elementRef, self.directive || undefined), scope,
@ -59,13 +59,13 @@ export class UpgradeNg1ComponentAdapterBuilder {
}
extractBindings() {
const btcIsObject = typeof this.directive !.bindToController === 'object';
if (btcIsObject && Object.keys(this.directive !.scope !).length) {
const btcIsObject = typeof this.directive!.bindToController === 'object';
if (btcIsObject && Object.keys(this.directive!.scope!).length) {
throw new Error(
`Binding definitions on scope and controller at the same time are not supported.`);
}
const context = (btcIsObject) ? this.directive !.bindToController : this.directive !.scope;
const context = (btcIsObject) ? this.directive!.bindToController : this.directive!.scope;
if (typeof context == 'object') {
Object.keys(context).forEach(propName => {
@ -208,7 +208,7 @@ class UpgradeNg1ComponentAdapter implements OnInit, OnChanges, DoCheck {
preLink(this.componentScope, this.$element, attrs, requiredControllers, transcludeFn);
}
linkFn(this.componentScope, null !, {parentBoundTranscludeFn: attachChildNodes});
linkFn(this.componentScope, null!, {parentBoundTranscludeFn: attachChildNodes});
if (postLink) {
postLink(this.componentScope, this.$element, attrs, requiredControllers, transcludeFn);
@ -228,8 +228,8 @@ class UpgradeNg1ComponentAdapter implements OnInit, OnChanges, DoCheck {
ng1Changes[this.propertyMap[name]] = change;
});
if (isFunction(this.destinationObj !.$onChanges)) {
this.destinationObj !.$onChanges !(ng1Changes);
if (isFunction(this.destinationObj!.$onChanges)) {
this.destinationObj!.$onChanges!(ng1Changes);
}
}
@ -239,7 +239,7 @@ class UpgradeNg1ComponentAdapter implements OnInit, OnChanges, DoCheck {
const checkProperties = this.checkProperties;
const propOuts = this.propOuts;
checkProperties.forEach((propName, i) => {
const value = destinationObj ![propName];
const value = destinationObj![propName];
const last = lastValues[i];
if (!strictEquals(last, value)) {
const eventEmitter: EventEmitter<any> = (this as any)[propOuts[i]];
@ -252,9 +252,11 @@ class UpgradeNg1ComponentAdapter implements OnInit, OnChanges, DoCheck {
}
}
ngOnDestroy() { this.helper.onDestroy(this.componentScope, this.controllerInstance); }
ngOnDestroy() {
this.helper.onDestroy(this.componentScope, this.controllerInstance);
}
setComponentProperty(name: string, value: any) {
this.destinationObj ![this.propertyMap[name]] = value;
this.destinationObj![this.propertyMap[name]] = value;
}
}

7
packages/upgrade/static/src/downgrade_module.ts
View File

@ -11,7 +11,7 @@ import {platformBrowser} from '@angular/platform-browser';
import {IInjectorService, IProvideService, module_ as angularModule} from '../../src/common/src/angular1';
import {$INJECTOR, $PROVIDE, DOWNGRADED_MODULE_COUNT_KEY, INJECTOR_KEY, LAZY_MODULE_REF, UPGRADE_APP_TYPE_KEY, UPGRADE_MODULE_NAME} from '../../src/common/src/constants';
import {LazyModuleRef, UpgradeAppType, getDowngradedModuleCount, isFunction} from '../../src/common/src/util';
import {getDowngradedModuleCount, isFunction, LazyModuleRef, UpgradeAppType} from '../../src/common/src/util';
import {angular1Providers, setTempInjectorRef} from './angular1_providers';
import {NgAdapterInjector} from './util';
@ -128,9 +128,8 @@ let moduleUid = 0;
*
* @publicApi
*/
export function downgradeModule<T>(
moduleFactoryOrBootstrapFn: NgModuleFactory<T>|
((extraProviders: StaticProvider[]) => Promise<NgModuleRef<T>>)): string {
export function downgradeModule<T>(moduleFactoryOrBootstrapFn: NgModuleFactory<T>|(
(extraProviders: StaticProvider[]) => Promise<NgModuleRef<T>>)): string {
const lazyModuleName = `${UPGRADE_MODULE_NAME}.lazy${++moduleUid}`;
const lazyModuleRefKey = `${LAZY_MODULE_REF}${lazyModuleName}`;
const lazyInjectorKey = `${INJECTOR_KEY}${lazyModuleName}`;

18
packages/upgrade/static/src/upgrade_component.ts
View File

@ -79,18 +79,18 @@ export class UpgradeComponent implements OnInit, OnChanges, DoCheck, OnDestroy {
private bindings: Bindings;
// TODO(issue/24571): remove '!'.
private controllerInstance !: IControllerInstance;
private controllerInstance!: IControllerInstance;
// TODO(issue/24571): remove '!'.
private bindingDestination !: IBindingDestination;
private bindingDestination!: IBindingDestination;
// We will be instantiating the controller in the `ngOnInit` hook, when the
// first `ngOnChanges` will have been already triggered. We store the
// `SimpleChanges` and "play them back" later.
// TODO(issue/24571): remove '!'.
private pendingChanges !: SimpleChanges | null;
private pendingChanges!: SimpleChanges|null;
// TODO(issue/24571): remove '!'.
private unregisterDoCheckWatcher !: Function;
private unregisterDoCheckWatcher!: Function;
/**
* Create a new `UpgradeComponent` instance. You should not normally need to do this.
@ -135,8 +135,8 @@ export class UpgradeComponent implements OnInit, OnChanges, DoCheck, OnDestroy {
if (controllerType) {
this.controllerInstance = this.helper.buildController(controllerType, this.$componentScope);
} else if (bindToController) {
throw new Error(
`Upgraded directive '${this.directive.name}' specifies 'bindToController' but no controller.`);
throw new Error(`Upgraded directive '${
this.directive.name}' specifies 'bindToController' but no controller.`);
}
// Set up outputs
@ -160,7 +160,7 @@ export class UpgradeComponent implements OnInit, OnChanges, DoCheck, OnDestroy {
// Hook: $doCheck
if (this.controllerInstance && isFunction(this.controllerInstance.$doCheck)) {
const callDoCheck = () => this.controllerInstance.$doCheck !();
const callDoCheck = () => this.controllerInstance.$doCheck!();
this.unregisterDoCheckWatcher = this.$componentScope.$parent.$watch(callDoCheck);
callDoCheck();
@ -176,7 +176,7 @@ export class UpgradeComponent implements OnInit, OnChanges, DoCheck, OnDestroy {
preLink(this.$componentScope, this.$element, attrs, requiredControllers, transcludeFn);
}
linkFn(this.$componentScope, null !, {parentBoundTranscludeFn: attachChildNodes});
linkFn(this.$componentScope, null!, {parentBoundTranscludeFn: attachChildNodes});
if (postLink) {
postLink(this.$componentScope, this.$element, attrs, requiredControllers, transcludeFn);
@ -224,7 +224,7 @@ export class UpgradeComponent implements OnInit, OnChanges, DoCheck, OnDestroy {
private initializeBindings(directive: IDirective) {
const btcIsObject = typeof directive.bindToController === 'object';
if (btcIsObject && Object.keys(directive.scope !).length) {
if (btcIsObject && Object.keys(directive.scope!).length) {
throw new Error(
`Binding definitions on scope and controller at the same time is not supported.`);
}

22
packages/upgrade/static/src/upgrade_module.ts
View File

@ -6,11 +6,11 @@
* found in the LICENSE file at https://angular.io/license
*/
import {Injector, NgModule, NgZone, Testability, isDevMode} from '@angular/core';
import {Injector, isDevMode, NgModule, NgZone, Testability} from '@angular/core';
import {IInjectorService, IIntervalService, IProvideService, ITestabilityService, bootstrap, element as angularElement, module_ as angularModule} from '../../src/common/src/angular1';
import {bootstrap, element as angularElement, IInjectorService, IIntervalService, IProvideService, ITestabilityService, module_ as angularModule} from '../../src/common/src/angular1';
import {$$TESTABILITY, $DELEGATE, $INJECTOR, $INTERVAL, $PROVIDE, INJECTOR_KEY, LAZY_MODULE_REF, UPGRADE_APP_TYPE_KEY, UPGRADE_MODULE_NAME} from '../../src/common/src/constants';
import {LazyModuleRef, UpgradeAppType, controllerKey} from '../../src/common/src/util';
import {controllerKey, LazyModuleRef, UpgradeAppType} from '../../src/common/src/util';
import {angular1Providers, setTempInjectorRef} from './angular1_providers';
import {NgAdapterInjector} from './util';
@ -179,7 +179,7 @@ export class UpgradeModule {
.factory(
LAZY_MODULE_REF,
[INJECTOR_KEY, (injector: Injector) => ({ injector } as LazyModuleRef)])
[INJECTOR_KEY, (injector: Injector) => ({injector} as LazyModuleRef)])
.config([
$PROVIDE, $INJECTOR,
@ -225,7 +225,9 @@ export class UpgradeModule {
// $rootScope.$apply, and running the callback in NgZone will
// cause a '$digest already in progress' error if it's in the
// same vm turn.
setTimeout(() => { this.ngZone.run(() => fn(...args)); });
setTimeout(() => {
this.ngZone.run(() => fn(...args));
});
}, delay, count, invokeApply, ...pass);
});
};
@ -248,7 +250,7 @@ export class UpgradeModule {
this.injector.get($INJECTOR);
// Put the injector on the DOM, so that it can be "required"
angularElement(element).data !(controllerKey(INJECTOR_KEY), this.injector);
angularElement(element).data!(controllerKey(INJECTOR_KEY), this.injector);
// Wire up the ng1 rootScope to run a digest cycle whenever the zone settles
// We need to do this in the next tick so that we don't prevent the bootup
@ -267,7 +269,9 @@ export class UpgradeModule {
return $rootScope.$digest();
});
$rootScope.$on('$destroy', () => { subscription.unsubscribe(); });
$rootScope.$on('$destroy', () => {
subscription.unsubscribe();
});
}, 0);
}
]);
@ -279,7 +283,9 @@ export class UpgradeModule {
windowAngular.resumeBootstrap = undefined;
// Bootstrap the AngularJS application inside our zone
this.ngZone.run(() => { bootstrap(element, [upgradeModule.name], config); });
this.ngZone.run(() => {
bootstrap(element, [upgradeModule.name], config);
});
// Patch resumeBootstrap() to run inside the ngZone
if (windowAngular.resumeBootstrap) {

17
packages/upgrade/static/test/integration/change_detection_spec.ts
View File

@ -6,11 +6,11 @@
* found in the LICENSE file at https://angular.io/license
*/
import {Component, Directive, ElementRef, Injector, Input, NgModule, NgZone, SimpleChanges, destroyPlatform} from '@angular/core';
import {Component, destroyPlatform, Directive, ElementRef, Injector, Input, NgModule, NgZone, SimpleChanges} from '@angular/core';
import {async} from '@angular/core/testing';
import {BrowserModule} from '@angular/platform-browser';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {UpgradeComponent, UpgradeModule, downgradeComponent} from '@angular/upgrade/static';
import {downgradeComponent, UpgradeComponent, UpgradeModule} from '@angular/upgrade/static';
import * as angular from '../../../src/common/src/angular1';
import {html, withEachNg1Version} from '../../../src/common/test/helpers/common_test_helpers';
@ -139,7 +139,9 @@ withEachNg1Version(() => {
@Component({selector: 'my-app', template: '<my-child [value]="value"></my-child>'})
class AppComponent {
value?: number;
constructor() { appComponent = this; }
constructor() {
appComponent = this;
}
}
@Component({
@ -149,15 +151,18 @@ withEachNg1Version(() => {
class ChildComponent {
valueFromPromise?: number;
@Input()
set value(v: number) { expect(NgZone.isInAngularZone()).toBe(true); }
set value(v: number) {
expect(NgZone.isInAngularZone()).toBe(true);
}
constructor(private zone: NgZone) {}
ngOnChanges(changes: SimpleChanges) {
if (changes['value'].isFirstChange()) return;
this.zone.onMicrotaskEmpty.subscribe(
() => { expect(element.textContent).toEqual('5'); });
this.zone.onMicrotaskEmpty.subscribe(() => {
expect(element.textContent).toEqual('5');
});
// Create a micro-task to update the value to be rendered asynchronously.
Promise.resolve().then(() => this.valueFromPromise = changes['value'].currentValue);

13
packages/upgrade/static/test/integration/content_projection_spec.ts
View File

@ -6,24 +6,23 @@
* found in the LICENSE file at https://angular.io/license
*/
import {Component, Directive, ElementRef, Injector, Input, NgModule, destroyPlatform} from '@angular/core';
import {Component, destroyPlatform, Directive, ElementRef, Injector, Input, NgModule} from '@angular/core';
import {async} from '@angular/core/testing';
import {BrowserModule} from '@angular/platform-browser';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {UpgradeComponent, UpgradeModule, downgradeComponent} from '@angular/upgrade/static';
import * as angular from '../../../src/common/src/angular1';
import {downgradeComponent, UpgradeComponent, UpgradeModule} from '@angular/upgrade/static';
import * as angular from '../../../src/common/src/angular1';
import {html, multiTrim, withEachNg1Version} from '../../../src/common/test/helpers/common_test_helpers';
import {bootstrap} from './static_test_helpers';
withEachNg1Version(() => {
describe('content projection', () => {
beforeEach(() => destroyPlatform());
afterEach(() => destroyPlatform());
it('should instantiate ng2 in ng1 template and project content', async(() => {
// the ng2 component that will be used in ng1 (downgraded)
@Component({selector: 'ng2', template: `{{ prop }}(<ng-content></ng-content>)`})
class Ng2Component {
@ -62,7 +61,7 @@ withEachNg1Version(() => {
@Component({selector: 'ng2', template: 'ng2-{{ itemId }}(<ng-content></ng-content>)'})
class Ng2Component {
// TODO(issue/24571): remove '!'.
@Input() itemId !: string;
@Input() itemId!: string;
}
@NgModule({
@ -96,7 +95,6 @@ withEachNg1Version(() => {
}));
it('should instantiate ng1 in ng2 template and project content', async(() => {
@Component({
selector: 'ng2',
template: `{{ 'ng2(' }}<ng1>{{ transclude }}</ng1>{{ ')' }}`,
@ -142,7 +140,6 @@ withEachNg1Version(() => {
}));
it('should support multi-slot projection', async(() => {
@Component({
selector: 'ng2',
template: '2a(<ng-content select=".ng1a"></ng-content>)' +

94
packages/upgrade/static/test/integration/downgrade_component_spec.ts
View File

@ -6,19 +6,19 @@
* found in the LICENSE file at https://angular.io/license
*/
import {ChangeDetectionStrategy, Compiler, Component, Directive, ElementRef, EventEmitter, Injector, Input, NgModule, NgModuleRef, OnChanges, OnDestroy, Output, SimpleChanges, destroyPlatform} from '@angular/core';
import {ChangeDetectionStrategy, Compiler, Component, destroyPlatform, Directive, ElementRef, EventEmitter, Injector, Input, NgModule, NgModuleRef, OnChanges, OnDestroy, Output, SimpleChanges} from '@angular/core';
import {async, fakeAsync, tick} from '@angular/core/testing';
import {BrowserModule} from '@angular/platform-browser';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {UpgradeComponent, UpgradeModule, downgradeComponent} from '@angular/upgrade/static';
import * as angular from '../../../src/common/src/angular1';
import {downgradeComponent, UpgradeComponent, UpgradeModule} from '@angular/upgrade/static';
import * as angular from '../../../src/common/src/angular1';
import {html, multiTrim, withEachNg1Version} from '../../../src/common/test/helpers/common_test_helpers';
import {$apply, bootstrap} from './static_test_helpers';
withEachNg1Version(() => {
describe('downgrade ng2 component', () => {
beforeEach(() => destroyPlatform());
afterEach(() => destroyPlatform());
@ -73,8 +73,8 @@ withEachNg1Version(() => {
}
const actualValue = changes[prop].currentValue;
if (actualValue != value) {
throw new Error(
`Expected changes record for'${prop}' to be '${value}' but was '${actualValue}'`);
throw new Error(`Expected changes record for'${prop}' to be '${value}' but was '${
actualValue}'`);
}
};
@ -147,8 +147,9 @@ withEachNg1Version(() => {
}));
it('should bind properties to onpush components', async(() => {
const ng1Module = angular.module_('ng1', []).run(
($rootScope: angular.IScope) => { $rootScope['dataB'] = 'B'; });
const ng1Module = angular.module_('ng1', []).run(($rootScope: angular.IScope) => {
$rootScope['dataB'] = 'B';
});
@Component({
selector: 'ng2',
@ -247,7 +248,9 @@ withEachNg1Version(() => {
@Input() value1 = -1;
@Input() value2 = -1;
constructor() { ng2Component = this; }
constructor() {
ng2Component = this;
}
}
@NgModule({
@ -310,7 +313,9 @@ withEachNg1Version(() => {
@Input() value1 = -1;
@Input() value2 = -1;
constructor() { ng2Component = this; }
constructor() {
ng2Component = this;
}
}
@NgModule({
@ -372,7 +377,9 @@ withEachNg1Version(() => {
@Component({selector: 'ng2', template: '{{ value }}'})
class Ng2Component {
value = 'foo';
constructor() { setTimeout(() => this.value = 'bar', 1000); }
constructor() {
setTimeout(() => this.value = 'bar', 1000);
}
}
@NgModule({
@ -413,9 +420,9 @@ withEachNg1Version(() => {
ngOnChangesCount = 0;
firstChangesCount = 0;
// TODO(issue/24571): remove '!'.
initialValue !: string;
initialValue!: string;
// TODO(issue/24571): remove '!'.
@Input() foo !: string;
@Input() foo!: string;
ngOnChanges(changes: SimpleChanges) {
this.ngOnChangesCount++;
@ -462,8 +469,9 @@ withEachNg1Version(() => {
}));
it('should bind to ng-model', async(() => {
const ng1Module = angular.module_('ng1', []).run(
($rootScope: angular.IScope) => { $rootScope['modelA'] = 'A'; });
const ng1Module = angular.module_('ng1', []).run(($rootScope: angular.IScope) => {
$rootScope['modelA'] = 'A';
});
let ng2Instance: Ng2;
@Component({selector: 'ng2', template: '<span>{{_value}}</span>'})
@ -471,11 +479,21 @@ withEachNg1Version(() => {
private _value: any = '';
private _onChangeCallback: (_: any) => void = () => {};
private _onTouchedCallback: () => void = () => {};
constructor() { ng2Instance = this; }
writeValue(value: any) { this._value = value; }
registerOnChange(fn: any) { this._onChangeCallback = fn; }
registerOnTouched(fn: any) { this._onTouchedCallback = fn; }
doTouch() { this._onTouchedCallback(); }
constructor() {
ng2Instance = this;
}
writeValue(value: any) {
this._value = value;
}
registerOnChange(fn: any) {
this._onChangeCallback = fn;
}
registerOnTouched(fn: any) {
this._onTouchedCallback = fn;
}
doTouch() {
this._onTouchedCallback();
}
doChange(newValue: string) {
this._value = newValue;
this._onChangeCallback(newValue);
@ -517,11 +535,12 @@ withEachNg1Version(() => {
}));
it('should properly run cleanup when ng1 directive is destroyed', async(() => {
let destroyed = false;
@Component({selector: 'ng2', template: 'test'})
class Ng2Component implements OnDestroy {
ngOnDestroy() { destroyed = true; }
ngOnDestroy() {
destroyed = true;
}
}
@NgModule({
@ -533,12 +552,13 @@ withEachNg1Version(() => {
ngDoBootstrap() {}
}
const ng1Module =
angular.module_('ng1', [])
.directive(
'ng1',
() => { return {template: '<div ng-if="!destroyIt"><ng2></ng2></div>'}; })
.directive('ng2', downgradeComponent({component: Ng2Component}));
const ng1Module = angular.module_('ng1', [])
.directive(
'ng1',
() => {
return {template: '<div ng-if="!destroyIt"><ng2></ng2></div>'};
})
.directive('ng2', downgradeComponent({component: Ng2Component}));
const element = html('<ng1></ng1>');
platformBrowserDynamic().bootstrapModule(Ng2Module).then((ref) => {
const adapter = ref.injector.get(UpgradeModule) as UpgradeModule;
@ -567,7 +587,9 @@ withEachNg1Version(() => {
@Component({selector: 'ng2-inner', template: 'test'})
class Ng2InnerComponent implements OnDestroy {
ngOnDestroy() { destroyed = true; }
ngOnDestroy() {
destroyed = true;
}
}
@Directive({selector: 'ng1'})
@ -607,7 +629,6 @@ withEachNg1Version(() => {
it('should work when compiled outside the dom (by fallback to the root ng2.injector)',
async(() => {
@Component({selector: 'ng2', template: 'test'})
class Ng2Component {
}
@ -637,7 +658,7 @@ withEachNg1Version(() => {
// an ng2 injector so it should use the `moduleInjector` instead.
const compiled = $compile('<ng2></ng2>');
const template = compiled($scope);
$element.append !(template);
$element.append!(template);
}
};
}
@ -770,7 +791,9 @@ withEachNg1Version(() => {
@Component({selector: 'ng2', template: ''})
class Ng2Component {
constructor(injector: Injector) { componentInjector = injector; }
constructor(injector: Injector) {
componentInjector = injector;
}
}
@NgModule({
@ -806,12 +829,11 @@ withEachNg1Version(() => {
const modFactory = compiler.compileModuleSync(LazyLoadedModule);
const childMod = modFactory.create(modInjector);
const cmpFactory =
childMod.componentFactoryResolver.resolveComponentFactory(LazyLoadedComponent) !;
childMod.componentFactoryResolver.resolveComponentFactory(LazyLoadedComponent)!;
const lazyCmp = cmpFactory.create(componentInjector);
expect(lazyCmp.instance.module.injector === childMod.injector).toBe(true);
});
}));
it('should throw if `downgradedModule` is specified', async(() => {
@ -836,7 +858,9 @@ withEachNg1Version(() => {
bootstrap(platformBrowserDynamic(), Ng2Module, element, ng1Module)
.then(
() => { throw new Error('Expected bootstraping to fail.'); },
() => {
throw new Error('Expected bootstraping to fail.');
},
err =>
expect(err.message)
.toBe(

134
packages/upgrade/static/test/integration/downgrade_module_spec.ts
View File

@ -6,12 +6,12 @@
* found in the LICENSE file at https://angular.io/license
*/
import {AfterContentChecked, AfterContentInit, AfterViewChecked, AfterViewInit, ApplicationRef, Compiler, Component, Directive, DoCheck, ElementRef, Inject, Injectable, Injector, Input, NgModule, NgZone, OnChanges, OnDestroy, OnInit, StaticProvider, Type, ViewRef, destroyPlatform, getPlatform} from '@angular/core';
import {AfterContentChecked, AfterContentInit, AfterViewChecked, AfterViewInit, ApplicationRef, Compiler, Component, destroyPlatform, Directive, DoCheck, ElementRef, getPlatform, Inject, Injectable, Injector, Input, NgModule, NgZone, OnChanges, OnDestroy, OnInit, StaticProvider, Type, ViewRef} from '@angular/core';
import {async, fakeAsync, tick} from '@angular/core/testing';
import {BrowserModule} from '@angular/platform-browser';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {browserDetection} from '@angular/platform-browser/testing/src/browser_util';
import {UpgradeComponent, downgradeComponent, downgradeModule} from '@angular/upgrade/static';
import {downgradeComponent, downgradeModule, UpgradeComponent} from '@angular/upgrade/static';
import * as angular from '../../../src/common/src/angular1';
import {$EXCEPTION_HANDLER, $ROOT_SCOPE, INJECTOR_KEY, LAZY_MODULE_REF} from '../../../src/common/src/constants';
@ -23,7 +23,6 @@ import {setTempInjectorRef} from '../../src/angular1_providers';
withEachNg1Version(() => {
[true, false].forEach(propagateDigest => {
describe(`lazy-load ng2 module (propagateDigest: ${propagateDigest})`, () => {
beforeEach(() => destroyPlatform());
afterEach(() => destroyPlatform());
@ -65,11 +64,13 @@ withEachNg1Version(() => {
const ng1Module = angular.module_('ng1', [downModA, downModB])
.directive('ng2A', downgradeComponent({
component: Ng2ComponentA,
downgradedModule: downModA, propagateDigest,
downgradedModule: downModA,
propagateDigest,
}))
.directive('ng2B', downgradeComponent({
component: Ng2ComponentB,
downgradedModule: downModB, propagateDigest,
downgradedModule: downModB,
propagateDigest,
}));
const element = html('<ng2-a></ng2-a> | <ng2-b></ng2-b>');
@ -134,11 +135,13 @@ withEachNg1Version(() => {
.directive('ng1A', () => ({template: 'ng1A(<ng2-b ng-if="showB"></ng2-b>)'}))
.directive('ng2A', downgradeComponent({
component: Ng2ComponentA,
downgradedModule: downModA, propagateDigest,
downgradedModule: downModA,
propagateDigest,
}))
.directive('ng2B', downgradeComponent({
component: Ng2ComponentB,
downgradedModule: downModB, propagateDigest,
downgradedModule: downModB,
propagateDigest,
}));
const element = html('<ng2-a></ng2-a>');
@ -206,11 +209,13 @@ withEachNg1Version(() => {
const ng1Module = angular.module_('ng1', [downModA, downModB])
.directive('ng2A', downgradeComponent({
component: Ng2ComponentA,
downgradedModule: downModA, propagateDigest,
downgradedModule: downModA,
propagateDigest,
}))
.directive('ng2B', downgradeComponent({
component: Ng2ComponentB,
downgradedModule: downModB, propagateDigest,
downgradedModule: downModB,
propagateDigest,
}));
const element = html('<ng2-a><ng2-b ng-if="showB"></ng2-b></ng2-a>');
@ -299,11 +304,13 @@ withEachNg1Version(() => {
const ng1Module = angular.module_('ng1', [downModA, downModB])
.directive('ng2A', downgradeComponent({
component: Ng2ComponentA,
downgradedModule: downModA, propagateDigest,
downgradedModule: downModA,
propagateDigest,
}))
.directive('ng2B', downgradeComponent({
component: Ng2ComponentB,
downgradedModule: downModB, propagateDigest,
downgradedModule: downModB,
propagateDigest,
}));
const element = html(`
@ -497,11 +504,13 @@ withEachNg1Version(() => {
const ng1Module = angular.module_('ng1', [downModA, downModB])
.directive('ng2A', downgradeComponent({
component: Ng2ComponentA,
downgradedModule: downModA, propagateDigest,
downgradedModule: downModA,
propagateDigest,
}))
.directive('ng2B', downgradeComponent({
component: Ng2ComponentB,
downgradedModule: downModB, propagateDigest,
downgradedModule: downModB,
propagateDigest,
}));
const element = html(`
@ -599,7 +608,9 @@ withEachNg1Version(() => {
@Component({selector: 'ng2', template: '{{ value }}'})
class Ng2Component {
value: string;
constructor(ng2Service: Ng2Service) { this.value = ng2Service.getValue(); }
constructor(ng2Service: Ng2Service) {
this.value = ng2Service.getValue();
}
}
@NgModule({
@ -651,7 +662,9 @@ withEachNg1Version(() => {
@Component({selector: 'ng2', template: 'In the zone: {{ inTheZone }}'})
class Ng2Component {
private inTheZone = false;
constructor() { this.inTheZone = NgZone.isInAngularZone(); }
constructor() {
this.inTheZone = NgZone.isInAngularZone();
}
}
@NgModule({
@ -686,7 +699,9 @@ withEachNg1Version(() => {
@Component({selector: 'ng2', template: ''})
class Ng2Component implements OnDestroy {
ngOnDestroy() { destroyedInTheZone = NgZone.isInAngularZone(); }
ngOnDestroy() {
destroyedInTheZone = NgZone.isInAngularZone();
}
}
@NgModule({
@ -725,7 +740,9 @@ withEachNg1Version(() => {
@Input() attrInput = 'foo';
@Input() propInput = 'foo';
constructor() { ng2Component = this; }
constructor() {
ng2Component = this;
}
ngOnChanges() {}
}
@ -785,8 +802,12 @@ withEachNg1Version(() => {
template: '',
})
class TestComponent implements OnDestroy {
constructor() { createdInTheZone = NgZone.isInAngularZone(); }
ngOnDestroy() { destroyedInTheZone = NgZone.isInAngularZone(); }
constructor() {
createdInTheZone = NgZone.isInAngularZone();
}
ngOnDestroy() {
destroyedInTheZone = NgZone.isInAngularZone();
}
}
@Component({
@ -842,7 +863,9 @@ withEachNg1Version(() => {
{selector: 'ng2', template: '{{ count }}<button (click)="increment()"></button>'})
class Ng2Component {
private count = 0;
increment() { ++this.count; }
increment() {
++this.count;
}
}
@NgModule({
@ -867,7 +890,7 @@ withEachNg1Version(() => {
setTimeout(() => { // Wait for the module to be bootstrapped.
setTimeout(() => { // Wait for `$evalAsync()` to propagate inputs.
const button = element.querySelector('button') !;
const button = element.querySelector('button')!;
expect(element.textContent).toBe('0');
button.click();
@ -885,7 +908,9 @@ withEachNg1Version(() => {
{selector: 'test', template: '{{ count }}<button (click)="increment()"></button>'})
class TestComponent {
count = 0;
increment() { ++this.count; }
increment() {
++this.count;
}
}
@Component({
@ -924,7 +949,7 @@ withEachNg1Version(() => {
setTimeout(() => {
// Create nested component asynchronously.
$rootScope.$apply('showNg2 = true');
const button = element.querySelector('button') !;
const button = element.querySelector('button')!;
expect(element.textContent).toBe('0');
@ -948,21 +973,38 @@ withEachNg1Version(() => {
<ng-content></ng-content>
`
})
class Ng2Component implements AfterContentChecked,
AfterContentInit, AfterViewChecked, AfterViewInit, DoCheck, OnChanges, OnDestroy,
OnInit {
class Ng2Component implements AfterContentChecked, AfterContentInit, AfterViewChecked,
AfterViewInit, DoCheck, OnChanges, OnDestroy, OnInit {
@Input() value = 'foo';
ngAfterContentChecked() { this.log('AfterContentChecked'); }
ngAfterContentInit() { this.log('AfterContentInit'); }
ngAfterViewChecked() { this.log('AfterViewChecked'); }
ngAfterViewInit() { this.log('AfterViewInit'); }
ngDoCheck() { this.log('DoCheck'); }
ngOnChanges() { this.log('OnChanges'); }
ngOnDestroy() { this.log('OnDestroy'); }
ngOnInit() { this.log('OnInit'); }
ngAfterContentChecked() {
this.log('AfterContentChecked');
}
ngAfterContentInit() {
this.log('AfterContentInit');
}
ngAfterViewChecked() {
this.log('AfterViewChecked');
}
ngAfterViewInit() {
this.log('AfterViewInit');
}
ngDoCheck() {
this.log('DoCheck');
}
ngOnChanges() {
this.log('OnChanges');
}
ngOnDestroy() {
this.log('OnDestroy');
}
ngOnInit() {
this.log('OnInit');
}
private log(hook: string) { logs.push(`${hook}(${this.value})`); }
private log(hook: string) {
logs.push(`${hook}(${this.value})`);
}
}
@NgModule({
@ -991,7 +1033,7 @@ withEachNg1Version(() => {
setTimeout(() => { // Wait for the module to be bootstrapped.
setTimeout(() => { // Wait for `$evalAsync()` to propagate inputs.
const button = element.querySelector('button') !;
const button = element.querySelector('button')!;
// Once initialized.
expect(multiTrim(element.textContent)).toBe('bar Content');
@ -1154,7 +1196,9 @@ withEachNg1Version(() => {
class Ng2Component {
private count = ++count;
private inTheZone = false;
constructor() { this.inTheZone = NgZone.isInAngularZone(); }
constructor() {
this.inTheZone = NgZone.isInAngularZone();
}
}
@NgModule({
@ -1190,7 +1234,7 @@ withEachNg1Version(() => {
tick(tickDelay); // Wait for the module to be bootstrapped and `$evalAsync()` to
// propagate inputs.
const injector = ($injector.get(LAZY_MODULE_REF) as LazyModuleRef).injector !;
const injector = ($injector.get(LAZY_MODULE_REF) as LazyModuleRef).injector!;
const injectorGet = injector.get;
spyOn(injector, 'get').and.callFake((...args: [any, any?]) => {
expect(args[0]).not.toBe(NgZone);
@ -1295,14 +1339,15 @@ withEachNg1Version(() => {
// If the bootstrap process for other components/modules is not completed in time, there is
// a chance that some global state is retained, possibly messing subsequent tests.
// Explicitly clean up after each test to prevent that.
afterEach(() => setTempInjectorRef(null !));
afterEach(() => setTempInjectorRef(null!));
it('should throw if no downgraded module is included', async(() => {
const ng1Module = angular.module_('ng1', [])
.value($EXCEPTION_HANDLER, errorSpy)
.directive('ng2A', downgradeComponent({
component: Ng2CompA,
downgradedModule: downModA, propagateDigest,
downgradedModule: downModA,
propagateDigest,
}))
.directive('ng2B', downgradeComponent({
component: Ng2CompB,
@ -1334,11 +1379,13 @@ withEachNg1Version(() => {
.value($EXCEPTION_HANDLER, errorSpy)
.directive('ng2A', downgradeComponent({
component: Ng2CompA,
downgradedModule: downModA, propagateDigest,
downgradedModule: downModA,
propagateDigest,
}))
.directive('ng2B', downgradeComponent({
component: Ng2CompB,
downgradedModule: downModB, propagateDigest,
downgradedModule: downModB,
propagateDigest,
}));
const element = html('<ng2-a></ng2-a> | <ng2-b></ng2-b>');
@ -1360,7 +1407,8 @@ withEachNg1Version(() => {
.value($EXCEPTION_HANDLER, errorSpy)
.directive('ng2A', downgradeComponent({
component: Ng2CompA,
downgradedModule: downModA, propagateDigest,
downgradedModule: downModA,
propagateDigest,
}))
.directive('ng2B', downgradeComponent({
component: Ng2CompB,

10
packages/upgrade/static/test/integration/examples_spec.ts
View File

@ -6,11 +6,11 @@
* found in the LICENSE file at https://angular.io/license
*/
import {Component, Directive, ElementRef, Injector, Input, NgModule, destroyPlatform} from '@angular/core';
import {Component, destroyPlatform, Directive, ElementRef, Injector, Input, NgModule} from '@angular/core';
import {async} from '@angular/core/testing';
import {BrowserModule} from '@angular/platform-browser';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {UpgradeComponent, UpgradeModule, downgradeComponent} from '@angular/upgrade/static';
import {downgradeComponent, UpgradeComponent, UpgradeModule} from '@angular/upgrade/static';
import * as angular from '../../../src/common/src/angular1';
import {html, multiTrim, withEachNg1Version} from '../../../src/common/test/helpers/common_test_helpers';
@ -19,7 +19,6 @@ import {bootstrap} from './static_test_helpers';
withEachNg1Version(() => {
describe('examples', () => {
beforeEach(() => destroyPlatform());
afterEach(() => destroyPlatform());
@ -27,13 +26,12 @@ withEachNg1Version(() => {
() => expect(angular.getAngularJSGlobal().version.major).toBe(1));
it('should verify UpgradeAdapter example', async(() => {
// This is wrapping (upgrading) an AngularJS component to be used in an Angular
// component
@Directive({selector: 'ng1'})
class Ng1Component extends UpgradeComponent {
// TODO(issue/24571): remove '!'.
@Input() title !: string;
@Input() title!: string;
constructor(elementRef: ElementRef, injector: Injector) {
super('ng1', elementRef, injector);
@ -47,7 +45,7 @@ withEachNg1Version(() => {
})
class Ng2Component {
// TODO(issue/24571): remove '!'.
@Input('name') nameProp !: string;
@Input('name') nameProp!: string;
}
// This module represents the Angular pieces of the application

5
packages/upgrade/static/test/integration/injection_spec.ts
View File

@ -6,7 +6,7 @@
* found in the LICENSE file at https://angular.io/license
*/
import {InjectionToken, Injector, NgModule, destroyPlatform} from '@angular/core';
import {destroyPlatform, InjectionToken, Injector, NgModule} from '@angular/core';
import {async} from '@angular/core/testing';
import {BrowserModule} from '@angular/platform-browser';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
@ -14,13 +14,12 @@ import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import * as angular from '../../../src/common/src/angular1';
import {$INJECTOR, INJECTOR_KEY} from '../../../src/common/src/constants';
import {html, withEachNg1Version} from '../../../src/common/test/helpers/common_test_helpers';
import {UpgradeModule, downgradeInjectable, getAngularJSGlobal, setAngularJSGlobal} from '../../index';
import {downgradeInjectable, getAngularJSGlobal, setAngularJSGlobal, UpgradeModule} from '../../index';
import {bootstrap} from './static_test_helpers';
withEachNg1Version(() => {
describe('injection', () => {
beforeEach(() => destroyPlatform());
afterEach(() => destroyPlatform());

4
packages/upgrade/static/test/integration/static_test_helpers.ts
View File

@ -19,7 +19,9 @@ export function bootstrap(
const ngZone = ref.injector.get<NgZone>(NgZone);
const upgrade = ref.injector.get(UpgradeModule);
const failHardModule: any = ($provide: angular.IProvideService) => {
$provide.value($EXCEPTION_HANDLER, (err: any) => { throw err; });
$provide.value($EXCEPTION_HANDLER, (err: any) => {
throw err;
});
};
// The `bootstrap()` helper is used for convenience in tests, so that we don't have to inject

27
packages/upgrade/static/test/integration/testability_spec.ts
View File

@ -6,20 +6,20 @@
* found in the LICENSE file at https://angular.io/license
*/
import {NgModule, Testability, destroyPlatform} from '@angular/core';
import {destroyPlatform, NgModule, Testability} from '@angular/core';
import {NgZone} from '@angular/core/src/zone/ng_zone';
import {fakeAsync, flush, tick} from '@angular/core/testing';
import {BrowserModule} from '@angular/platform-browser';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {UpgradeModule} from '@angular/upgrade/static';
import * as angular from '../../../src/common/src/angular1';
import * as angular from '../../../src/common/src/angular1';
import {html, withEachNg1Version} from '../../../src/common/test/helpers/common_test_helpers';
import {bootstrap} from './static_test_helpers';
withEachNg1Version(() => {
describe('testability', () => {
beforeEach(() => destroyPlatform());
afterEach(() => destroyPlatform());
@ -30,7 +30,7 @@ withEachNg1Version(() => {
it('should handle deferred bootstrap', fakeAsync(() => {
let applicationRunning = false;
let stayedInTheZone: boolean = undefined !;
let stayedInTheZone: boolean = undefined!;
const ng1Module = angular.module_('ng1', []).run(() => {
applicationRunning = true;
stayedInTheZone = NgZone.isInAngularZone();
@ -41,7 +41,9 @@ withEachNg1Version(() => {
bootstrap(platformBrowserDynamic(), Ng2Module, element, ng1Module);
setTimeout(() => { (<any>window).angular.resumeBootstrap(); }, 100);
setTimeout(() => {
(<any>window).angular.resumeBootstrap();
}, 100);
expect(applicationRunning).toEqual(false);
tick(100);
@ -53,7 +55,10 @@ withEachNg1Version(() => {
const ng1Module = angular.module_('ng1', []);
let a1Injector: angular.IInjectorService|undefined;
ng1Module.run([
'$injector', function($injector: angular.IInjectorService) { a1Injector = $injector; }
'$injector',
function($injector: angular.IInjectorService) {
a1Injector = $injector;
}
]);
const element = html('<div></div>');
window.name = 'NG_DEFER_BOOTSTRAP!' + window.name;
@ -73,13 +78,14 @@ withEachNg1Version(() => {
const element = html('<div></div>');
bootstrap(platformBrowserDynamic(), Ng2Module, element, ng1Module).then((upgrade) => {
const ng2Testability: Testability = upgrade.injector.get(Testability);
ng2Testability.increasePendingRequestCount();
let ng2Stable = false;
let ng1Stable = false;
angular.getTestability(element).whenStable(() => { ng1Stable = true; });
angular.getTestability(element).whenStable(() => {
ng1Stable = true;
});
setTimeout(() => {
ng2Stable = true;
@ -99,7 +105,6 @@ withEachNg1Version(() => {
const element = html('<div></div>');
bootstrap(platformBrowserDynamic(), Ng2Module, element, ng1Module).then((upgrade) => {
const ng2Testability: Testability = upgrade.injector.get(Testability);
const $interval: angular.IIntervalService = upgrade.$injector.get('$interval');
@ -115,7 +120,9 @@ withEachNg1Version(() => {
expect(arg).toEqual('passed argument');
}, 200, 0, true, 'passed argument');
ng2Testability.whenStable(() => { ng2Stable = true; });
ng2Testability.whenStable(() => {
ng2Stable = true;
});
tick(100);

418
packages/upgrade/static/test/integration/upgrade_component_spec.ts
View File

@ -6,7 +6,7 @@
* found in the LICENSE file at https://angular.io/license
*/
import {Component, Directive, ElementRef, EventEmitter, Inject, Injector, Input, NO_ERRORS_SCHEMA, NgModule, Output, SimpleChanges, destroyPlatform} from '@angular/core';
import {Component, destroyPlatform, Directive, ElementRef, EventEmitter, Inject, Injector, Input, NgModule, NO_ERRORS_SCHEMA, Output, SimpleChanges} from '@angular/core';
import {async, fakeAsync, tick} from '@angular/core/testing';
import {BrowserModule} from '@angular/platform-browser';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
@ -14,14 +14,13 @@ import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import * as angular from '../../../src/common/src/angular1';
import {$EXCEPTION_HANDLER, $SCOPE} from '../../../src/common/src/constants';
import {html, multiTrim, withEachNg1Version} from '../../../src/common/test/helpers/common_test_helpers';
import {UpgradeComponent, UpgradeModule, downgradeComponent} from '../../index';
import {downgradeComponent, UpgradeComponent, UpgradeModule} from '../../index';
import {$digest, bootstrap} from './static_test_helpers';
withEachNg1Version(() => {
describe('upgrade ng1 component', () => {
beforeEach(() => destroyPlatform());
afterEach(() => destroyPlatform());
@ -319,7 +318,7 @@ withEachNg1Version(() => {
'$httpBackend',
(method: string, url: string, post?: any, callback?: Function) =>
setTimeout(
() => callback !(200, `${method}:${url}`.toLowerCase()), 1000));
() => callback!(200, `${method}:${url}`.toLowerCase()), 1000));
// Define `Ng2Module`
@NgModule({
@ -370,7 +369,7 @@ withEachNg1Version(() => {
'$httpBackend',
(method: string, url: string, post?: any, callback?: Function) =>
setTimeout(
() => callback !(200, `${method}:${url}`.toLowerCase()), 1000));
() => callback!(200, `${method}:${url}`.toLowerCase()), 1000));
// Define `Ng2Module`
@NgModule({
@ -404,19 +403,27 @@ withEachNg1Version(() => {
// Define `Ng1ComponentFacade`s
@Directive({selector: 'ng1A'})
class Ng1ComponentAFacade extends UpgradeComponent {
constructor(e: ElementRef, i: Injector) { super('ng1A', e, i); }
constructor(e: ElementRef, i: Injector) {
super('ng1A', e, i);
}
}
@Directive({selector: 'ng1B'})
class Ng1ComponentBFacade extends UpgradeComponent {
constructor(e: ElementRef, i: Injector) { super('ng1B', e, i); }
constructor(e: ElementRef, i: Injector) {
super('ng1B', e, i);
}
}
@Directive({selector: 'ng1C'})
class Ng1ComponentCFacade extends UpgradeComponent {
constructor(e: ElementRef, i: Injector) { super('ng1C', e, i); }
constructor(e: ElementRef, i: Injector) {
super('ng1C', e, i);
}
}
@Directive({selector: 'ng1D'})
class Ng1ComponentDFacade extends UpgradeComponent {
constructor(e: ElementRef, i: Injector) { super('ng1D', e, i); }
constructor(e: ElementRef, i: Injector) {
super('ng1D', e, i);
}
}
// Define `Ng2Component`
@ -480,9 +487,9 @@ withEachNg1Version(() => {
@Directive({selector: 'ng1'})
class Ng1ComponentFacade extends UpgradeComponent {
// TODO(issue/24571): remove '!'.
@Input('inputAttrA') inputA !: string;
@Input('inputAttrA') inputA!: string;
// TODO(issue/24571): remove '!'.
@Input() inputB !: string;
@Input() inputB!: string;
constructor(elementRef: ElementRef, injector: Injector) {
super('ng1', elementRef, injector);
@ -501,7 +508,9 @@ withEachNg1Version(() => {
dataA = 'foo';
dataB = 'bar';
constructor() { ng2ComponentInstance = this; }
constructor() {
ng2ComponentInstance = this;
}
}
// Define `ng1Module`
@ -523,8 +532,8 @@ withEachNg1Version(() => {
const element = html(`<ng2></ng2>`);
bootstrap(platformBrowserDynamic(), Ng2Module, element, ng1Module).then(adapter => {
const ng1 = element.querySelector('ng1') !;
const ng1Controller = angular.element(ng1).controller !('ng1');
const ng1 = element.querySelector('ng1')!;
const ng1Controller = angular.element(ng1).controller!('ng1');
expect(multiTrim(element.textContent)).toBe('Inside: foo, bar | Outside: foo, bar');
@ -557,9 +566,9 @@ withEachNg1Version(() => {
@Directive({selector: 'ng1'})
class Ng1ComponentFacade extends UpgradeComponent {
// TODO(issue/24571): remove '!'.
@Input('inputAttrA') inputA !: string;
@Input('inputAttrA') inputA!: string;
// TODO(issue/24571): remove '!'.
@Input() inputB !: string;
@Input() inputB!: string;
constructor(elementRef: ElementRef, injector: Injector) {
super('ng1', elementRef, injector);
@ -578,7 +587,9 @@ withEachNg1Version(() => {
dataA = {value: 'foo'};
dataB = {value: 'bar'};
constructor() { ng2ComponentInstance = this; }
constructor() {
ng2ComponentInstance = this;
}
}
// Define `ng1Module`
@ -600,8 +611,8 @@ withEachNg1Version(() => {
const element = html(`<ng2></ng2>`);
bootstrap(platformBrowserDynamic(), Ng2Module, element, ng1Module).then(adapter => {
const ng1 = element.querySelector('ng1') !;
const ng1Controller = angular.element(ng1).controller !('ng1');
const ng1 = element.querySelector('ng1')!;
const ng1Controller = angular.element(ng1).controller!('ng1');
expect(multiTrim(element.textContent)).toBe('Inside: foo, bar | Outside: foo, bar');
@ -634,13 +645,13 @@ withEachNg1Version(() => {
@Directive({selector: 'ng1'})
class Ng1ComponentFacade extends UpgradeComponent {
// TODO(issue/24571): remove '!'.
@Input('inputAttrA') inputA !: string;
@Input('inputAttrA') inputA!: string;
// TODO(issue/24571): remove '!'.
@Output('inputAttrAChange') inputAChange !: EventEmitter<any>;
@Output('inputAttrAChange') inputAChange!: EventEmitter<any>;
// TODO(issue/24571): remove '!'.
@Input() inputB !: string;
@Input() inputB!: string;
// TODO(issue/24571): remove '!'.
@Output() inputBChange !: EventEmitter<any>;
@Output() inputBChange!: EventEmitter<any>;
constructor(elementRef: ElementRef, injector: Injector) {
super('ng1', elementRef, injector);
@ -659,7 +670,9 @@ withEachNg1Version(() => {
dataA = {value: 'foo'};
dataB = {value: 'bar'};
constructor() { ng2ComponentInstance = this; }
constructor() {
ng2ComponentInstance = this;
}
}
// Define `ng1Module`
@ -681,8 +694,8 @@ withEachNg1Version(() => {
const element = html(`<ng2></ng2>`);
bootstrap(platformBrowserDynamic(), Ng2Module, element, ng1Module).then(adapter => {
const ng1 = element.querySelector('ng1') !;
const ng1Controller = angular.element(ng1).controller !('ng1');
const ng1 = element.querySelector('ng1')!;
const ng1Controller = angular.element(ng1).controller!('ng1');
expect(multiTrim(element.textContent)).toBe('Inside: foo, bar | Outside: foo, bar');
@ -713,9 +726,9 @@ withEachNg1Version(() => {
@Directive({selector: 'ng1'})
class Ng1ComponentFacade extends UpgradeComponent {
// TODO(issue/24571): remove '!'.
@Output('outputAttrA') outputA !: EventEmitter<any>;
@Output('outputAttrA') outputA!: EventEmitter<any>;
// TODO(issue/24571): remove '!'.
@Output() outputB !: EventEmitter<any>;
@Output() outputB!: EventEmitter<any>;
constructor(elementRef: ElementRef, injector: Injector) {
super('ng1', elementRef, injector);
@ -754,8 +767,8 @@ withEachNg1Version(() => {
const element = html(`<ng2></ng2>`);
bootstrap(platformBrowserDynamic(), Ng2Module, element, ng1Module).then(() => {
const ng1 = element.querySelector('ng1') !;
const ng1Controller = angular.element(ng1).controller !('ng1');
const ng1 = element.querySelector('ng1')!;
const ng1Controller = angular.element(ng1).controller!('ng1');
expect(multiTrim(element.textContent)).toBe('Inside: - | Outside: foo, bar');
@ -797,16 +810,16 @@ withEachNg1Version(() => {
@Directive({selector: 'ng1'})
class Ng1ComponentFacade extends UpgradeComponent {
// TODO(issue/24571): remove '!'.
@Input() fullName !: string;
@Input() fullName!: string;
@Input('dataA') modelA: any;
@Input('dataB') modelB: any;
// TODO(issue/24571): remove '!'.
@Output('dataBChange') modelBChange !: EventEmitter<any>;
@Output('dataBChange') modelBChange!: EventEmitter<any>;
@Input() modelC: any;
// TODO(issue/24571): remove '!'.
@Output() modelCChange !: EventEmitter<any>;
@Output() modelCChange!: EventEmitter<any>;
// TODO(issue/24571): remove '!'.
@Output() event !: EventEmitter<any>;
@Output() event!: EventEmitter<any>;
constructor(elementRef: ElementRef, injector: Injector) {
super('ng1', elementRef, injector);
@ -880,17 +893,17 @@ withEachNg1Version(() => {
@Directive({selector: 'ng1'})
class Ng1ComponentFacade extends UpgradeComponent {
// TODO(issue/24571): remove '!'.
@Input('inputAttrA') inputA !: string;
@Input('inputAttrA') inputA!: string;
// TODO(issue/24571): remove '!'.
@Output('inputAttrAChange') inputAChange !: EventEmitter<any>;
@Output('inputAttrAChange') inputAChange!: EventEmitter<any>;
// TODO(issue/24571): remove '!'.
@Input() inputB !: string;
@Input() inputB!: string;
// TODO(issue/24571): remove '!'.
@Output() inputBChange !: EventEmitter<any>;
@Output() inputBChange!: EventEmitter<any>;
// TODO(issue/24571): remove '!'.
@Output('outputAttrA') outputA !: EventEmitter<any>;
@Output('outputAttrA') outputA!: EventEmitter<any>;
// TODO(issue/24571): remove '!'.
@Output() outputB !: EventEmitter<any>;
@Output() outputB!: EventEmitter<any>;
constructor(elementRef: ElementRef, injector: Injector) {
super('ng1', elementRef, injector);
@ -912,7 +925,9 @@ withEachNg1Version(() => {
dataA = {value: 'foo'};
dataB = {value: 'bar'};
updateDataB(value: any) { this.dataB.value = value; }
updateDataB(value: any) {
this.dataB.value = value;
}
}
// Define `ng1Module`
@ -934,10 +949,10 @@ withEachNg1Version(() => {
const element = html(`<ng2></ng2>`);
bootstrap(platformBrowserDynamic(), Ng2Module, element, ng1Module).then(adapter => {
const ng1s = element.querySelectorAll('ng1') !;
const ng1Controller0 = angular.element(ng1s[0]).controller !('ng1');
const ng1Controller1 = angular.element(ng1s[1]).controller !('ng1');
const ng1Controller2 = angular.element(ng1s[2]).controller !('ng1');
const ng1s = element.querySelectorAll('ng1')!;
const ng1Controller0 = angular.element(ng1s[0]).controller!('ng1');
const ng1Controller1 = angular.element(ng1s[1]).controller!('ng1');
const ng1Controller2 = angular.element(ng1s[2]).controller!('ng1');
expect(multiTrim(element.textContent))
.toBe(
@ -981,11 +996,11 @@ withEachNg1Version(() => {
@Directive({selector: '[ng1]'})
class Ng1ComponentFacade extends UpgradeComponent {
// TODO(issue/24571): remove '!'.
@Input() inputA !: string;
@Input() inputA!: string;
// TODO(issue/24571): remove '!'.
@Output() inputAChange !: EventEmitter<any>;
@Output() inputAChange!: EventEmitter<any>;
// TODO(issue/24571): remove '!'.
@Output() outputA !: EventEmitter<any>;
@Output() outputA!: EventEmitter<any>;
constructor(elementRef: ElementRef, injector: Injector) {
super('ng1', elementRef, injector);
@ -1024,8 +1039,8 @@ withEachNg1Version(() => {
const element = html(`<ng2></ng2>`);
bootstrap(platformBrowserDynamic(), Ng2Module, element, ng1Module).then(adapter => {
const ng1 = element.querySelector('[ng1]') !;
const ng1Controller = angular.element(ng1).controller !('ng1');
const ng1 = element.querySelector('[ng1]')!;
const ng1Controller = angular.element(ng1).controller!('ng1');
expect(multiTrim(element.textContent))
.toBe('ng1 - Data: [1,2,3] - Length: 3 | ng2 - Data: 1,2,3 - Length: 3');
@ -1055,7 +1070,7 @@ withEachNg1Version(() => {
const ng1ComponentA: angular.IComponent = {template: 'ng1A(<ng1-b></ng1-b>)'};
const ng1DirectiveB: angular.IDirective = {
compile: tElem => {
grandParentNodeName = tElem.parent !().parent !()[0].nodeName;
grandParentNodeName = tElem.parent!().parent!()[0].nodeName;
return {};
}
};
@ -1106,7 +1121,11 @@ withEachNg1Version(() => {
const ng1Directive: angular.IDirective = {
template: '',
link: {pre: () => log.push('ng1-pre')},
controller: class {constructor() { log.push('ng1-ctrl'); }}
controller: class {
constructor() {
log.push('ng1-ctrl');
}
}
};
// Define `Ng1ComponentFacade`
@ -1296,7 +1315,11 @@ withEachNg1Version(() => {
const ng1Directive: angular.IDirective = {
template: '',
link: () => log.push('ng1-post'),
controller: class {$postLink() { log.push('ng1-$post'); }}
controller: class {
$postLink() {
log.push('ng1-$post');
}
}
};
// Define `Ng1ComponentFacade`
@ -1346,7 +1369,7 @@ withEachNg1Version(() => {
controllerAs: 'vm',
controller: class {
hasElement: string; // TODO(issue/24571): remove '!'.
isClass !: string;
isClass!: string;
scope: string;
constructor(public $element: angular.IAugmentedJQuery, $scope: angular.IScope) {
@ -1357,10 +1380,12 @@ withEachNg1Version(() => {
}
isPublished() {
return this.$element.controller !('ng1') === this ? 'published' : 'not-published';
return this.$element.controller!('ng1') === this ? 'published' : 'not-published';
}
verifyIAmAClass() { this.isClass = 'isClass'; }
verifyIAmAClass() {
this.isClass = 'isClass';
}
}
};
@ -1422,7 +1447,7 @@ withEachNg1Version(() => {
@Directive({selector: 'ng1A'})
class Ng1ComponentAFacade extends UpgradeComponent {
// TODO(issue/24571): remove '!'.
@Input() title !: string;
@Input() title!: string;
constructor(elementRef: ElementRef, injector: Injector) {
super('ng1A', elementRef, injector);
@ -1432,7 +1457,7 @@ withEachNg1Version(() => {
@Directive({selector: 'ng1B'})
class Ng1ComponentBFacade extends UpgradeComponent {
// TODO(issue/24571): remove '!'.
@Input() title !: string;
@Input() title!: string;
constructor(elementRef: ElementRef, injector: Injector) {
super('ng1B', elementRef, injector);
@ -1490,7 +1515,7 @@ withEachNg1Version(() => {
@Directive({selector: 'ng1'})
class Ng1ComponentFacade extends UpgradeComponent {
// TODO(issue/24571): remove '!'.
@Input() title !: string;
@Input() title!: string;
constructor(elementRef: ElementRef, injector: Injector) {
super('ng1', elementRef, injector);
@ -1540,7 +1565,7 @@ withEachNg1Version(() => {
@Directive({selector: 'ng1'})
class Ng1ComponentFacade extends UpgradeComponent {
// TODO(issue/24571): remove '!'.
@Input() title !: string;
@Input() title!: string;
constructor(elementRef: ElementRef, injector: Injector) {
super('ng1', elementRef, injector);
@ -1554,7 +1579,11 @@ withEachNg1Version(() => {
// Define `ng1Module`
const ng1Module = angular.module_('ng1Module', [])
.controller('Ng1Controller', class { text = 'GREAT'; })
.controller(
'Ng1Controller',
class {
text = 'GREAT';
})
.directive('ng1', () => ng1Directive)
.directive('ng2', downgradeComponent({component: Ng2Component}));
@ -1587,7 +1616,7 @@ withEachNg1Version(() => {
name = 'world';
constructor($element: angular.IAugmentedJQuery) {
getCurrentContent = () => $element.text !();
getCurrentContent = () => $element.text!();
compiledContent = getCurrentContent();
}
}
@ -1638,7 +1667,9 @@ withEachNg1Version(() => {
// Define `ng1Directive`
const ng1Directive: angular.IDirective = {
template: 'Pre: {{ pre }} | Post: {{ post }}',
controller: class {value = 'foo';},
controller: class {
value = 'foo';
},
link: {
pre: function(scope: any, elem: any, attrs: any, ctrl: any) {
scope['pre'] = ctrl.value;
@ -1693,7 +1724,9 @@ withEachNg1Version(() => {
// Define `ng1Component`
const ng1ComponentA: angular.IComponent = {
template: '<ng1-b></ng1-b>',
controller: class {value = 'ng1A';}
controller: class {
value = 'ng1A';
}
};
const ng1ComponentB: angular.IComponent = {
@ -1881,7 +1914,9 @@ withEachNg1Version(() => {
// Define `ng1Component`
const ng1ComponentA: angular.IComponent = {
template: 'ng1A(<div><ng2></ng2></div>)',
controller: class {value = 'A';}
controller: class {
value = 'A';
}
};
const ng1ComponentB: angular.IComponent = {
@ -1957,7 +1992,9 @@ withEachNg1Version(() => {
// Define `ng1Component`
const ng1ComponentA: angular.IComponent = {
template: 'ng1A(<div><ng2></ng2></div>)',
controller: class {value = 'A';}
controller: class {
value = 'A';
}
};
const ng1ComponentB: angular.IComponent = {
@ -1977,7 +2014,9 @@ withEachNg1Version(() => {
ng1BSelfUp: '^ng1B',
ng1BParentUp: '?^^ng1B',
},
controller: class {value = 'B';}
controller: class {
value = 'B';
}
};
// Define `Ng1ComponentFacade`
@ -2023,7 +2062,9 @@ withEachNg1Version(() => {
// Define `ng1Component`
const ng1ComponentA: angular.IComponent = {
template: '<ng2></ng2>',
controller: class {value = 'ng1A';}
controller: class {
value = 'ng1A';
}
};
const ng1ComponentB: angular.IComponent = {
@ -2078,11 +2119,17 @@ withEachNg1Version(() => {
// Define `ng1Component`
const ng1ComponentA: angular.IComponent = {
template: '<ng1-b></ng1-b>',
controller: class {value = 'A';}
controller: class {
value = 'A';
}
};
const ng1ComponentB:
angular.IComponent = {template: '<ng2></ng2>', controller: class {value = 'B';}};
const ng1ComponentB: angular.IComponent = {
template: '<ng2></ng2>',
controller: class {
value = 'B';
}
};
const ng1ComponentC: angular.IComponent = {
template:
@ -2092,7 +2139,9 @@ withEachNg1Version(() => {
ng1B: '?^',
ng1C: '',
},
controller: class {value = 'C';}
controller: class {
value = 'C';
}
};
// Define `Ng1ComponentFacade`
@ -2160,13 +2209,17 @@ withEachNg1Version(() => {
class Ng2ComponentA {
value = 'foo';
showB = false;
constructor() { ng2ComponentAInstance = this; }
constructor() {
ng2ComponentAInstance = this;
}
}
@Component({selector: 'ng2B', template: 'ng2B({{ value }})'})
class Ng2ComponentB {
value = 'bar';
constructor() { ng2ComponentBInstance = this; }
constructor() {
ng2ComponentBInstance = this;
}
}
// Define `ng1Module`
@ -2211,8 +2264,12 @@ withEachNg1Version(() => {
const ng1Component: angular.IComponent = {
template: 'ng1(<div ng-transclude>{{ $ctrl.value }}</div>)',
transclude: true,
controller:
class {value = 'from-ng1'; constructor() { ng1ControllerInstances.push(this); }}
controller: class {
value = 'from-ng1';
constructor() {
ng1ControllerInstances.push(this);
}
}
};
// Define `Ng1ComponentFacade`
@ -2227,7 +2284,9 @@ withEachNg1Version(() => {
@Component({selector: 'ng2', template: 'ng2(<ng1>{{ value }}</ng1> | <ng1></ng1>)'})
class Ng2Component {
value = 'from-ng2';
constructor() { ng2ComponentInstance = this; }
constructor() {
ng2ComponentInstance = this;
}
}
// Define `ng1Module`
@ -2293,7 +2352,9 @@ withEachNg1Version(() => {
class Ng2Component {
x = 'foo';
y = 'bar';
constructor() { ng2ComponentInstance = this; }
constructor() {
ng2ComponentInstance = this;
}
}
// Define `ng1Module`
@ -2334,8 +2395,12 @@ withEachNg1Version(() => {
const ng1Component: angular.IComponent = {
template: 'ng1(default(<div ng-transclude="">fallback-{{ $ctrl.value }}</div>))',
transclude: {slotX: 'contentX', slotY: 'contentY'},
controller:
class {value = 'ng1'; constructor() { ng1ControllerInstances.push(this); }}
controller: class {
value = 'ng1';
constructor() {
ng1ControllerInstances.push(this);
}
}
};
// Define `Ng1ComponentFacade`
@ -2368,7 +2433,9 @@ withEachNg1Version(() => {
class Ng2Component {
x = 'foo';
y = 'bar';
constructor() { ng2ComponentInstance = this; }
constructor() {
ng2ComponentInstance = this;
}
}
// Define `ng1Module`
@ -2417,7 +2484,11 @@ withEachNg1Version(() => {
)`,
transclude: {slotX: '?contentX', slotY: '?contentY'},
controller: class {
x = 'ng1X'; y = 'ng1Y'; constructor() { ng1ControllerInstances.push(this); }
x = 'ng1X';
y = 'ng1Y';
constructor() {
ng1ControllerInstances.push(this);
}
}
};
@ -2441,7 +2512,9 @@ withEachNg1Version(() => {
class Ng2Component {
x = 'ng2X';
y = 'ng2Y';
constructor() { ng2ComponentInstance = this; }
constructor() {
ng2ComponentInstance = this;
}
}
// Define `ng1Module`
@ -2563,7 +2636,9 @@ withEachNg1Version(() => {
x = 'foo';
y = 'bar';
show = true;
constructor() { ng2ComponentInstance = this; }
constructor() {
ng2ComponentInstance = this;
}
}
// Define `ng1Module`
@ -2616,8 +2691,11 @@ withEachNg1Version(() => {
scope: {inputA: '<'},
bindToController: false,
controllerAs: '$ctrl',
controller:
class {$onChanges(changes: SimpleChanges) { controllerOnChangesA(changes); }}
controller: class {
$onChanges(changes: SimpleChanges) {
controllerOnChangesA(changes);
}
}
};
const ng1DirectiveB: angular.IDirective = {
@ -2625,8 +2703,11 @@ withEachNg1Version(() => {
scope: {inputB: '<'},
bindToController: true,
controllerAs: '$ctrl',
controller:
class {$onChanges(changes: SimpleChanges) { controllerOnChangesB(changes); }}
controller: class {
$onChanges(changes: SimpleChanges) {
controllerOnChangesB(changes);
}
}
};
// Define `Ng1ComponentFacade`
@ -2656,7 +2737,9 @@ withEachNg1Version(() => {
class Ng2Component {
data = {foo: 'bar'};
constructor() { ng2ComponentInstance = this; }
constructor() {
ng2ComponentInstance = this;
}
}
// Define `ng1Module`
@ -2809,7 +2892,9 @@ withEachNg1Version(() => {
class Ng2Component {
data = {foo: 'bar'};
constructor() { ng2ComponentInstance = this; }
constructor() {
ng2ComponentInstance = this;
}
}
// Define `ng1Module`
@ -2905,9 +2990,13 @@ withEachNg1Version(() => {
template: 'Called: {{ called }}',
bindToController: false,
controller: class {
constructor(private $scope: angular.IScope) { $scope['called'] = 'no'; }
constructor(private $scope: angular.IScope) {
$scope['called'] = 'no';
}
$onInit() { this.$scope['called'] = 'yes'; }
$onInit() {
this.$scope['called'] = 'yes';
}
}
};
@ -3042,9 +3131,13 @@ withEachNg1Version(() => {
template: 'Called: {{ called }}',
bindToController: false,
controller: class {
constructor(private $scope: angular.IScope) { $scope['called'] = 'no'; }
constructor(private $scope: angular.IScope) {
$scope['called'] = 'no';
}
$postLink() { this.$scope['called'] = 'yes'; }
$postLink() {
this.$scope['called'] = 'yes';
}
}
};
@ -3182,13 +3275,21 @@ withEachNg1Version(() => {
const ng1DirectiveA: angular.IDirective = {
template: 'ng1A',
bindToController: false,
controller: class {$doCheck() { controllerDoCheckA(); }}
controller: class {
$doCheck() {
controllerDoCheckA();
}
}
};
const ng1DirectiveB: angular.IDirective = {
template: 'ng1B',
bindToController: true,
controller: class {constructor() { (this as any)['$doCheck'] = controllerDoCheckB; }}
controller: class {
constructor() {
(this as any)['$doCheck'] = controllerDoCheckB;
}
}
};
// Define `Ng1ComponentFacade`
@ -3261,7 +3362,9 @@ withEachNg1Version(() => {
template: 'ng1A',
bindToController: false,
controller: class {
constructor(private $scope: angular.IScope) { $scope['$doCheck'] = scopeDoCheck; }
constructor(private $scope: angular.IScope) {
$scope['$doCheck'] = scopeDoCheck;
}
}
};
@ -3269,7 +3372,9 @@ withEachNg1Version(() => {
template: 'ng1B',
bindToController: true,
controller: class {
constructor(private $scope: angular.IScope) { $scope['$doCheck'] = scopeDoCheck; }
constructor(private $scope: angular.IScope) {
$scope['$doCheck'] = scopeDoCheck;
}
}
};
@ -3337,7 +3442,11 @@ withEachNg1Version(() => {
scope: {},
bindToController: false,
controllerAs: '$ctrl',
controller: class {$onDestroy() { controllerOnDestroyA(); }}
controller: class {
$onDestroy() {
controllerOnDestroyA();
}
}
};
const ng1DirectiveB: angular.IDirective = {
@ -3345,8 +3454,11 @@ withEachNg1Version(() => {
scope: {},
bindToController: true,
controllerAs: '$ctrl',
controller:
class {constructor() { (this as any)['$onDestroy'] = controllerOnDestroyB; }}
controller: class {
constructor() {
(this as any)['$onDestroy'] = controllerOnDestroyB;
}
}
};
// Define `Ng1ComponentFacade`
@ -3369,7 +3481,7 @@ withEachNg1Version(() => {
{selector: 'ng2', template: '<div *ngIf="show"><ng1A></ng1A> | <ng1B></ng1B></div>'})
class Ng2Component {
// TODO(issue/24571): remove '!'.
@Input() show !: boolean;
@Input() show!: boolean;
}
// Define `ng1Module`
@ -3470,7 +3582,7 @@ withEachNg1Version(() => {
{selector: 'ng2', template: '<div *ngIf="show"><ng1A></ng1A> | <ng1B></ng1B></div>'})
class Ng2Component {
// TODO(issue/24571): remove '!'.
@Input() show !: boolean;
@Input() show!: boolean;
}
// Define `ng1Module`
@ -3526,13 +3638,21 @@ withEachNg1Version(() => {
controller: class {
calls: string[] = [];
$onChanges() { this.calls.push('$onChanges'); }
$onChanges() {
this.calls.push('$onChanges');
}
$onInit() { this.calls.push('$onInit'); }
$onInit() {
this.calls.push('$onInit');
}
$doCheck() { this.calls.push('$doCheck'); }
$doCheck() {
this.calls.push('$doCheck');
}
$postLink() { this.calls.push('$postLink'); }
$postLink() {
this.calls.push('$postLink');
}
}
};
@ -3584,7 +3704,9 @@ withEachNg1Version(() => {
// Define `ng1Component`
const ng1Component: angular.IComponent = {
controller: class {
constructor($scope: angular.IScope) { $scope.$on('$destroy', scopeDestroyListener); }
constructor($scope: angular.IScope) {
$scope.$on('$destroy', scopeDestroyListener);
}
}
};
@ -3601,7 +3723,9 @@ withEachNg1Version(() => {
class Ng2ComponentA {
destroyIt = false;
constructor() { ng2ComponentAInstance = this; }
constructor() {
ng2ComponentAInstance = this;
}
}
@Component({selector: 'ng2B', template: '<ng1></ng1>'})
@ -3645,8 +3769,8 @@ withEachNg1Version(() => {
const ng1Component: angular.IComponent = {
controller: class {
constructor($element: angular.IAugmentedJQuery) {
$element.on !('$destroy', elementDestroyListener);
$element.contents !().on !('$destroy', descendantDestroyListener);
$element.on!('$destroy', elementDestroyListener);
$element.contents!().on!('$destroy', descendantDestroyListener);
}
},
template: '<div></div>'
@ -3665,7 +3789,9 @@ withEachNg1Version(() => {
class Ng2ComponentA {
destroyIt = false;
constructor() { ng2ComponentAInstance = this; }
constructor() {
ng2ComponentAInstance = this;
}
}
@Component({selector: 'ng2B', template: '<ng1></ng1>'})
@ -3710,8 +3836,8 @@ withEachNg1Version(() => {
const ng1Component: angular.IComponent = {
controller: class {
constructor($element: angular.IAugmentedJQuery) {
$element.data !('test', 1);
$element.contents !().data !('test', 2);
$element.data!('test', 1);
$element.contents!().data!('test', 2);
ng1ComponentElement = $element;
}
@ -3732,7 +3858,9 @@ withEachNg1Version(() => {
class Ng2ComponentA {
destroyIt = false;
constructor() { ng2ComponentAInstance = this; }
constructor() {
ng2ComponentAInstance = this;
}
}
@Component({selector: 'ng2B', template: '<ng1></ng1>'})
@ -3758,14 +3886,14 @@ withEachNg1Version(() => {
const element = html(`<ng2-a></ng2-a>`);
bootstrap(platformBrowserDynamic(), Ng2Module, element, ng1Module).then(adapter => {
expect(ng1ComponentElement.data !('test')).toBe(1);
expect(ng1ComponentElement.contents !().data !('test')).toBe(2);
expect(ng1ComponentElement.data!('test')).toBe(1);
expect(ng1ComponentElement.contents!().data!('test')).toBe(2);
ng2ComponentAInstance.destroyIt = true;
$digest(adapter);
expect(ng1ComponentElement.data !('test')).toBeUndefined();
expect(ng1ComponentElement.contents !().data !('test')).toBeUndefined();
expect(ng1ComponentElement.data!('test')).toBeUndefined();
expect(ng1ComponentElement.contents!().data!('test')).toBeUndefined();
});
}));
@ -3779,10 +3907,10 @@ withEachNg1Version(() => {
const ng1Component: angular.IComponent = {
controller: class {
constructor($element: angular.IAugmentedJQuery) {
ng1DescendantElement = $element.contents !();
ng1DescendantElement = $element.contents!();
$element.on !('click', elementClickListener);
ng1DescendantElement.on !('click', descendantClickListener);
$element.on!('click', elementClickListener);
ng1DescendantElement.on!('click', descendantClickListener);
}
},
template: '<div></div>'
@ -3801,7 +3929,9 @@ withEachNg1Version(() => {
class Ng2ComponentA {
destroyIt = false;
constructor() { ng2ComponentAInstance = this; }
constructor() {
ng2ComponentAInstance = this;
}
}
@Component({selector: 'ng2B', template: '<ng1></ng1>'})
@ -3844,8 +3974,12 @@ withEachNg1Version(() => {
let ng2Component: Ng2Component;
// Define `ng1Component`
const ng1Component:
angular.IComponent = {template: 'ng1', controller: class {$doCheck() {}}};
const ng1Component: angular.IComponent = {
template: 'ng1',
controller: class {
$doCheck() {}
}
};
// Define `Ng1ComponentFacade`
@Directive({selector: 'ng1'})
@ -3859,7 +3993,9 @@ withEachNg1Version(() => {
@Component({selector: 'ng2', template: '<ng1 *ngIf="doShow"></ng1>'})
class Ng2Component {
doShow: boolean = false;
constructor(@Inject($SCOPE) public $scope: angular.IScope) { ng2Component = this; }
constructor(@Inject($SCOPE) public $scope: angular.IScope) {
ng2Component = this;
}
}
// Define `ng1Module`
@ -3959,11 +4095,13 @@ withEachNg1Version(() => {
// Define `ng1Component`
class Ng1ControllerX {
// TODO(issue/24571): remove '!'.
ng1XInputA !: string;
ng1XInputA!: string;
ng1XInputB: any;
ng1XInputC: any;
constructor() { ng1ControllerXInstance = this; }
constructor() {
ng1ControllerXInstance = this;
}
}
const ng1Component: angular.IComponent = {
template: `
@ -3988,15 +4126,15 @@ withEachNg1Version(() => {
@Directive({selector: 'ng1X'})
class Ng1ComponentXFacade extends UpgradeComponent {
// TODO(issue/24571): remove '!'.
@Input() ng1XInputA !: string;
@Input() ng1XInputA!: string;
@Input() ng1XInputB: any;
@Input() ng1XInputC: any;
// TODO(issue/24571): remove '!'.
@Output() ng1XInputCChange !: EventEmitter<any>;
@Output() ng1XInputCChange!: EventEmitter<any>;
// TODO(issue/24571): remove '!'.
@Output() ng1XOutputA !: EventEmitter<any>;
@Output() ng1XOutputA!: EventEmitter<any>;
// TODO(issue/24571): remove '!'.
@Output() ng1XOutputB !: EventEmitter<any>;
@Output() ng1XOutputB!: EventEmitter<any>;
constructor(elementRef: ElementRef, injector: Injector) {
super('ng1X', elementRef, injector);
@ -4022,7 +4160,9 @@ withEachNg1Version(() => {
ng2ADataB = {value: 'bar'};
ng2ADataC = {value: 'baz'};
constructor() { ng2ComponentAInstance = this; }
constructor() {
ng2ComponentAInstance = this;
}
}
@Component({selector: 'ng2-b', template: 'ng2B({{ ng2BInputA }}, {{ ng2BInputC }})'})
@ -4031,7 +4171,9 @@ withEachNg1Version(() => {
@Input() ng2BInputC: any;
@Output() ng2BOutputC = new EventEmitter();
constructor() { ng2ComponentBInstance = this; }
constructor() {
ng2ComponentBInstance = this;
}
}
// Define `ng1Module`
@ -4145,14 +4287,18 @@ withEachNg1Version(() => {
// Define `ng1Component`
const ng1ComponentA: angular.IComponent = {
template: 'ng1A(<ng2-b></ng2-b>)',
controller: class {value = 'ng1A';}
controller: class {
value = 'ng1A';
}
};
const ng1ComponentB: angular.IComponent = {
template:
'ng1B(^^ng1A: {{ $ctrl.ng1A.value }} | ?^^ng1B: {{ $ctrl.ng1B.value }} | ^ng1B: {{ $ctrl.ng1BSelf.value }})',
require: {ng1A: '^^', ng1B: '?^^', ng1BSelf: '^ng1B'},
controller: class {value = 'ng1B';}
controller: class {
value = 'ng1B';
}
};
// Define `Ng1ComponentFacade`

4
packages/upgrade/static/testing/src/create_angular_testing_module.ts
View File

@ -21,7 +21,9 @@ export function $injectorFactory() {
@NgModule({providers: [{provide: $INJECTOR, useFactory: $injectorFactory}]})
export class AngularTestingModule {
constructor(i: Injector) { injector = i; }
constructor(i: Injector) {
injector = i;
}
}
/**

2
packages/upgrade/static/testing/test/create_angular_testing_module_spec.ts
View File

@ -13,7 +13,7 @@ import {$INJECTOR} from '../../../src/common/src/constants';
import {withEachNg1Version} from '../../../src/common/test/helpers/common_test_helpers';
import {createAngularTestingModule} from '../src/create_angular_testing_module';
import {AppModule, Inventory, defineAppModule, serverRequestInstance} from './mocks';
import {AppModule, defineAppModule, Inventory, serverRequestInstance} from './mocks';
withEachNg1Version(() => {
describe('Angular entry point', () => {

6
packages/upgrade/static/testing/test/create_angularjs_testing_module_spec.ts
View File

@ -10,7 +10,7 @@ import {getAngularJSGlobal} from '../../../src/common/src/angular1';
import {withEachNg1Version} from '../../../src/common/test/helpers/common_test_helpers';
import {createAngularJSTestingModule} from '../src/create_angularjs_testing_module';
import {AppModule, Inventory, defineAppModule} from './mocks';
import {AppModule, defineAppModule, Inventory} from './mocks';
withEachNg1Version(() => {
@ -26,7 +26,9 @@ withEachNg1Version(() => {
// Configure an AngularJS module that has the AngularJS and Angular injector wired up
module(createAngularJSTestingModule([AppModule]));
let inventory: any = undefined;
inject(function(shoppingCart: any) { inventory = shoppingCart.inventory; });
inject(function(shoppingCart: any) {
inventory = shoppingCart.inventory;
});
expect(inventory).toEqual(jasmine.any(Inventory));
});
});