test(compiler-cli): migrate view compliance tests (#39914)

Migrates the `r3_view_compiler` tests to the new format.

PR Close #39914
This commit is contained in:
Kristiyan Kostadinov 2020-12-01 19:12:46 +01:00 committed by Jessica Janiuk
parent 7695671cd6
commit eac85b4e23
20 changed files with 446 additions and 0 deletions

View File

@ -0,0 +1,64 @@
/****************************************************************************************************
* PARTIAL FILE: todo_example.js
****************************************************************************************************/
import { Component, Input, NgModule } from '@angular/core';
import * as i0 from "@angular/core";
export class MyApp {
constructor() {
this.list = [];
}
}
MyApp.ɵfac = function MyApp_Factory(t) { return new (t || MyApp)(); };
MyApp.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyApp, selector: "my-app", ngImport: i0, template: { source: '<todo [data]="list"></todo>', isInline: true }, directives: [{ type: function () { return TodoComponent; }, selector: "todo", inputs: ["data"] }] });
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyApp, [{
type: Component,
args: [{ selector: 'my-app', template: '<todo [data]="list"></todo>' }]
}], null, null); })();
export class TodoComponent {
constructor() {
this.data = [];
}
}
TodoComponent.ɵfac = function TodoComponent_Factory(t) { return new (t || TodoComponent)(); };
TodoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: TodoComponent, selector: "todo", inputs: { data: "data" }, ngImport: i0, template: { source: '<ul class="list" [title]="myTitle"><li *ngFor="let item of data">{{data}}</li></ul>', isInline: true } });
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(TodoComponent, [{
type: Component,
args: [{
selector: 'todo',
template: '<ul class="list" [title]="myTitle"><li *ngFor="let item of data">{{data}}</li></ul>'
}]
}], null, { data: [{
type: Input
}] }); })();
export class TodoModule {
}
TodoModule.ɵmod = i0.ɵɵdefineNgModule({ type: TodoModule });
TodoModule.ɵinj = i0.ɵɵdefineInjector({ factory: function TodoModule_Factory(t) { return new (t || TodoModule)(); } });
(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(TodoModule, { declarations: [TodoComponent, MyApp] }); })();
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(TodoModule, [{
type: NgModule,
args: [{
declarations: [TodoComponent, MyApp],
}]
}], null, null); })();
/****************************************************************************************************
* PARTIAL FILE: todo_example.d.ts
****************************************************************************************************/
import * as i0 from "@angular/core";
export declare class MyApp {
list: any[];
static ɵfac: i0.ɵɵFactoryDef<MyApp, never>;
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyApp, "my-app", never, {}, {}, never, never>;
}
export declare class TodoComponent {
data: any[];
myTitle: string;
static ɵfac: i0.ɵɵFactoryDef<TodoComponent, never>;
static ɵcmp: i0.ɵɵComponentDefWithMeta<TodoComponent, "todo", never, { "data": "data"; }, {}, never, never>;
}
export declare class TodoModule {
static ɵmod: i0.ɵɵNgModuleDefWithMeta<TodoModule, [typeof TodoComponent, typeof MyApp], never, never>;
static ɵinj: i0.ɵɵInjectorDef<TodoModule>;
}

View File

@ -0,0 +1,22 @@
{
"$schema": "../test_case_schema.json",
"cases": [
{
"description": "should be able to generate the TODO example",
"inputFiles": [
"todo_example.ts"
],
"expectations": [
{
"files": [
{
"expected": "todo_example_template.js",
"generated": "todo_example.js"
}
],
"failureMessage": "Incorrect template"
}
]
}
]
}

View File

