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

refactor(ivy): move directive, component and pipe factories to ngFactoryFn (#31953)

Browse Source 
Reworks the compiler to output the factories for directives, components and pipes under a new static field called `ngFactoryFn`, instead of the usual `factory` property in their respective defs. This should eventually allow us to inject any kind of decorated class (e.g. a pipe).

**Note:** these changes are the first part of the refactor and they don't include injectables. I decided to leave injectables for a follow-up PR, because there's some more cases we need to handle when it comes to their factories. Furthermore, directives, components and pipes make up most of the compiler output tests that need to be refactored and it'll make follow-up PRs easier to review if the tests are cleaned up now.

This is part of the larger refactor for FW-1468.

PR Close #31953
This commit is contained in:
Kristiyan Kostadinov
2019-08-12 09:26:20 +03:00
committed by atscott
parent 14feb56139
commit c885178d5f
71 changed files with 894 additions and 675 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
packages/core/test/bundling/cyclic_import/bundle.golden_symbols.json
View File

@ -81,7 +81,7 @@
"name": "NG_ELEMENT_ID"
},
{
"name": "NG_INJECTABLE_DEF"
"name": "NG_FACTORY_DEF"
},
{
"name": "NG_PIPE_DEF"
@ -311,6 +311,9 @@
{
"name": "getElementDepthCount"
},
{
"name": "getFactoryDef"
},
{
"name": "getHostNative"
},
@ -674,9 +677,6 @@
{
"name": "ɵɵdefineComponent"
},
{
"name": "ɵɵdefineInjectable"
},
{
"name": "ɵɵdefineInjector"
},
@ -698,4 +698,4 @@
{
"name": "ɵɵtext"
}
]
]

10
packages/core/test/bundling/hello_world/bundle.golden_symbols.json
View File

@ -72,7 +72,7 @@
"name": "NG_ELEMENT_ID"
},
{
"name": "NG_INJECTABLE_DEF"
"name": "NG_FACTORY_DEF"
},
{
"name": "NG_PIPE_DEF"
@ -248,6 +248,9 @@
{
"name": "getDirectiveDef"
},
{
"name": "getFactoryDef"
},
{
"name": "getHostNative"
},
@ -485,10 +488,7 @@
{
"name": "ɵɵdefineComponent"
},
{
"name": "ɵɵdefineInjectable"
},
{
"name": "ɵɵtext"
}
]
]

8
packages/core/test/bundling/injection/bundle.golden_symbols.json
View File

@ -26,6 +26,9 @@
{
"name": "NEW_LINE"
},
{
"name": "NG_FACTORY_DEF"
},
{
"name": "NG_INJECTABLE_DEF"
},
@ -116,6 +119,9 @@
{
"name": "getClosureSafeProperty"
},
{
"name": "getFactoryDef"
},
{
"name": "getInheritedInjectableDef"
},
@ -209,4 +215,4 @@
{
"name": "ɵɵinject"
}
]
]

8
packages/core/test/bundling/todo/bundle.golden_symbols.json
View File

@ -134,6 +134,9 @@
{
"name": "NG_ELEMENT_ID"
},
{
"name": "NG_FACTORY_DEF"
},
{
"name": "NG_INJECTABLE_DEF"
},
@ -758,6 +761,9 @@
{
"name": "getErrorLogger"
},
{
"name": "getFactoryDef"
},
{
"name": "getGuardMask"
},
@ -1451,4 +1457,4 @@
{
"name": "ɵɵtextInterpolate1"
}
]
]

4
packages/core/test/render3/basic_perf.ts
View File