@ -0,0 +1,75 @@
/****************************************************************************************************
* PARTIAL FILE: static_animation_attribute.js
****************************************************************************************************/
import { Component, NgModule } from '@angular/core';
import * as i0 from "@angular/core";
export class MyApp {
}
MyApp.ɵfac = function MyApp_Factory(t) { return new (t || MyApp)(); };
MyApp.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyApp, selector: "my-app", ngImport: i0, template: { source: '<div @attr [@binding]="exp"></div>', isInline: true } });
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyApp, [{
type: Component,
args: [{ selector: 'my-app', template: '<div @attr [@binding]="exp"></div>' }]
}], null, null); })();
export class MyModule {
}
MyModule.ɵmod = i0.ɵɵdefineNgModule({ type: MyModule });
MyModule.ɵinj = i0.ɵɵdefineInjector({ factory: function MyModule_Factory(t) { return new (t || MyModule)(); } });
(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(MyModule, { declarations: [MyApp] }); })();
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
type: NgModule,
args: [{ declarations: [MyApp] }]
}], null, null); })();
/****************************************************************************************************
* PARTIAL FILE: static_animation_attribute.d.ts
****************************************************************************************************/
import * as i0 from "@angular/core";
export declare class MyApp {
static ɵfac: i0.ɵɵFactoryDef<MyApp, never>;
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyApp, "my-app", never, {}, {}, never, never>;
}
export declare class MyModule {
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof MyApp], never, never>;
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
}
/****************************************************************************************************
* PARTIAL FILE: duplicate_animation_listeners.js
****************************************************************************************************/
import { Component, NgModule } from '@angular/core';
import * as i0 from "@angular/core";
export class MyApp {
}
MyApp.ɵfac = function MyApp_Factory(t) { return new (t || MyApp)(); };
MyApp.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyApp, selector: "my-app", ngImport: i0, template: { source: '<div (@mySelector.start)="false" (@mySelector.done)="false" [@mySelector]="0"></div>', isInline: true } });
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyApp, [{
type: Component,
args: [{
selector: 'my-app',
template: '<div (@mySelector.start)="false" (@mySelector.done)="false" [@mySelector]="0"></div>'
}]
}], null, null); })();
export class MyModule {
}
MyModule.ɵmod = i0.ɵɵdefineNgModule({ type: MyModule });
MyModule.ɵinj = i0.ɵɵdefineInjector({ factory: function MyModule_Factory(t) { return new (t || MyModule)(); } });
(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(MyModule, { declarations: [MyApp] }); })();
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
type: NgModule,
args: [{ declarations: [MyApp] }]
}], null, null); })();
/****************************************************************************************************
* PARTIAL FILE: duplicate_animation_listeners.d.ts
****************************************************************************************************/
import * as i0 from "@angular/core";
export declare class MyApp {
static ɵfac: i0.ɵɵFactoryDef<MyApp, never>;
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyApp, "my-app", never, {}, {}, never, never>;
}
export declare class MyModule {
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof MyApp], never, never>;
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
}

View File

@ -0,0 +1,39 @@
{
"$schema": "../../test_case_schema.json",
"cases": [
{
"description": "should not register any @attr attributes as static attributes",
"inputFiles": [
"static_animation_attribute.ts"
],
"expectations": [
{
"files": [
{
"expected": "static_animation_attribute_template.js",
"generated": "static_animation_attribute.js"
}
],
"failureMessage": "Incorrect initialization attributes"
}
]
},
{
"description": "should dedup multiple [@event] listeners",
"inputFiles": [
"duplicate_animation_listeners.ts"
],
"expectations": [
{
"files": [
{
"expected": "duplicate_animation_listeners_template.js",
"generated": "duplicate_animation_listeners.js"
}
],
"failureMessage": "Incorrect initialization attributes"
}
]
}
]
}

View File

@ -0,0 +1,12 @@
import {Component, NgModule} from '@angular/core';
@Component({
selector: 'my-app',
template: '<div (@mySelector.start)="false" (@mySelector.done)="false" [@mySelector]="0"></div>'
})
export class MyApp {
}
@NgModule({declarations: [MyApp]})
export class MyModule {
}

View File

@ -0,0 +1,7 @@
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵelementStart(0, "div");
$i0$.ɵɵproperty("@mySelector", );
}
}

View File

@ -0,0 +1,9 @@
import {Component, NgModule} from '@angular/core';
@Component({selector: 'my-app', template: '<div @attr [@binding]="exp"></div>'})
export class MyApp {
}
@NgModule({declarations: [MyApp]})
export class MyModule {
}

View File

@ -0,0 +1,8 @@
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$i0$.ɵɵelement(0, "div");
}
if (rf & 2) {
$i0$.ɵɵproperty("@attr", )("@binding", );
}
}

View File

@ -0,0 +1,41 @@
/****************************************************************************************************
* PARTIAL FILE: basic_any_cast.js
****************************************************************************************************/
import { Component } from '@angular/core';
import * as i0 from "@angular/core";
class Comp {
}
Comp.ɵfac = function Comp_Factory(t) { return new (t || Comp)(); };
Comp.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: Comp, selector: "ng-component", ngImport: i0, template: { source: '<div [tabIndex]="$any(10)"></div>', isInline: true } });
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(Comp, [{
type: Component,
args: [{ template: '<div [tabIndex]="$any(10)"></div>' }]
}], null, null); })();
/****************************************************************************************************
* PARTIAL FILE: basic_any_cast.d.ts
****************************************************************************************************/
export {};
/****************************************************************************************************
* PARTIAL FILE: this_any_access.js
****************************************************************************************************/
import { Component } from '@angular/core';
import * as i0 from "@angular/core";
class Comp {
$any(value) {
return value;
}
}
Comp.ɵfac = function Comp_Factory(t) { return new (t || Comp)(); };
Comp.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: Comp, selector: "ng-component", ngImport: i0, template: { source: '<div [tabIndex]="this.$any(null)"></div>', isInline: true } });
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(Comp, [{
type: Component,
args: [{ template: '<div [tabIndex]="this.$any(null)"></div>' }]
}], null, null); })();
/****************************************************************************************************
* PARTIAL FILE: this_any_access.d.ts
****************************************************************************************************/
export {};