@ -33,6 +33,7 @@ describe('iv perf test', () => {
it(`${iteration}. create ${count} divs in Render3`, () => {
class Component {
static ngFactoryDef = () => new Component;
static ngComponentDef = ɵɵdefineComponent({
type: Component,
selectors: [['div']],
@ -59,8 +60,7 @@ describe('iv perf test', () => {
}
ɵɵcontainerRefreshEnd();
}
},
factory: () => new Component
}
});
}

12
packages/core/test/render3/change_detection_spec.ts
View File

@ -25,10 +25,10 @@ describe('change detection', () => {
doCheckCount = 0;
ngDoCheck(): void { this.doCheckCount++; }
static ngFactoryDef = () => new MyComponent();
static ngComponentDef = ɵɵdefineComponent({
type: MyComponent,
selectors: [['my-comp']],
factory: () => new MyComponent(),
consts: 2,
vars: 1,
template: (rf: RenderFlags, ctx: MyComponent) => {
@ -101,10 +101,10 @@ describe('change detection', () => {
onClick() {}
static ngFactoryDef = () => comp = new MyComponent();
static ngComponentDef = ɵɵdefineComponent({
type: MyComponent,
selectors: [['my-comp']],
factory: () => comp = new MyComponent(),
consts: 2,
vars: 2,
/**
@ -140,10 +140,10 @@ describe('change detection', () => {
onClick() {}
static ngFactoryDef = () => comp = new ManualComponent();
static ngComponentDef = ɵɵdefineComponent({
type: ManualComponent,
selectors: [['manual-comp']],
factory: () => comp = new ManualComponent(),
consts: 2,
vars: 2,
/**
@ -177,10 +177,10 @@ describe('change detection', () => {
class ManualApp {
name: string = 'Nancy';
static ngFactoryDef = () => new ManualApp();
static ngComponentDef = ɵɵdefineComponent({
type: ManualApp,
selectors: [['manual-app']],
factory: () => new ManualApp(),
consts: 1,
vars: 1,
/** <manual-comp [name]="name"></manual-comp> */
@ -233,10 +233,10 @@ describe('change detection', () => {
doCheckCount = 0;
ngDoCheck(): void { this.doCheckCount++; }
static ngFactoryDef = () => parent = new ButtonParent();
static ngComponentDef = ɵɵdefineComponent({
type: ButtonParent,
selectors: [['button-parent']],
factory: () => parent = new ButtonParent(),
consts: 2,
vars: 1,
/** {{ doCheckCount }} - <manual-comp></manual-comp> */
@ -311,10 +311,10 @@ describe('change detection', () => {
return 'works';
}
static ngFactoryDef = () => new MyComponent();
static ngComponentDef = ɵɵdefineComponent({
type: MyComponent,
selectors: [['my-comp']],
factory: () => new MyComponent(),
consts: 1,
vars: 1,
template: (rf: RenderFlags, ctx: MyComponent) => {

20
packages/core/test/render3/common_with_def.ts
View File

@ -18,9 +18,6 @@ export const NgTemplateOutlet: DirectiveType<NgTemplateOutletDef> = NgTemplateOu
NgForOf.ngDirectiveDef = ɵɵdefineDirective({
type: NgForOfDef,
selectors: [['', 'ngForOf', '']],
factory: () => new NgForOfDef(
ɵɵdirectiveInject(ViewContainerRef as any), ɵɵdirectiveInject(TemplateRef as any),
ɵɵdirectiveInject(IterableDiffers)),
inputs: {
ngForOf: 'ngForOf',
ngForTrackBy: 'ngForTrackBy',
@ -28,19 +25,26 @@ NgForOf.ngDirectiveDef = ɵɵdefineDirective({
}
});
(NgIf as any).ngDirectiveDef = ɵɵdefineDirective({
NgForOf.ngFactoryDef = () => new NgForOfDef(
ɵɵdirectiveInject(ViewContainerRef as any), ɵɵdirectiveInject(TemplateRef as any),
ɵɵdirectiveInject(IterableDiffers));
NgIf.ngDirectiveDef = ɵɵdefineDirective({
type: NgIfDef,
selectors: [['', 'ngIf', '']],
factory: () => new NgIfDef(
ɵɵdirectiveInject(ViewContainerRef as any), ɵɵdirectiveInject(TemplateRef as any)),
inputs: {ngIf: 'ngIf', ngIfThen: 'ngIfThen', ngIfElse: 'ngIfElse'}
});
(NgTemplateOutlet as any).ngDirectiveDef = ɵɵdefineDirective({
NgIf.ngFactoryDef = () =>
new NgIfDef(ɵɵdirectiveInject(ViewContainerRef as any), ɵɵdirectiveInject(TemplateRef as any));
NgTemplateOutlet.ngDirectiveDef = ɵɵdefineDirective({
type: NgTemplateOutletDef,
selectors: [['', 'ngTemplateOutlet', '']],
factory: () => new NgTemplateOutletDef(ɵɵdirectiveInject(ViewContainerRef as any)),
features: [ɵɵNgOnChangesFeature()],
inputs:
{ngTemplateOutlet: 'ngTemplateOutlet', ngTemplateOutletContext: 'ngTemplateOutletContext'}
});
NgTemplateOutlet.ngFactoryDef = () =>
new NgTemplateOutletDef(ɵɵdirectiveInject(ViewContainerRef as any));

6
packages/core/test/render3/component_ref_spec.ts
View File

@ -20,13 +20,13 @@ describe('ComponentFactory', () => {
describe('constructor()', () => {
it('should correctly populate default properties', () => {
class TestComponent {
static ngFactoryDef = () => new TestComponent();
static ngComponentDef = ɵɵdefineComponent({
type: TestComponent,
selectors: [['test', 'foo'], ['bar']],
consts: 0,
vars: 0,
template: () => undefined,
factory: () => new TestComponent(),
});
}
@ -41,6 +41,7 @@ describe('ComponentFactory', () => {
it('should correctly populate defined properties', () => {
class TestComponent {
static ngFactoryDef = () => new TestComponent();
static ngComponentDef = ɵɵdefineComponent({
type: TestComponent,
encapsulation: ViewEncapsulation.None,
@ -49,7 +50,6 @@ describe('ComponentFactory', () => {
vars: 0,
template: () => undefined,
ngContentSelectors: ['*', 'a', 'b'],
factory: () => new TestComponent(),
inputs: {
in1: 'in1',
in2: ['input-attr-2', 'in2'],
@ -89,6 +89,7 @@ describe('ComponentFactory', () => {
createRenderer3Spy = spyOn(domRendererFactory3, 'createRenderer').and.callThrough();
class TestComponent {
static ngFactoryDef = () => new TestComponent();
static ngComponentDef = ɵɵdefineComponent({
type: TestComponent,
encapsulation: ViewEncapsulation.None,
@ -96,7 +97,6 @@ describe('ComponentFactory', () => {
consts: 0,
vars: 0,
template: () => undefined,
factory: () => new TestComponent(),
});
}

24
packages/core/test/render3/component_spec.ts
View File

@ -21,6 +21,7 @@ describe('component', () => {
increment() { this.count++; }
static ngFactoryDef = () => new CounterComponent;
static ngComponentDef = ɵɵdefineComponent({
type: CounterComponent,
encapsulation: ViewEncapsulation.None,
@ -36,7 +37,6 @@ describe('component', () => {
ɵɵtextBinding(ctx.count);
}
},
factory: () => new CounterComponent,
inputs: {count: 'count'},
});
}
@ -72,11 +72,11 @@ describe('component', () => {
}
class MyComponent {
constructor(public myService: MyService) {}
static ngFactoryDef = () => new MyComponent(ɵɵdirectiveInject(MyService));
static ngComponentDef = ɵɵdefineComponent({
type: MyComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['my-component']],
factory: () => new MyComponent(ɵɵdirectiveInject(MyService)),
consts: 1,
vars: 1,
template: function(fs: RenderFlags, ctx: MyComponent) {
@ -117,10 +117,10 @@ describe('component', () => {
// @Input
name = '';
static ngFactoryDef = () => new Comp();
static ngComponentDef = ɵɵdefineComponent({
type: Comp,
selectors: [['comp']],
factory: () => new Comp(),
consts: 1,
vars: 1,
template: (rf: RenderFlags, ctx: Comp) => {
@ -172,15 +172,17 @@ it('should not invoke renderer destroy method for embedded views', () => {
class Comp {
visible = true;
static ngFactoryDef =
() => {
comp = new Comp();
return comp;
}
static ngComponentDef = ɵɵdefineComponent({
type: Comp,
selectors: [['comp']],
consts: 3,
vars: 1,
factory: () => {
comp = new Comp();
return comp;
},
directives: [NgIf],
/**
* <div>Root view</div>
@ -248,6 +250,7 @@ describe('component with a container', () => {
class WrapperComponent {
// TODO(issue/24571): remove '!'.
items !: string[];
static ngFactoryDef = () => new WrapperComponent;
static ngComponentDef = ɵɵdefineComponent({
type: WrapperComponent,
encapsulation: ViewEncapsulation.None,
@ -268,7 +271,6 @@ describe('component with a container', () => {
ɵɵcontainerRefreshEnd();
}
},
factory: () => new WrapperComponent,
inputs: {items: 'items'}
});
}
@ -326,11 +328,11 @@ describe('recursive components', () => {
ngOnDestroy() { events.push('destroy' + this.data.value); }
static ngFactoryDef = () => new TreeComponent();
static ngComponentDef = ɵɵdefineComponent({
type: TreeComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['tree-comp']],
factory: () => new TreeComponent(),
consts: 3,
vars: 1,
template: (rf: RenderFlags, ctx: TreeComponent) => {
@ -393,11 +395,11 @@ describe('recursive components', () => {
ngOnDestroy() { events.push('destroy' + this.data.value); }
static ngFactoryDef = () => new NgIfTree();
static ngComponentDef = ɵɵdefineComponent({
type: NgIfTree,
encapsulation: ViewEncapsulation.None,
selectors: [['ng-if-tree']],
factory: () => new NgIfTree(),
consts: 3,
vars: 3,
template: (rf: RenderFlags, ctx: NgIfTree) => {
@ -543,6 +545,7 @@ describe('recursive components', () => {
class TestInputsComponent {
// TODO(issue/24571): remove '!'.
minifiedName !: string;
static ngFactoryDef = () => new TestInputsComponent();
static ngComponentDef = ɵɵdefineComponent({
type: TestInputsComponent,
encapsulation: ViewEncapsulation.None,
@ -550,7 +553,6 @@ describe('recursive components', () => {
inputs: {minifiedName: 'unminifiedName'},
consts: 0,
vars: 0,
factory: () => new TestInputsComponent(),
template: function(rf: RenderFlags, ctx: TestInputsComponent): void {
// Template not needed for this test
}

24
packages/core/test/render3/control_flow_spec.ts
View File

@ -692,15 +692,17 @@ describe('JS control flow', () => {
// Intentionally duplicating the templates in test below so we are
// testing the behavior on firstTemplatePass for each of these tests
class Comp {
static ngFactoryDef =
() => {
log.push('comp!');
return new Comp();
}
static ngComponentDef = ɵɵdefineComponent({
type: Comp,
selectors: [['comp']],
consts: 0,
vars: 0,
factory: () => {
log.push('comp!');
return new Comp();
},
template: function(rf: RenderFlags, ctx: Comp) {}
});
}
@ -709,10 +711,10 @@ describe('JS control flow', () => {
condition = true;
condition2 = true;
static ngFactoryDef = () => new App();
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app']],
factory: () => new App(),
consts: 3,
vars: 0,
template: function(rf: RenderFlags, ctx: any) {
@ -760,15 +762,17 @@ describe('JS control flow', () => {
// Intentionally duplicating the templates from above so we are
// testing the behavior on firstTemplatePass for each of these tests
class Comp {
static ngFactoryDef =
() => {
log.push('comp!');
return new Comp();
}
static ngComponentDef = ɵɵdefineComponent({
type: Comp,
selectors: [['comp']],
consts: 0,
vars: 0,
factory: () => {
log.push('comp!');
return new Comp();
},
template: function(rf: RenderFlags, ctx: Comp) {}
});
}
@ -777,10 +781,10 @@ describe('JS control flow', () => {
condition = false;
condition2 = true;
static ngFactoryDef = () => new App();
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app']],
factory: () => new App(),
consts: 3,
vars: 0,
template: function(rf: RenderFlags, ctx: any) {

2
packages/core/test/render3/debug_spec.ts
View File

@ -15,12 +15,12 @@ import {ComponentFixture} from './render_util';
describe('Debug Representation', () => {
it('should generate a human readable version', () => {
class MyComponent {
static ngFactoryDef = () => new MyComponent();
static ngComponentDef = ɵɵdefineComponent({
type: MyComponent,
selectors: [['my-comp']],
vars: 0,
consts: 2,
factory: () => new MyComponent(),
template: function(rf: RenderFlags, ctx: MyComponent) {
if (rf == RenderFlags.Create) {
ɵɵelementStart(0, 'div', ['id', '123']);

118
packages/core/test/render3/di_spec.ts
View File

@ -31,12 +31,9 @@ describe('di', () => {
value = 'DirB';
constructor() { log.push(this.value); }
static ngDirectiveDef = ɵɵdefineDirective({
selectors: [['', 'dirB', '']],
type: DirB,
factory: () => new DirB(),
inputs: {value: 'value'}
});
static ngFactoryDef = () => new DirB();
static ngDirectiveDef =
ɵɵdefineDirective({selectors: [['', 'dirB', '']], type: DirB, inputs: {value: 'value'}});
}
beforeEach(() => log = []);
@ -49,11 +46,8 @@ describe('di', () => {
class DirA {
constructor(dir: DirB) { log.push(`DirA (dep: ${dir.value})`); }
static ngDirectiveDef = ɵɵdefineDirective({
selectors: [['', 'dirA', '']],
type: DirA,
factory: () => new DirA(ɵɵdirectiveInject(DirB))
});
static ngFactoryDef = () => new DirA(ɵɵdirectiveInject(DirB));
static ngDirectiveDef = ɵɵdefineDirective({selectors: [['', 'dirA', '']], type: DirA});
}
/**
@ -92,13 +86,11 @@ describe('di', () => {
this.injector = vcr.injector;
}
static ngDirectiveDef = ɵɵdefineDirective({
type: DirA,
selectors: [['', 'dirA', '']],
factory:
() => new DirA(ɵɵdirectiveInject(DirB), ɵɵdirectiveInject(ViewContainerRef as any)),
exportAs: ['dirA']
});
static ngFactoryDef = () => new DirA(
ɵɵdirectiveInject(DirB), ɵɵdirectiveInject(ViewContainerRef as any))
static ngDirectiveDef =
ɵɵdefineDirective({type: DirA, selectors: [['', 'dirA', '']], exportAs: ['dirA']});
}
/**
@ -171,12 +163,9 @@ describe('di', () => {
// TODO(issue/24571): remove '!'.
value !: string;
static ngDirectiveDef = ɵɵdefineDirective({
type: DirB,
selectors: [['', 'dirB', '']],
factory: () => new DirB(),
inputs: {value: 'dirB'}
});
static ngFactoryDef = () => new DirB();
static ngDirectiveDef =
ɵɵdefineDirective({type: DirB, selectors: [['', 'dirB', '']], inputs: {value: 'dirB'}});
}
describe('Optional', () => {
@ -185,11 +174,13 @@ describe('di', () => {
class DirA {
constructor(@Optional() public dirB: DirB|null) {}
static ngDirectiveDef = ɵɵdefineDirective({
type: DirA,
selectors: [['', 'dirA', '']],
factory: () => dirA = new DirA(ɵɵdirectiveInject(DirB, InjectFlags.Optional))
});
static ngFactoryDef =
() => {
dirA = new DirA(ɵɵdirectiveInject(DirB, InjectFlags.Optional));
return dirA;
}
static ngDirectiveDef = ɵɵdefineDirective({type: DirA, selectors: [['', 'dirA', '']]});
}
beforeEach(() => dirA = null);
@ -214,11 +205,8 @@ describe('di', () => {
class DirA {
constructor(@Self() public dirB: DirB) {}
static ngDirectiveDef = ɵɵdefineDirective({
type: DirA,
selectors: [['', 'dirA', '']],
factory: () => dirA = new DirA(ɵɵdirectiveInject(DirB, InjectFlags.Self))
});
static ngFactoryDef = () => dirA = new DirA(ɵɵdirectiveInject(DirB, InjectFlags.Self));
static ngDirectiveDef = ɵɵdefineDirective({type: DirA, selectors: [['', 'dirA', '']]});
}
const DirC = createDirective('dirC');
@ -251,11 +239,8 @@ describe('di', () => {
class DirA {
constructor(@Host() public dirB: DirB) {}
static ngDirectiveDef = ɵɵdefineDirective({
type: DirA,
selectors: [['', 'dirA', '']],
factory: () => dirA = new DirA(ɵɵdirectiveInject(DirB, InjectFlags.Host))
});
static ngFactoryDef = () => dirA = new DirA(ɵɵdirectiveInject(DirB, InjectFlags.Host));
static ngDirectiveDef = ɵɵdefineDirective({type: DirA, selectors: [['', 'dirA', '']]});
}
/**
@ -319,10 +304,10 @@ describe('di', () => {
class MyComp {
constructor(public cdr: ChangeDetectorRef) {}
static ngFactoryDef = () => comp = new MyComp(ɵɵdirectiveInject(ChangeDetectorRef as any));
static ngComponentDef = ɵɵdefineComponent({
type: MyComp,
selectors: [['my-comp']],
factory: () => comp = new MyComp(ɵɵdirectiveInject(ChangeDetectorRef as any)),
consts: 1,
vars: 0,
template: function(rf: RenderFlags, ctx: MyComp) {
@ -339,23 +324,24 @@ describe('di', () => {
constructor(public cdr: ChangeDetectorRef) { this.value = (cdr.constructor as any).name; }
static ngDirectiveDef = ɵɵdefineDirective({
type: Directive,
selectors: [['', 'dir', '']],
factory: () => dir = new Directive(ɵɵdirectiveInject(ChangeDetectorRef as any)),
exportAs: ['dir']
});
static ngFactoryDef =
() => {
dir = new Directive(ɵɵdirectiveInject(ChangeDetectorRef as any));
return dir;
}
static ngDirectiveDef =
ɵɵdefineDirective({type: Directive, selectors: [['', 'dir', '']], exportAs: ['dir']});
}
class DirectiveSameInstance {
constructor(public cdr: ChangeDetectorRef) {}
static ngDirectiveDef = ɵɵdefineDirective({
type: DirectiveSameInstance,
selectors: [['', 'dirSame', '']],
factory: () => dirSameInstance =
new DirectiveSameInstance(ɵɵdirectiveInject(ChangeDetectorRef as any))
});
static ngFactoryDef = () => dirSameInstance =
new DirectiveSameInstance(ɵɵdirectiveInject(ChangeDetectorRef as any))
static ngDirectiveDef = ɵɵdefineDirective(
{type: DirectiveSameInstance, selectors: [['', 'dirSame', '']]});
}
const directives = [MyComp, Directive, DirectiveSameInstance];
@ -371,10 +357,10 @@ describe('di', () => {
constructor(public cdr: ChangeDetectorRef) {}
static ngFactoryDef = () => new MyApp(ɵɵdirectiveInject(ChangeDetectorRef as any));
static ngComponentDef = ɵɵdefineComponent({
type: MyApp,
selectors: [['my-app']],
factory: () => new MyApp(ɵɵdirectiveInject(ChangeDetectorRef as any)),
consts: 1,
vars: 0,
/**
@ -426,10 +412,10 @@ describe('di', () => {
class MyComp {
constructor(public renderer: Renderer2) {}
static ngFactoryDef = () => new MyComp(ɵɵdirectiveInject(Renderer2 as any));
static ngComponentDef = ɵɵdefineComponent({
type: MyComp,
selectors: [['my-comp']],
factory: () => new MyComp(ɵɵdirectiveInject(Renderer2 as any)),
consts: 1,
vars: 0,
template: function(rf: RenderFlags, ctx: MyComp) {
@ -537,24 +523,22 @@ describe('di', () => {
class ChildDirective {
value: string;
constructor(public parent: any) { this.value = (parent.constructor as any).name; }
static ngDirectiveDef = ɵɵdefineDirective({
type: ChildDirective,
selectors: [['', 'childDir', '']],
factory: () => new ChildDirective(ɵɵdirectiveInject(ParentDirective)),
exportAs: ['childDir']
});
static ngFactoryDef = () => new ChildDirective(ɵɵdirectiveInject(ParentDirective));
static ngDirectiveDef = ɵɵdefineDirective(
{type: ChildDirective, selectors: [['', 'childDir', '']], exportAs: ['childDir']});
}
class Child2Directive {
value: boolean;
constructor(parent: any, child: ChildDirective) { this.value = parent === child.parent; }
static ngDirectiveDef = ɵɵdefineDirective({
selectors: [['', 'child2Dir', '']],
type: Child2Directive,
factory: () => new Child2Directive(
ɵɵdirectiveInject(ParentDirective), ɵɵdirectiveInject(ChildDirective)),
exportAs: ['child2Dir']
});
static ngFactoryDef = () => new Child2Directive(
ɵɵdirectiveInject(ParentDirective), ɵɵdirectiveInject(ChildDirective))
static ngDirectiveDef = ɵɵdefineDirective({
selectors: [['', 'child2Dir', '']],
type: Child2Directive,
exportAs: ['child2Dir']
});
}
/**

2
packages/core/test/render3/instructions_spec.ts
View File

@ -272,10 +272,10 @@ describe('instructions', () => {
class NestedLoops {
rows = [['a', 'b'], ['A', 'B'], ['a', 'b'], ['A', 'B']];
static ngFactoryDef = function ToDoAppComponent_Factory() { return new NestedLoops(); };
static ngComponentDef = ɵɵdefineComponent({
type: NestedLoops,
selectors: [['nested-loops']],
factory: function ToDoAppComponent_Factory() { return new NestedLoops(); },
consts: 1,
vars: 1,
template: function ToDoAppComponent_Template(rf: RenderFlags, ctx: NestedLoops) {

97
packages/core/test/render3/integration_spec.ts
View File

@ -117,6 +117,8 @@ describe('render3 integration test', () => {
beforeTree !: Tree;
// TODO(issue/24571): remove '!'.
afterTree !: Tree;
static ngFactoryDef = () => new ChildComponent;
static ngComponentDef = ɵɵdefineComponent({
selectors: [['child']],
type: ChildComponent,
@ -147,7 +149,6 @@ describe('render3 integration test', () => {
ɵɵcontainerRefreshEnd();
}
},
factory: () => new ChildComponent,
inputs: {beforeTree: 'beforeTree', afterTree: 'afterTree'}
});
}
@ -200,6 +201,7 @@ describe('render3 integration test', () => {
describe('component styles', () => {
it('should pass in the component styles directly into the underlying renderer', () => {
class StyledComp {
static ngFactoryDef = () => new StyledComp();
static ngComponentDef = ɵɵdefineComponent({
type: StyledComp,
styles: ['div { color: red; }'],
@ -207,7 +209,6 @@ describe('component styles', () => {
vars: 0,
encapsulation: 100,
selectors: [['foo']],
factory: () => new StyledComp(),
template: (rf: RenderFlags, ctx: StyledComp) => {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div');
@ -228,6 +229,7 @@ describe('component animations', () => {
const animB = {name: 'b'};
class AnimComp {
static ngFactoryDef = () => new AnimComp();
static ngComponentDef = ɵɵdefineComponent({
type: AnimComp,
consts: 0,
@ -239,7 +241,6 @@ describe('component animations', () => {
],
},
selectors: [['foo']],
factory: () => new AnimComp(),
template: (rf: RenderFlags, ctx: AnimComp) => {}
});
}
@ -255,6 +256,7 @@ describe('component animations', () => {
it('should include animations in the renderType data array even if the array is empty', () => {
class AnimComp {
static ngFactoryDef = () => new AnimComp();
static ngComponentDef = ɵɵdefineComponent({
type: AnimComp,
consts: 0,
@ -263,7 +265,6 @@ describe('component animations', () => {
animation: [],
},
selectors: [['foo']],
factory: () => new AnimComp(),
template: (rf: RenderFlags, ctx: AnimComp) => {}
});
}
@ -275,12 +276,12 @@ describe('component animations', () => {
it('should allow [@trigger] bindings to be picked up by the underlying renderer', () => {
class AnimComp {
static ngFactoryDef = () => new AnimComp();
static ngComponentDef = ɵɵdefineComponent({
type: AnimComp,
consts: 1,
vars: 1,
selectors: [['foo']],
factory: () => new AnimComp(),
template: (rf: RenderFlags, ctx: AnimComp) => {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', [AttributeMarker.Bindings, '@fooAnimation']);
@ -312,12 +313,12 @@ describe('component animations', () => {
it('should allow creation-level [@trigger] properties to be picked up by the underlying renderer',
() => {
class AnimComp {
static ngFactoryDef = () => new AnimComp();
static ngComponentDef = ɵɵdefineComponent({
type: AnimComp,
consts: 1,
vars: 1,
selectors: [['foo']],
factory: () => new AnimComp(),
template: (rf: RenderFlags, ctx: AnimComp) => {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['@fooAnimation', '']);
@ -345,9 +346,9 @@ describe('component animations', () => {
// it('should allow host binding animations to be picked up and rendered', () => {
// class ChildCompWithAnim {
// static ngFactoryDef = () => new ChildCompWithAnim();
// static ngDirectiveDef = ɵɵdefineDirective({
// type: ChildCompWithAnim,
// factory: () => new ChildCompWithAnim(),
// selectors: [['child-comp-with-anim']],
// hostBindings: function(rf: RenderFlags, ctx: any, elementIndex: number): void {
// if (rf & RenderFlags.Update) {
@ -360,12 +361,12 @@ describe('component animations', () => {
// }
// class ParentComp {
// static ngFactoryDef = () => new ParentComp();
// static ngComponentDef = ɵɵdefineComponent({
// type: ParentComp,
// consts: 1,
// vars: 1,
// selectors: [['foo']],
// factory: () => new ParentComp(),
// template: (rf: RenderFlags, ctx: ParentComp) => {
// if (rf & RenderFlags.Create) {
// ɵɵelement(0, 'child-comp-with-anim');
@ -390,10 +391,10 @@ describe('component animations', () => {
describe('element discovery', () => {
it('should only monkey-patch immediate child nodes in a component', () => {
class StructuredComp {
static ngFactoryDef = () => new StructuredComp();
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
factory: () => new StructuredComp(),
consts: 2,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {
@ -422,10 +423,10 @@ describe('element discovery', () => {
it('should only monkey-patch immediate child nodes in a sub component', () => {
class ChildComp {
static ngFactoryDef = () => new ChildComp();
static ngComponentDef = ɵɵdefineComponent({
type: ChildComp,
selectors: [['child-comp']],
factory: () => new ChildComp(),
consts: 3,
vars: 0,
template: (rf: RenderFlags, ctx: ChildComp) => {
@ -439,11 +440,11 @@ describe('element discovery', () => {
}
class ParentComp {
static ngFactoryDef = () => new ParentComp();
static ngComponentDef = ɵɵdefineComponent({
type: ParentComp,
selectors: [['parent-comp']],
directives: [ChildComp],
factory: () => new ParentComp(),
consts: 2,
vars: 0,
template: (rf: RenderFlags, ctx: ParentComp) => {
@ -472,11 +473,11 @@ describe('element discovery', () => {
it('should only monkey-patch immediate child nodes in an embedded template container', () => {
class StructuredComp {
static ngFactoryDef = () => new StructuredComp();
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
directives: [NgIf],
factory: () => new StructuredComp(),
consts: 2,
vars: 1,
template: (rf: RenderFlags, ctx: StructuredComp) => {
@ -521,11 +522,11 @@ describe('element discovery', () => {
it('should return a context object from a given dom node', () => {
class StructuredComp {
static ngFactoryDef = () => new StructuredComp();
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
directives: [NgIf],
factory: () => new StructuredComp(),
consts: 2,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {
@ -559,10 +560,10 @@ describe('element discovery', () => {
it('should cache the element context on a element was pre-emptively monkey-patched', () => {
class StructuredComp {
static ngFactoryDef = () => new StructuredComp();
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
factory: () => new StructuredComp(),
consts: 1,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {
@ -591,10 +592,10 @@ describe('element discovery', () => {
it('should cache the element context on an intermediate element that isn\'t pre-emptively monkey-patched',
() => {
class StructuredComp {
static ngFactoryDef = () => new StructuredComp();
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
factory: () => new StructuredComp(),
consts: 2,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {
@ -624,10 +625,10 @@ describe('element discovery', () => {
it('should be able to pull in element context data even if the element is decorated using styling',
() => {
class StructuredComp {
static ngFactoryDef = () => new StructuredComp();
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
factory: () => new StructuredComp(),
consts: 1,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {
@ -677,10 +678,10 @@ describe('element discovery', () => {
</section>
*/
class ProjectorComp {
static ngFactoryDef = () => new ProjectorComp();
static ngComponentDef = ɵɵdefineComponent({
type: ProjectorComp,
selectors: [['projector-comp']],
factory: () => new ProjectorComp(),
consts: 4,
vars: 0,
template: (rf: RenderFlags, ctx: ProjectorComp) => {
@ -700,11 +701,11 @@ describe('element discovery', () => {
}
class ParentComp {
static ngFactoryDef = () => new ParentComp();
static ngComponentDef = ɵɵdefineComponent({
type: ParentComp,
selectors: [['parent-comp']],
directives: [ProjectorComp],
factory: () => new ParentComp(),
consts: 5,
vars: 0,
template: (rf: RenderFlags, ctx: ParentComp) => {
@ -774,10 +775,10 @@ describe('element discovery', () => {
it('should return `null` when an element context is retrieved that is a DOM node that was not created by Angular',
() => {
class StructuredComp {
static ngFactoryDef = () => new StructuredComp();
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
factory: () => new StructuredComp(),
consts: 1,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {
@ -801,10 +802,10 @@ describe('element discovery', () => {
it('should by default monkey-patch the bootstrap component with context details', () => {
class StructuredComp {
static ngFactoryDef = () => new StructuredComp();
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
factory: () => new StructuredComp(),
consts: 0,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {}
@ -840,35 +841,29 @@ describe('element discovery', () => {
let myDir3Instance: MyDir2|null = null;
class MyDir1 {
static ngDirectiveDef = ɵɵdefineDirective({
type: MyDir1,
selectors: [['', 'my-dir-1', '']],
factory: () => myDir1Instance = new MyDir1()
});
static ngFactoryDef = () => myDir1Instance = new MyDir1();
static ngDirectiveDef =
ɵɵdefineDirective({type: MyDir1, selectors: [['', 'my-dir-1', '']]});
}
class MyDir2 {
static ngDirectiveDef = ɵɵdefineDirective({
type: MyDir2,
selectors: [['', 'my-dir-2', '']],
factory: () => myDir2Instance = new MyDir2()
});
static ngFactoryDef = () => myDir2Instance = new MyDir2();
static ngDirectiveDef =
ɵɵdefineDirective({type: MyDir2, selectors: [['', 'my-dir-2', '']]});
}
class MyDir3 {
static ngDirectiveDef = ɵɵdefineDirective({
type: MyDir3,
selectors: [['', 'my-dir-3', '']],
factory: () => myDir3Instance = new MyDir2()
});
static ngFactoryDef = () => myDir3Instance = new MyDir2();
static ngDirectiveDef =
ɵɵdefineDirective({type: MyDir3, selectors: [['', 'my-dir-3', '']]});
}
class StructuredComp {
static ngFactoryDef = () => new StructuredComp();
static ngComponentDef = ɵɵdefineComponent({
type: StructuredComp,
selectors: [['structured-comp']],
directives: [MyDir1, MyDir2, MyDir3],
factory: () => new StructuredComp(),
consts: 2,
vars: 0,
template: (rf: RenderFlags, ctx: StructuredComp) => {
@ -929,26 +924,22 @@ describe('element discovery', () => {
let childComponentInstance: ChildComp|null = null;
class MyDir1 {
static ngDirectiveDef = ɵɵdefineDirective({
type: MyDir1,
selectors: [['', 'my-dir-1', '']],
factory: () => myDir1Instance = new MyDir1()
});
static ngFactoryDef = () => myDir1Instance = new MyDir1();
static ngDirectiveDef =
ɵɵdefineDirective({type: MyDir1, selectors: [['', 'my-dir-1', '']]});
}
class MyDir2 {
static ngDirectiveDef = ɵɵdefineDirective({
type: MyDir2,
selectors: [['', 'my-dir-2', '']],
factory: () => myDir2Instance = new MyDir2()
});
static ngFactoryDef = () => myDir2Instance = new MyDir2();
static ngDirectiveDef =
ɵɵdefineDirective({type: MyDir2, selectors: [['', 'my-dir-2', '']]});
}
class ChildComp {
static ngFactoryDef = () => childComponentInstance = new ChildComp();
static ngComponentDef = ɵɵdefineComponent({
type: ChildComp,
selectors: [['child-comp']],
factory: () => childComponentInstance = new ChildComp(),
consts: 1,
vars: 0,
template: (rf: RenderFlags, ctx: ChildComp) => {
@ -960,11 +951,11 @@ describe('element discovery', () => {
}
class ParentComp {
static ngFactoryDef = () => new ParentComp();
static ngComponentDef = ɵɵdefineComponent({
type: ParentComp,
selectors: [['parent-comp']],
directives: [ChildComp, MyDir1, MyDir2],
factory: () => new ParentComp(),
consts: 1,
vars: 0,
template: (rf: RenderFlags, ctx: ParentComp) => {
@ -1022,10 +1013,10 @@ describe('element discovery', () => {
it('should monkey-patch sub components with the view data and then replace them with the context result once a lookup occurs',
() => {
class ChildComp {
static ngFactoryDef = () => new ChildComp();
static ngComponentDef = ɵɵdefineComponent({
type: ChildComp,
selectors: [['child-comp']],
factory: () => new ChildComp(),
consts: 3,
vars: 0,
template: (rf: RenderFlags, ctx: ChildComp) => {
@ -1039,11 +1030,11 @@ describe('element discovery', () => {
}
class ParentComp {
static ngFactoryDef = () => new ParentComp();
static ngComponentDef = ɵɵdefineComponent({
type: ParentComp,
selectors: [['parent-comp']],
directives: [ChildComp],
factory: () => new ParentComp(),
consts: 2,
vars: 0,
template: (rf: RenderFlags, ctx: ParentComp) => {
@ -1083,10 +1074,10 @@ describe('element discovery', () => {
describe('sanitization', () => {
it('should sanitize data using the provided sanitization interface', () => {
class SanitizationComp {
static ngFactoryDef = () => new SanitizationComp();
static ngComponentDef = ɵɵdefineComponent({
type: SanitizationComp,
selectors: [['sanitize-this']],
factory: () => new SanitizationComp(),
consts: 1,
vars: 1,
template: (rf: RenderFlags, ctx: SanitizationComp) => {
@ -1126,10 +1117,10 @@ describe('sanitization', () => {
// @HostBinding()
cite: any = 'http://cite-dir-value';
static ngFactoryDef = () => hostBindingDir = new UnsafeUrlHostBindingDir();
static ngDirectiveDef = ɵɵdefineDirective({
type: UnsafeUrlHostBindingDir,
selectors: [['', 'unsafeUrlHostBindingDir', '']],
factory: () => hostBindingDir = new UnsafeUrlHostBindingDir(),
hostBindings: (rf: RenderFlags, ctx: any, elementIndex: number) => {
if (rf & RenderFlags.Create) {
ɵɵallocHostVars(1);
@ -1143,10 +1134,10 @@ describe('sanitization', () => {
}
class SimpleComp {
static ngFactoryDef = () => new SimpleComp();
static ngComponentDef = ɵɵdefineComponent({
type: SimpleComp,
selectors: [['sanitize-this']],
factory: () => new SimpleComp(),
consts: 1,
vars: 0,
template: (rf: RenderFlags, ctx: SimpleComp) => {

7
packages/core/test/render3/ivy/jit_spec.ts
View File

@ -15,7 +15,7 @@ import {ivyEnabled} from '@angular/core/src/ivy_switch';
import {ContentChild, ContentChildren, ViewChild, ViewChildren} from '@angular/core/src/metadata/di';
import {Component, Directive, HostBinding, HostListener, Input, Output, Pipe} from '@angular/core/src/metadata/directives';
import {NgModule, NgModuleDef} from '@angular/core/src/metadata/ng_module';
import {ComponentDef, PipeDef} from '@angular/core/src/render3/interfaces/definition';
import {ComponentDef, FactoryFn, PipeDef} from '@angular/core/src/render3/interfaces/definition';
ivyEnabled && describe('render3 jit', () => {
@ -34,7 +34,7 @@ ivyEnabled && describe('render3 jit', () => {
const SomeCmpAny = SomeCmp as any;
expect(SomeCmpAny.ngComponentDef).toBeDefined();
expect(SomeCmpAny.ngComponentDef.factory() instanceof SomeCmp).toBe(true);
expect(SomeCmpAny.ngFactoryDef() instanceof SomeCmp).toBe(true);
});
it('compiles an injectable with a type provider', () => {
@ -242,9 +242,10 @@ ivyEnabled && describe('render3 jit', () => {
}
const pipeDef = (P as any).ngPipeDef as PipeDef<P>;
const pipeFactory = (P as any).ngFactoryDef as FactoryFn<P>;
expect(pipeDef.name).toBe('test-pipe');
expect(pipeDef.pure).toBe(false, 'pipe should not be pure');
expect(pipeDef.factory() instanceof P)
expect(pipeFactory() instanceof P)
.toBe(true, 'factory() should create an instance of the pipe');
});

1
packages/core/test/render3/jit_environment_spec.ts
View File

@ -18,6 +18,7 @@ const INTERFACE_EXCEPTIONS = new Set<string>([
'ɵɵInjectorDef',
'ɵɵNgModuleDefWithMeta',
'ɵɵPipeDefWithMeta',
'ɵɵFactoryDef',
]);
describe('r3 jit environment', () => {

6
packages/core/test/render3/lifecycle_spec.ts
View File

@ -56,12 +56,12 @@ describe('lifecycles', () => {
events.push(`${name}${this.val}`);
}
static ngFactoryDef = () => new Component();
static ngComponentDef = ɵɵdefineComponent({
type: Component,
selectors: [[name]],
consts: consts,
vars: vars,
factory: () => new Component(),
inputs: {val: 'val'}, template,
directives: directives
});
@ -71,8 +71,8 @@ describe('lifecycles', () => {
class Directive {
ngOnInit() { events.push('dir'); }
static ngDirectiveDef = ɵɵdefineDirective(
{type: Directive, selectors: [['', 'dir', '']], factory: () => new Directive()});
static ngFactoryDef = () => new Directive();
static ngDirectiveDef = ɵɵdefineDirective({type: Directive, selectors: [['', 'dir', '']]});
}
const directives = [Comp, Parent, ProjectedComp, Directive, NgIf];

46
packages/core/test/render3/listeners_spec.ts
View File

@ -27,6 +27,13 @@ describe('event listeners', () => {
onClick() { this.counter++; }
static ngFactoryDef =
() => {
let comp = new MyComp();
comps.push(comp);
return comp;
}
static ngComponentDef = ɵɵdefineComponent({
type: MyComp,
selectors: [['comp']],
@ -42,11 +49,6 @@ describe('event listeners', () => {
}
ɵɵelementEnd();
}
},
factory: () => {
let comp = new MyComp();
comps.push(comp);
return comp;
}
});
}
@ -58,6 +60,13 @@ describe('event listeners', () => {
/* @HostListener('body:click') */
onBodyClick() { events.push('component - body:click'); }
static ngFactoryDef =
() => {
let comp = new MyCompWithGlobalListeners();
comps.push(comp);
return comp;
}
static ngComponentDef = ɵɵdefineComponent({
type: MyCompWithGlobalListeners,
selectors: [['comp']],
@ -68,11 +77,6 @@ describe('event listeners', () => {
ɵɵtext(0, 'Some text');
}
},
factory: () => {
let comp = new MyCompWithGlobalListeners();
comps.push(comp);
return comp;
},
hostBindings: function HostListenerDir_HostBindings(
rf: RenderFlags, ctx: any, elIndex: number) {
if (rf & RenderFlags.Create) {
@ -94,10 +98,12 @@ describe('event listeners', () => {
/* @HostListener('body:click') */
onBodyClick() { events.push('directive - body:click'); }
static ngFactoryDef = function HostListenerDir_Factory() {
return new GlobalHostListenerDir();
};
static ngDirectiveDef = ɵɵdefineDirective({
type: GlobalHostListenerDir,
selectors: [['', 'hostListenerDir', '']],
factory: function HostListenerDir_Factory() { return new GlobalHostListenerDir(); },
hostBindings: function HostListenerDir_HostBindings(
rf: RenderFlags, ctx: any, elIndex: number) {
if (rf & RenderFlags.Create) {
@ -128,10 +134,10 @@ describe('event listeners', () => {
return this.handlerReturnValue;
}
static ngFactoryDef = () => new PreventDefaultComp();
static ngComponentDef = ɵɵdefineComponent({
type: PreventDefaultComp,
selectors: [['prevent-default-comp']],
factory: () => new PreventDefaultComp(),
consts: 2,
vars: 0,
/** <button (click)="onClick($event)">Click</button> */
@ -319,10 +325,10 @@ describe('event listeners', () => {
onClick() { this.counter++; }
static ngFactoryDef = () => new AppComp();
static ngComponentDef = ɵɵdefineComponent({
type: AppComp,
selectors: [['app-comp']],
factory: () => new AppComp(),
consts: 1,
vars: 0,
template: function(rf: RenderFlags, ctx: any) {
@ -380,10 +386,10 @@ describe('event listeners', () => {
onClick(index: number) { this.counters[index]++; }
static ngFactoryDef = () => new AppComp();
static ngComponentDef = ɵɵdefineComponent({
type: AppComp,
selectors: [['app-comp']],
factory: () => new AppComp(),
consts: 1,
vars: 0,
template: function(rf: RenderFlags, ctx: any) {
@ -444,10 +450,10 @@ describe('event listeners', () => {
onClick(index: number) { this.counters[index]++; }
static ngFactoryDef = () => new AppComp();
static ngComponentDef = ɵɵdefineComponent({
type: AppComp,
selectors: [['app-comp']],
factory: () => new AppComp(),
consts: 1,
vars: 0,
template: function(rf: RenderFlags, ctx: any) {
@ -523,6 +529,7 @@ describe('event listeners', () => {
/* @HostListener('click') */
onClick() { events.push('click!'); }
static ngFactoryDef = () => { return new MyComp(); };
static ngComponentDef = ɵɵdefineComponent({
type: MyComp,
selectors: [['comp']],
@ -533,7 +540,6 @@ describe('event listeners', () => {
ɵɵtext(0, 'Some text');
}
},
factory: () => { return new MyComp(); },
hostBindings: function HostListenerDir_HostBindings(
rf: RenderFlags, ctx: any, elIndex: number) {
if (rf & RenderFlags.Create) {
@ -574,10 +580,10 @@ describe('event listeners', () => {
/* @HostListener('click') */
onClick() { events.push('click!'); }
static ngFactoryDef = function HostListenerDir_Factory() { return new HostListenerDir(); };
static ngDirectiveDef = ɵɵdefineDirective({
type: HostListenerDir,
selectors: [['', 'hostListenerDir', '']],
factory: function HostListenerDir_Factory() { return new HostListenerDir(); },
hostBindings: function HostListenerDir_HostBindings(
rf: RenderFlags, ctx: any, elIndex: number) {
if (rf & RenderFlags.Create) {
@ -626,6 +632,7 @@ describe('event listeners', () => {
onClick(a: any, b: any) { this.counter += a + b; }
static ngFactoryDef = () => new MyComp();
static ngComponentDef = ɵɵdefineComponent({
type: MyComp,
selectors: [['comp']],
@ -641,8 +648,7 @@ describe('event listeners', () => {
}
ɵɵelementEnd();
}
},
factory: () => new MyComp()
}
});
}
@ -907,10 +913,10 @@ describe('event listeners', () => {
onClick(comp: any) { this.comp = comp; }
static ngFactoryDef = () => new App();
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app']],
factory: () => new App(),
consts: 3,
vars: 0,
template: (rf: RenderFlags, ctx: App) => {

11
packages/core/test/render3/outputs_spec.ts
View File

@ -21,13 +21,13 @@ describe('outputs', () => {
change = new EventEmitter();
resetStream = new EventEmitter();
static ngFactoryDef = () => buttonToggle = new ButtonToggle();
static ngComponentDef = ɵɵdefineComponent({
type: ButtonToggle,
selectors: [['button-toggle']],
template: function(rf: RenderFlags, ctx: any) {},
consts: 0,
vars: 0,
factory: () => buttonToggle = new ButtonToggle(),
outputs: {change: 'change', resetStream: 'reset'}
});
}
@ -37,12 +37,9 @@ describe('outputs', () => {
class OtherDir {
changeStream = new EventEmitter();
static ngDirectiveDef = ɵɵdefineDirective({
type: OtherDir,
selectors: [['', 'otherDir', '']],
factory: () => otherDir = new OtherDir,
outputs: {changeStream: 'change'}
});
static ngFactoryDef = () => otherDir = new OtherDir;
static ngDirectiveDef = ɵɵdefineDirective(
{type: OtherDir, selectors: [['', 'otherDir', '']], outputs: {changeStream: 'change'}});
}

8
packages/core/test/render3/pipe_spec.ts
View File

@ -29,12 +29,8 @@ describe('pipe', () => {
class WrappingPipe implements PipeTransform {
transform(value: any) { return new WrappedValue('Bar'); }
static ngPipeDef = ɵɵdefinePipe({
name: 'wrappingPipe',
type: WrappingPipe,
factory: function WrappingPipe_Factory() { return new WrappingPipe(); },
pure: false
});
static ngFactoryDef = function WrappingPipe_Factory() { return new WrappingPipe(); };
static ngPipeDef = ɵɵdefinePipe({name: 'wrappingPipe', type: WrappingPipe, pure: false});
}
function createTemplate() {

83
packages/core/test/render3/providers_spec.ts
View File

@ -866,10 +866,12 @@ describe('providers', () => {
class Repeated {
constructor(private s: String, private n: Number) {}
static ngFactoryDef =
() => { return new Repeated(ɵɵdirectiveInject(String), ɵɵdirectiveInject(Number)); }
static ngComponentDef = ɵɵdefineComponent({
type: Repeated,
selectors: [['repeated']],
factory: () => new Repeated(ɵɵdirectiveInject(String), ɵɵdirectiveInject(Number)),
consts: 2,
vars: 2,
template: function(fs: RenderFlags, ctx: Repeated) {
@ -898,10 +900,10 @@ describe('providers', () => {
[{provide: String, useValue: 'foo'}, {provide: Number, useValue: 2, multi: true}],
})
class ComponentWithProviders {
static ngFactoryDef = () => new ComponentWithProviders();
static ngComponentDef = ɵɵdefineComponent({
type: ComponentWithProviders,
selectors: [['component-with-providers']],
factory: () => new ComponentWithProviders(),
consts: 2,
vars: 0,
template: function(fs: RenderFlags, ctx: ComponentWithProviders) {
@ -951,10 +953,12 @@ describe('providers', () => {
class Repeated {
constructor(private s: String, private n: Number) {}
static ngFactoryDef =
() => { return new Repeated(ɵɵdirectiveInject(String), ɵɵdirectiveInject(Number)); }
static ngComponentDef = ɵɵdefineComponent({
type: Repeated,
selectors: [['repeated']],
factory: () => new Repeated(ɵɵdirectiveInject(String), ɵɵdirectiveInject(Number)),
consts: 2,
vars: 2,
template: function(fs: RenderFlags, ctx: Repeated) {
@ -986,10 +990,10 @@ describe('providers', () => {
viewProviders: [{provide: toString, useValue: 'foo'}],
})
class ComponentWithProviders {
static ngFactoryDef = () => new ComponentWithProviders();
static ngComponentDef = ɵɵdefineComponent({
type: ComponentWithProviders,
selectors: [['component-with-providers']],
factory: () => new ComponentWithProviders(),
consts: 2,
vars: 0,
template: function(fs: RenderFlags, ctx: ComponentWithProviders) {
@ -1035,10 +1039,10 @@ describe('providers', () => {
class EmbeddedComponent {
constructor(private s: String) {}
static ngFactoryDef = () => new EmbeddedComponent(ɵɵdirectiveInject(String));
static ngComponentDef = ɵɵdefineComponent({
type: EmbeddedComponent,
selectors: [['embedded-cmp']],
factory: () => new EmbeddedComponent(ɵɵdirectiveInject(String)),
consts: 1,
vars: 1,
template: (rf: RenderFlags, cmp: EmbeddedComponent) => {
@ -1057,22 +1061,23 @@ describe('providers', () => {
class HostComponent {
constructor(public vcref: ViewContainerRef, public cfr: ComponentFactoryResolver) {}
static ngComponentDef = ɵɵdefineComponent({
type: HostComponent,
selectors: [['host-cmp']],
factory: () => hostComponent = new HostComponent(
ɵɵdirectiveInject(ViewContainerRef as any), injectComponentFactoryResolver()),
consts: 1,
vars: 0,
template: (rf: RenderFlags, cmp: HostComponent) => {
if (rf & RenderFlags.Create) {
ɵɵtext(0, 'foo');
}
},
features: [
ɵɵProvidersFeature([{provide: String, useValue: 'From host component'}]),
],
});
static ngFactoryDef = () => hostComponent = new HostComponent(
ɵɵdirectiveInject(ViewContainerRef as any), injectComponentFactoryResolver())
static ngComponentDef = ɵɵdefineComponent({
type: HostComponent,
selectors: [['host-cmp']],
consts: 1,
vars: 0,
template: (rf: RenderFlags, cmp: HostComponent) => {
if (rf & RenderFlags.Create) {
ɵɵtext(0, 'foo');
}
},
features: [
ɵɵProvidersFeature([{provide: String, useValue: 'From host component'}]),
],
});
}
@Component({
@ -1082,10 +1087,10 @@ describe('providers', () => {
class AppComponent {
constructor() {}
static ngFactoryDef = () => new AppComponent();
static ngComponentDef = ɵɵdefineComponent({
type: AppComponent,
selectors: [['app-cmp']],
factory: () => new AppComponent(),
consts: 1,
vars: 0,
template: (rf: RenderFlags, cmp: AppComponent) => {
@ -1244,10 +1249,10 @@ describe('providers', () => {
class MyComponent {
constructor() {}
static ngFactoryDef = () => new MyComponent();
static ngComponentDef = ɵɵdefineComponent({
type: MyComponent,
selectors: [['my-cmp']],
factory: () => new MyComponent(),
consts: 1,
vars: 0,
template: (rf: RenderFlags, cmp: MyComponent) => {
@ -1271,10 +1276,10 @@ describe('providers', () => {
class AppComponent {
constructor() {}
static ngFactoryDef = () => new AppComponent();
static ngComponentDef = ɵɵdefineComponent({
type: AppComponent,
selectors: [['app-cmp']],
factory: () => new AppComponent(),
consts: 1,
vars: 0,
template: (rf: RenderFlags, cmp: AppComponent) => {
@ -1334,10 +1339,12 @@ describe('providers', () => {
class MyComponent {
constructor(foo: InjectableWithLifeCycleHooks) {}
static ngFactoryDef =
() => { return new MyComponent(ɵɵdirectiveInject(InjectableWithLifeCycleHooks)); }
static ngComponentDef = ɵɵdefineComponent({
type: MyComponent,
selectors: [['my-comp']],
factory: () => new MyComponent(ɵɵdirectiveInject(InjectableWithLifeCycleHooks)),
consts: 1,
vars: 0,
template: (rf: RenderFlags, ctx: MyComponent) => {
@ -1361,10 +1368,10 @@ describe('providers', () => {
class App {
public condition = true;
static ngFactoryDef = () => new App();
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app-cmp']],
factory: () => new App(),
consts: 2,
vars: 0,
template: (rf: RenderFlags, ctx: App) => {
@ -1436,40 +1443,40 @@ function expectProvidersScenario(defs: {
}
class ViewChildComponent {
static ngFactoryDef = () => testComponentInjection(defs.viewChild, new ViewChildComponent());
static ngComponentDef = ɵɵdefineComponent({
type: ViewChildComponent,
selectors: [['view-child']],
consts: 1,
vars: 0,
factory: () => testComponentInjection(defs.viewChild, new ViewChildComponent()),
template: function(fs: RenderFlags, ctx: ViewChildComponent) {
if (fs & RenderFlags.Create) {
ɵɵtext(0, 'view-child');
}
},
features: defs.viewChild &&
[
ɵɵProvidersFeature(defs.viewChild.providers || [], defs.viewChild.viewProviders || []),
],
[ɵɵProvidersFeature(defs.viewChild.providers || [], defs.viewChild.viewProviders || [])]
});
}
class ViewChildDirective {
static ngFactoryDef = () => testDirectiveInjection(defs.viewChild, new ViewChildDirective());
static ngDirectiveDef = ɵɵdefineDirective({
type: ViewChildDirective,
selectors: [['view-child']],
factory: () => testDirectiveInjection(defs.viewChild, new ViewChildDirective()),
features: defs.viewChild && [ɵɵProvidersFeature(defs.viewChild.directiveProviders || [])],
});
}
class ContentChildComponent {
static ngFactoryDef =
() => { return testComponentInjection(defs.contentChild, new ContentChildComponent()); }
static ngComponentDef = ɵɵdefineComponent({
type: ContentChildComponent,
selectors: [['content-child']],
consts: 1,
vars: 0,
factory: () => testComponentInjection(defs.contentChild, new ContentChildComponent()),
template: function(fs: RenderFlags, ctx: ParentComponent) {
if (fs & RenderFlags.Create) {
ɵɵtext(0, 'content-child');
@ -1482,10 +1489,12 @@ function expectProvidersScenario(defs: {
}
class ContentChildDirective {
static ngFactoryDef =
() => { return testDirectiveInjection(defs.contentChild, new ContentChildDirective()); }
static ngDirectiveDef = ɵɵdefineDirective({
type: ContentChildDirective,
selectors: [['content-child']],
factory: () => testDirectiveInjection(defs.contentChild, new ContentChildDirective()),
features:
defs.contentChild && [ɵɵProvidersFeature(defs.contentChild.directiveProviders || [])],
});
@ -1493,12 +1502,12 @@ function expectProvidersScenario(defs: {
class ParentComponent {
static ngFactoryDef = () => testComponentInjection(defs.parent, new ParentComponent());
static ngComponentDef = ɵɵdefineComponent({
type: ParentComponent,
selectors: [['parent']],
consts: 1,
vars: 0,
factory: () => testComponentInjection(defs.parent, new ParentComponent()),
template: function(fs: RenderFlags, ctx: ParentComponent) {
if (fs & RenderFlags.Create) {
ɵɵelement(0, 'view-child');
@ -1511,31 +1520,31 @@ function expectProvidersScenario(defs: {
}
class ParentDirective {
static ngFactoryDef = () => testDirectiveInjection(defs.parent, new ParentDirective());
static ngDirectiveDef = ɵɵdefineDirective({
type: ParentDirective,
selectors: [['parent']],
factory: () => testDirectiveInjection(defs.parent, new ParentDirective()),
features: defs.parent && [ɵɵProvidersFeature(defs.parent.directiveProviders || [])],
});
}
class ParentDirective2 {
static ngFactoryDef = () => testDirectiveInjection(defs.parent, new ParentDirective2());
static ngDirectiveDef = ɵɵdefineDirective({
type: ParentDirective2,
selectors: [['parent']],
factory: () => testDirectiveInjection(defs.parent, new ParentDirective2()),
features: defs.parent && [ɵɵProvidersFeature(defs.parent.directive2Providers || [])],
});
}
class App {
static ngFactoryDef = () => testComponentInjection(defs.app, new App());
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app']],
consts: 2,
vars: 0,
factory: () => testComponentInjection(defs.app, new App()),
template: function(fs: RenderFlags, ctx: App) {
if (fs & RenderFlags.Create) {
ɵɵelementStart(0, 'parent');

2
packages/core/test/render3/pure_function_spec.ts
View File

@ -19,10 +19,10 @@ describe('object literals', () => {
// TODO(issue/24571): remove '!'.
config !: {[key: string]: any};
static ngFactoryDef = function ObjectComp_Factory() { return objectComp = new ObjectComp(); };
static ngComponentDef = ɵɵdefineComponent({
type: ObjectComp,
selectors: [['object-comp']],
factory: function ObjectComp_Factory() { return objectComp = new ObjectComp(); },
consts: 0,
vars: 1,
template: function ObjectComp_Template() {},

51
packages/core/test/render3/query_spec.ts
View File

@ -217,12 +217,12 @@ describe('query', () => {
class MyDirective {
constructor(public service: Service) {}
static ngFactoryDef = function MyDirective_Factory() {
return directive = new MyDirective(ɵɵdirectiveInject(Service));
};
static ngDirectiveDef = ɵɵdefineDirective({
type: MyDirective,
selectors: [['', 'myDir', '']],
factory: function MyDirective_Factory() {
return directive = new MyDirective(ɵɵdirectiveInject(Service));
},
features: [ɵɵProvidersFeature([Service, {provide: Alias, useExisting: Service}])],
});
}
@ -245,12 +245,12 @@ describe('query', () => {
service?: Service;
alias?: Alias;
static ngFactoryDef = function App_Factory() { return new App(); };
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app']],
consts: 1,
vars: 0,
factory: function App_Factory() { return new App(); },
template: function App_Template(rf: RenderFlags, ctx: App) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['myDir']);
@ -290,12 +290,12 @@ describe('query', () => {
class App {
service?: Service;
static ngFactoryDef = function App_Factory() { return new App(); };
static ngComponentDef = ɵɵdefineComponent({
type: App,
selectors: [['app']],
consts: 1,
vars: 0,
factory: function App_Factory() { return new App(); },
template: function App_Template(rf: RenderFlags, ctx: App) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'div', ['myDir']);
@ -833,10 +833,10 @@ describe('query', () => {
let childInstance: Child;
class Child {
static ngFactoryDef = () => childInstance = new Child();
static ngComponentDef = ɵɵdefineComponent({
type: Child,
selectors: [['child']],
factory: () => childInstance = new Child(),
consts: 0,
vars: 0,
template: (rf: RenderFlags, ctx: Child) => {},
@ -1406,13 +1406,13 @@ describe('query', () => {
this.vcr.createEmbeddedView(this.temp);
}
static ngDirectiveDef = ɵɵdefineDirective({
type: SomeDir,
selectors: [['', 'someDir', '']],
factory:
() => new SomeDir(
ɵɵdirectiveInject(ViewContainerRef as any), ɵɵdirectiveInject(TemplateRef as any))
});
static ngFactoryDef = () => new SomeDir(
ɵɵdirectiveInject(ViewContainerRef as any), ɵɵdirectiveInject(TemplateRef as any))
static ngDirectiveDef = ɵɵdefineDirective({
type: SomeDir,
selectors: [['', 'someDir', '']],
});
}
function AppComponent_Template_1(rf: RenderFlags, ctx: any) {
@ -1467,10 +1467,10 @@ describe('query', () => {
this.contentCheckedQuerySnapshot = this.foos ? this.foos.length : 0;
}
static ngFactoryDef = () => withContentInstance = new WithContentDirective();
static ngDirectiveDef = ɵɵdefineDirective({
type: WithContentDirective,
selectors: [['', 'with-content', '']],
factory: () => withContentInstance = new WithContentDirective(),
contentQueries: (rf: RenderFlags, ctx: any, dirIndex: number) => {
if (rf & RenderFlags.Create) {
ɵɵcontentQuery(dirIndex, ['foo'], true);
@ -1655,11 +1655,11 @@ describe('query', () => {
it('should report results to appropriate queries where deep content queries are nested', () => {
class QueryDirective {
fooBars: any;
static ngFactoryDef = () => new QueryDirective();
static ngDirectiveDef = ɵɵdefineDirective({
type: QueryDirective,
selectors: [['', 'query', '']],
exportAs: ['query'],
factory: () => new QueryDirective(),
contentQueries: (rf: RenderFlags, ctx: any, dirIndex: number) => {
// @ContentChildren('foo, bar, baz', {descendants: true})
// fooBars: QueryList<ElementRef>;
@ -1720,11 +1720,11 @@ describe('query', () => {
class QueryDirective {
fooBars: any;
static ngFactoryDef = () => new QueryDirective();
static ngDirectiveDef = ɵɵdefineDirective({
type: QueryDirective,
selectors: [['', 'query', '']],
exportAs: ['query'],
factory: () => new QueryDirective(),
contentQueries: (rf: RenderFlags, ctx: any, dirIndex: number) => {
// @ContentChildren('foo', {descendants: true})
// fooBars: QueryList<ElementRef>;
@ -1777,11 +1777,11 @@ describe('query', () => {
class QueryDirective {
fooBars: any;
static ngFactoryDef = () => new QueryDirective();
static ngDirectiveDef = ɵɵdefineDirective({
type: QueryDirective,
selectors: [['', 'query', '']],
exportAs: ['query'],
factory: () => new QueryDirective(),
contentQueries: (rf: RenderFlags, ctx: any, dirIndex: number) => {
// @ContentChildren('foo', {descendants: true})
// fooBars: QueryList<ElementRef>;
@ -1838,11 +1838,11 @@ describe('query', () => {
() => {
class ShallowQueryDirective {
foos: any;
static ngFactoryDef = () => new ShallowQueryDirective();
static ngDirectiveDef = ɵɵdefineDirective({
type: ShallowQueryDirective,
selectors: [['', 'shallow-query', '']],
exportAs: ['shallow-query'],
factory: () => new ShallowQueryDirective(),
contentQueries: (rf: RenderFlags, ctx: any, dirIndex: number) => {
// @ContentChildren('foo', {descendants: false})
// foos: QueryList<ElementRef>;
@ -1859,11 +1859,11 @@ describe('query', () => {
class DeepQueryDirective {
foos: any;
static ngFactoryDef = () => new DeepQueryDirective();
static ngDirectiveDef = ɵɵdefineDirective({
type: DeepQueryDirective,
selectors: [['', 'deep-query', '']],
exportAs: ['deep-query'],
factory: () => new DeepQueryDirective(),
contentQueries: (rf: RenderFlags, ctx: any, dirIndex: number) => {
// @ContentChildren('foo', {descendants: true})
// foos: QueryList<ElementRef>;
@ -1922,12 +1922,9 @@ describe('query', () => {
class TextDirective {
value !: string;
static ngDirectiveDef = ɵɵdefineDirective({
type: TextDirective,
selectors: [['', 'text', '']],
factory: () => new TextDirective(),
inputs: {value: 'text'}
});
static ngFactoryDef = () => new TextDirective();
static ngDirectiveDef = ɵɵdefineDirective(
{type: TextDirective, selectors: [['', 'text', '']], inputs: {value: 'text'}});
}
it('should register content matches from top to bottom', () => {
@ -1937,10 +1934,10 @@ describe('query', () => {
// @ContentChildren(TextDirective)
texts !: QueryList<TextDirective>;
static ngFactoryDef = () => contentQueryDirective = new ContentQueryDirective();
static ngComponentDef = ɵɵdefineDirective({
type: ContentQueryDirective,
selectors: [['', 'content-query', '']],
factory: () => contentQueryDirective = new ContentQueryDirective(),
contentQueries: (rf: RenderFlags, ctx: any, dirIndex: number) => {
// @ContentChildren(TextDirective, {descendants: true})
// texts: QueryList<TextDirective>;
@ -2005,10 +2002,10 @@ describe('query', () => {
// @ViewChildren(TextDirective)
texts !: QueryList<TextDirective>;
static ngFactoryDef = () => new ViewQueryComponent();
static ngComponentDef = ɵɵdefineComponent({
type: ViewQueryComponent,
selectors: [['view-query']],
factory: () => new ViewQueryComponent(),
template: function(rf: RenderFlags, ctx: ViewQueryComponent) {
if (rf & RenderFlags.Create) {
ɵɵelement(0, 'span', ['text', 'A']);

5
packages/core/test/render3/render_util.ts
View File

@ -260,7 +260,6 @@ export function renderTemplate<T>(
selectView(hostLView, null); // SUSPECT! why do we need to enter the View?
const def: ComponentDef<any> = ɵɵdefineComponent({
factory: () => null,
selectors: [],
type: Object,
template: templateFn,
@ -369,12 +368,12 @@ export function createComponent(
viewProviders: Provider[] = [], hostBindings?: HostBindingsFunction<any>): ComponentType<any> {
return class Component {
value: any;
static ngFactoryDef = () => new Component;
static ngComponentDef = ɵɵdefineComponent({
type: Component,
selectors: [[name]],
consts: consts,
vars: vars,
factory: () => new Component,
template: template,
viewQuery: viewQuery,
directives: directives, hostBindings,
@ -388,10 +387,10 @@ export function createComponent(
export function createDirective(
name: string, {exportAs}: {exportAs?: string[]} = {}): DirectiveType<any> {
return class Directive {
static ngFactoryDef = () => new Directive();
static ngDirectiveDef = ɵɵdefineDirective({
type: Directive,
selectors: [['', name, '']],
factory: () => new Directive(),
exportAs: exportAs,
});
};

10
packages/core/test/render3/renderer_factory_spec.ts
View File

@ -26,6 +26,7 @@ describe('renderer factory lifecycle', () => {
rendererFactory.end = () => logs.push('end');
class SomeComponent {
static ngFactoryDef = () => new SomeComponent;
static ngComponentDef = ɵɵdefineComponent({
type: SomeComponent,
encapsulation: ViewEncapsulation.None,
@ -40,12 +41,12 @@ describe('renderer factory lifecycle', () => {
if (rf & RenderFlags.Update) {
logs.push('component update');
}
},
factory: () => new SomeComponent
}
});
}
class SomeComponentWhichThrows {
static ngFactoryDef = () => new SomeComponentWhichThrows;
static ngComponentDef = ɵɵdefineComponent({
type: SomeComponentWhichThrows,
encapsulation: ViewEncapsulation.None,
@ -54,8 +55,7 @@ describe('renderer factory lifecycle', () => {
vars: 0,
template: function(rf: RenderFlags, ctx: SomeComponentWhichThrows) {
throw(new Error('SomeComponentWhichThrows threw'));
},
factory: () => new SomeComponentWhichThrows
}
});
}
@ -150,6 +150,7 @@ describe('Renderer2 destruction hooks', () => {
it('should call renderer.destroy for each component destroyed', () => {
class SimpleComponent {
static ngFactoryDef = () => new SimpleComponent;
static ngComponentDef = ɵɵdefineComponent({
type: SimpleComponent,
encapsulation: ViewEncapsulation.None,
@ -161,7 +162,6 @@ describe('Renderer2 destruction hooks', () => {
ɵɵelement(0, 'span');
}
},
factory: () => new SimpleComponent,
});
}

126
packages/core/test/render3/view_container_ref_spec.ts
View File

@ -29,14 +29,14 @@ describe('ViewContainerRef', () => {
beforeEach(() => directiveInstance = null);
class DirectiveWithVCRef {
static ngDirectiveDef = ɵɵdefineDirective({
type: DirectiveWithVCRef,
selectors: [['', 'vcref', '']],
factory: () => directiveInstance = new DirectiveWithVCRef(
static ngFactoryDef = () => directiveInstance = new DirectiveWithVCRef(
ɵɵdirectiveInject(ViewContainerRef as any), injectComponentFactoryResolver())
ɵɵdirectiveInject(ViewContainerRef as any), injectComponentFactoryResolver()),
inputs: {tplRef: 'tplRef', name: 'name'}
});
static ngDirectiveDef = ɵɵdefineDirective({
type: DirectiveWithVCRef,
selectors: [['', 'vcref', '']],
inputs: {tplRef: 'tplRef', name: 'name'}
});
// TODO(issue/24571): remove '!'.
tplRef !: TemplateRef<{}>;
@ -57,18 +57,20 @@ describe('ViewContainerRef', () => {
let directiveInstances: TestDirective[] = [];
class TestDirective {
static ngFactoryDef =
() => {
const instance = new TestDirective(
ɵɵdirectiveInject(ViewContainerRef as any),
ɵɵdirectiveInject(TemplateRef as any));
directiveInstances.push(instance);
return instance;
}
static ngDirectiveDef = ɵɵdefineDirective({
type: TestDirective,
selectors: [['', 'testdir', '']],
factory: () => {
const instance = new TestDirective(
ɵɵdirectiveInject(ViewContainerRef as any),
ɵɵdirectiveInject(TemplateRef as any));
directiveInstances.push(instance);
return instance;
}
});
constructor(private _vcRef: ViewContainerRef, private _tplRef: TemplateRef<{}>) {}
@ -99,11 +101,11 @@ describe('ViewContainerRef', () => {
class TestComponent {
// TODO(issue/24571): remove '!'.
testDir !: TestDirective;
static ngFactoryDef = () => new TestComponent();
static ngComponentDef = ɵɵdefineComponent({
type: TestComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['test-cmp']],
factory: () => new TestComponent(),
consts: 4,
vars: 0,
template: (rf: RenderFlags, cmp: TestComponent) => {
@ -134,13 +136,11 @@ describe('ViewContainerRef', () => {
let directiveInstance: TestDirective;
class TestDirective {
static ngDirectiveDef = ɵɵdefineDirective({
type: TestDirective,
selectors: [['', 'testdir', '']],
factory: () => directiveInstance = new TestDirective(
ɵɵdirectiveInject(ViewContainerRef as any),
ɵɵdirectiveInject(TemplateRef as any))
});
static ngFactoryDef = () => directiveInstance = new TestDirective(
ɵɵdirectiveInject(ViewContainerRef as any), ɵɵdirectiveInject(TemplateRef as any))
static ngDirectiveDef =
ɵɵdefineDirective({type: TestDirective, selectors: [['', 'testdir', '']]});
constructor(private _vcRef: ViewContainerRef, private _tplRef: TemplateRef<{}>) {}
@ -172,13 +172,13 @@ describe('ViewContainerRef', () => {
condition = false;
// TODO(issue/24571): remove '!'.
testDir !: TestDirective;
static ngFactoryDef = () => new TestComponent();
static ngComponentDef = ɵɵdefineComponent({
type: TestComponent,
encapsulation: ViewEncapsulation.None,
selectors: [['test-cmp']],
consts: 4,
vars: 0,
factory: () => new TestComponent(),
template: (rf: RenderFlags, cmp: TestComponent) => {
if (rf & RenderFlags.Create) {
ɵɵtext(0, 'before|');
@ -239,12 +239,15 @@ describe('ViewContainerRef', () => {
class AppComp {
constructor(public vcr: ViewContainerRef, public cfr: ComponentFactoryResolver) {}
static ngFactoryDef =
() => {
return new AppComp(
ɵɵdirectiveInject(ViewContainerRef as any), injectComponentFactoryResolver());
}
static ngComponentDef = ɵɵdefineComponent({
type: AppComp,
selectors: [['app-comp']],
factory:
() => new AppComp(
ɵɵdirectiveInject(ViewContainerRef as any), injectComponentFactoryResolver()),
consts: 0,
vars: 0,
template: (rf: RenderFlags, cmp: AppComp) => {}
@ -256,10 +259,11 @@ describe('ViewContainerRef', () => {
ngDoCheck() { this.doCheckCount++; }
static ngFactoryDef = () => dynamicComp = new DynamicComp();
static ngComponentDef = ɵɵdefineComponent({
type: DynamicComp,
selectors: [['dynamic-comp']],
factory: () => dynamicComp = new DynamicComp(),
consts: 0,
vars: 0,
template: (rf: RenderFlags, cmp: DynamicComp) => {}
@ -355,15 +359,16 @@ describe('ViewContainerRef', () => {
@Component({selector: 'app', template: ''})
class AppCmpt {
static ngComponentDef = ɵɵdefineComponent({
type: AppCmpt,
selectors: [['app']],
factory: () => new AppCmpt(
ɵɵdirectiveInject(ViewContainerRef as any), injectComponentFactoryResolver()),
consts: 0,
vars: 0,
template: (rf: RenderFlags, cmp: AppCmpt) => {}
});
static ngFactoryDef = () =>
new AppCmpt(ɵɵdirectiveInject(ViewContainerRef as any), injectComponentFactoryResolver())
static ngComponentDef = ɵɵdefineComponent({
type: AppCmpt,
selectors: [['app']],
consts: 0,
vars: 0,
template: (rf: RenderFlags, cmp: AppCmpt) => {}
});
constructor(private _vcRef: ViewContainerRef, private _cfResolver: ComponentFactoryResolver) {
}
@ -424,10 +429,10 @@ describe('ViewContainerRef', () => {
// @ViewChildren('foo')
foo !: QueryList<any>;
static ngFactoryDef = () => dynamicComp = new DynamicCompWithViewQueries();
static ngComponentDef = ɵɵdefineComponent({
type: DynamicCompWithViewQueries,
selectors: [['dynamic-cmpt-with-view-queries']],
factory: () => dynamicComp = new DynamicCompWithViewQueries(),
consts: 2,
vars: 0,
template: (rf: RenderFlags, ctx: DynamicCompWithViewQueries) => {
@ -468,27 +473,28 @@ describe('ViewContainerRef', () => {
ngOnDestroy() { this.viewRef.destroy(); }
static ngComponentDef = ɵɵdefineComponent({
type: CompWithListenerThatDestroysItself,
selectors: [['comp-with-listener-and-on-destroy']],
consts: 2,
vars: 0,
/** <button (click)="onClick()"> Click me </button> */
template: function CompTemplate(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'button');
{
ɵɵlistener('click', function() { return ctx.onClick(); });
ɵɵtext(1, 'Click me');
}
ɵɵelementEnd();
}
},
// We want the ViewRef, so we rely on the knowledge that `ViewRef` is actually given
// when injecting `ChangeDetectorRef`.
factory: () => new CompWithListenerThatDestroysItself(
ɵɵdirectiveInject(ChangeDetectorRef as any)),
});
// We want the ViewRef, so we rely on the knowledge that `ViewRef` is actually given
// when injecting `ChangeDetectorRef`.
static ngFactoryDef = () =>
new CompWithListenerThatDestroysItself(ɵɵdirectiveInject(ChangeDetectorRef as any))
static ngComponentDef = ɵɵdefineComponent({
type: CompWithListenerThatDestroysItself,
selectors: [['comp-with-listener-and-on-destroy']],
consts: 2,
vars: 0,
/** <button (click)="onClick()"> Click me </button> */
template: function CompTemplate(rf: RenderFlags, ctx: any) {
if (rf & RenderFlags.Create) {
ɵɵelementStart(0, 'button');
{
ɵɵlistener('click', function() { return ctx.onClick(); });
ɵɵtext(1, 'Click me');
}
ɵɵelementEnd();
}
},
});
}

2
packages/core/test/test_bed_spec.ts
View File

@ -503,10 +503,10 @@ describe('TestBed', () => {
*/
const getAOTCompiledComponent = () => {
class ComponentClass {
static ngFactoryDef = () => new ComponentClass();
static ngComponentDef = defineComponent({
type: ComponentClass,
selectors: [['comp']],
factory: () => new ComponentClass(),
consts: 1,
vars: 0,
template: (rf: any, ctx: any) => {