View File

@ -0,0 +1,39 @@
{
"$schema": "../../test_case_schema.json",
"cases": [
{
"description": "should strip out $any wrappers",
"inputFiles": [
"basic_any_cast.ts"
],
"expectations": [
{
"files": [
{
"expected": "basic_any_cast_template.js",
"generated": "basic_any_cast.js"
}
],
"failureMessage": "Incorrect template"
}
]
},
{
"description": "should preserve $any if it is accessed through `this`",
"inputFiles": [
"this_any_access.ts"
],
"expectations": [
{
"files": [
{
"expected": "this_any_access_template.js",
"generated": "this_any_access.js"
}
],
"failureMessage": "Incorrect template"
}
]
}
]
}

View File

@ -0,0 +1,5 @@
import {Component} from '@angular/core';
@Component({template: '<div [tabIndex]="$any(10)"></div>'})
class Comp {
}

View File

@ -0,0 +1 @@
i0.ɵɵproperty("tabIndex", 10);

View File

@ -0,0 +1,8 @@
import {Component} from '@angular/core';
@Component({template: '<div [tabIndex]="this.$any(null)"></div>'})
class Comp {
$any(value: null): any {
return value as any;
}
}

View File

@ -0,0 +1 @@
i0.ɵɵproperty("tabIndex", ctx.$any(null));

View File

@ -0,0 +1,48 @@
/****************************************************************************************************
* PARTIAL FILE: test.js
****************************************************************************************************/
import { Component, NgModule } from '@angular/core';
import * as i0 from "@angular/core";
class Greeter {
}
class GreeterEN {
greet() {
return 'Hi';
}
}
export class MyComponent {
}
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-component", providers: [GreeterEN, { provide: Greeter, useClass: GreeterEN }], ngImport: i0, template: { source: '<div></div>', isInline: true }, viewProviders: [GreeterEN] });
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
type: Component,
args: [{
selector: 'my-component',
template: '<div></div>',
providers: [GreeterEN, { provide: Greeter, useClass: GreeterEN }],
viewProviders: [GreeterEN]
}]
}], null, null); })();
export class MyModule {
}
MyModule.ɵmod = i0.ɵɵdefineNgModule({ type: MyModule });
MyModule.ɵinj = i0.ɵɵdefineInjector({ factory: function MyModule_Factory(t) { return new (t || MyModule)(); } });
(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(MyModule, { declarations: [MyComponent] }); })();
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
type: NgModule,
args: [{ declarations: [MyComponent] }]
}], null, null); })();
/****************************************************************************************************
* PARTIAL FILE: test.d.ts
****************************************************************************************************/
import * as i0 from "@angular/core";
export declare class MyComponent {
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "my-component", never, {}, {}, never, never>;
}
export declare class MyModule {
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof MyComponent], never, never>;
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
}

View File

@ -0,0 +1,13 @@
{
"$schema": "../../test_case_schema.json",
"cases": [
{
"description": "should be able to generate the hello world component",
"expectations": [
{
"failureMessage": "Incorrect template"
}
]
}
]
}

View File

@ -0,0 +1,4 @@
import { Component, NgModule } from '@angular/core';
MyComponent.ɵfac = ;
MyComponent.ɵcmp = ;

View File

@ -0,0 +1,24 @@
import {Component, NgModule} from '@angular/core';
abstract class Greeter {
abstract greet(): string;
}
class GreeterEN implements Greeter {
greet() {
return 'Hi';
}
}
@Component({
selector: 'my-component',
template: '<div></div>',
providers: [GreeterEN, {provide: Greeter, useClass: GreeterEN}],
viewProviders: [GreeterEN]
})
export class MyComponent {
}
@NgModule({declarations: [MyComponent]})
export class MyModule {
}

View File

@ -0,0 +1,22 @@
import {Component, Input, NgModule} from '@angular/core';
@Component({selector: 'my-app', template: '<todo [data]="list"></todo>'})
export class MyApp {
list: any[] = [];
}
@Component({
selector: 'todo',
template: '<ul class="list" [title]="myTitle"><li *ngFor="let item of data">{{data}}</li></ul>'
})
export class TodoComponent {
@Input() data: any[] = [];
myTitle!: string;
}
@NgModule({
declarations: [TodoComponent, MyApp],
})
export class TodoModule {
}

View File

@ -0,0 +1,4 @@
import { Component, Input, NgModule } from '@angular/core';
MyApp.ɵcmp = ;
TodoComponent.ɵcmp = ;