test(compiler-cli): convert bindings compliance tests (#39862)
This commit converts the binding compliance tests taken from `r3_view_compiler_binding_spec.ts` to the new test runner. PR Close #39862
This commit is contained in:
JoostK
Misko Hevery
parent
eeab91af4e
commit
efd0d33391
|
|
@ -0,0 +1,334 @@
|
|||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.myTitle = 'hello';
|
||||
this.buttonId = 'special-button';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: `
|
||||
<button [attr.title]="myTitle" attr.id="{{buttonId}}" [attr.tabindex]="1"></button>
|
||||
`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
template: `
|
||||
<button [attr.title]="myTitle" attr.id="{{buttonId}}" [attr.tabindex]="1"></button>
|
||||
`
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
myTitle: string;
|
||||
buttonId: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_single_interpolation.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.myTitle = 'hello';
|
||||
this.buttonId = 'special-button';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: `
|
||||
<button attr.title="{{myTitle}}" attr.id="{{buttonId}}" attr.tabindex="{{1}}"></button>
|
||||
`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
template: `
|
||||
<button attr.title="{{myTitle}}" attr.id="{{buttonId}}" attr.tabindex="{{1}}"></button>
|
||||
`
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_single_interpolation.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
myTitle: string;
|
||||
buttonId: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings_mixed.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: `
|
||||
<button [attr.title]="1" [id]="2" [attr.tabindex]="3" attr.aria-label="prefix-{{1 + 3}}">
|
||||
</button>
|
||||
`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
template: `
|
||||
<button [attr.title]="1" [id]="2" [attr.tabindex]="3" attr.aria-label="prefix-{{1 + 3}}">
|
||||
</button>
|
||||
`
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings_mixed.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_bindings_with_interpolations.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: `
|
||||
<button
|
||||
[attr.title]="1"
|
||||
[attr.id]="2"
|
||||
attr.tabindex="prefix-{{0 + 3}}"
|
||||
attr.aria-label="hello-{{1 + 3}}-{{2 + 3}}"></button>`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
template: `
|
||||
<button
|
||||
[attr.title]="1"
|
||||
[attr.id]="2"
|
||||
attr.tabindex="prefix-{{0 + 3}}"
|
||||
attr.aria-label="hello-{{1 + 3}}-{{2 + 3}}"></button>`
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_bindings_with_interpolations.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings_for_multiple_elements.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.myTitle = 'hello';
|
||||
this.buttonId = 'special-button';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: `
|
||||
<button [attr.title]="myTitle" [attr.id]="buttonId" [attr.tabindex]="1"></button>
|
||||
<span [attr.id]="1" [attr.title]="'hello'" [attr.some-attr]="1 + 2"></span>
|
||||
<custom-element [attr.some-attr]="'one'" [attr.some-other-attr]="2"></custom-element>
|
||||
`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
template: `
|
||||
<button [attr.title]="myTitle" [attr.id]="buttonId" [attr.tabindex]="1"></button>
|
||||
<span [attr.id]="1" [attr.title]="'hello'" [attr.some-attr]="1 + 2"></span>
|
||||
<custom-element [attr.some-attr]="'one'" [attr.some-other-attr]="2"></custom-element>
|
||||
`
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings_for_multiple_elements.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
myTitle: string;
|
||||
buttonId: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings_with_child_elements.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.myTitle = 'hello';
|
||||
this.buttonId = 'special-button';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: `
|
||||
<button [attr.title]="myTitle" [attr.id]="buttonId" [attr.tabindex]="1">
|
||||
<span [attr.id]="1" [attr.title]="'hello'" [attr.some-attr]="1 + 2"></span>
|
||||
</button>`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
template: `
|
||||
<button [attr.title]="myTitle" [attr.id]="buttonId" [attr.tabindex]="1">
|
||||
<span [attr.id]="1" [attr.title]="'hello'" [attr.some-attr]="1 + 2"></span>
|
||||
</button>`
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings_with_child_elements.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
myTitle: string;
|
||||
buttonId: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: exclude_bindings_from_consts.js
|
||||
****************************************************************************************************/
|
||||
import { Component, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
doThings() { }
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-app", ngImport: i0, template: { source: `<a
|
||||
target="_blank"
|
||||
[title]="1"
|
||||
[attr.foo]="'one'"
|
||||
(customEvent)="doThings()"
|
||||
[attr.bar]="'two'"
|
||||
[id]="2"
|
||||
aria-label="link"
|
||||
[attr.baz]="three"></a>`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
selector: 'my-app',
|
||||
template: `<a
|
||||
target="_blank"
|
||||
[title]="1"
|
||||
[attr.foo]="'one'"
|
||||
(customEvent)="doThings()"
|
||||
[attr.bar]="'two'"
|
||||
[id]="2"
|
||||
aria-label="link"
|
||||
[attr.baz]="three"></a>`
|
||||
}]
|
||||
}], 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: exclude_bindings_from_consts.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
doThings(): void;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "my-app", never, {}, {}, never, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof MyComponent], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: interpolated_attributes.js
|
||||
****************************************************************************************************/
|
||||
import { Component, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.name = 'John Doe';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-app", ngImport: i0, template: { source: `
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h{{eight}}i{{nine}}j"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h{{eight}}i"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c"></div>
|
||||
<div attr.title="a{{one}}b"></div>
|
||||
<div attr.title="{{one}}"></div>
|
||||
`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h{{eight}}i{{nine}}j"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h{{eight}}i"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c"></div>
|
||||
<div attr.title="a{{one}}b"></div>
|
||||
<div attr.title="{{one}}"></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: [MyComponent] }); })();
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
|
||||
type: NgModule,
|
||||
args: [{ declarations: [MyComponent] }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: interpolated_attributes.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
name: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "my-app", never, {}, {}, never, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof MyComponent], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,117 @@
|
|||
{
|
||||
"$schema": "../../test_case_schema.json",
|
||||
"cases": [
|
||||
{
|
||||
"description": "should chain multiple attribute bindings into a single instruction",
|
||||
"inputFiles": [
|
||||
"chain_multiple_bindings.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_multiple_bindings.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple single-interpolation attribute bindings into one instruction",
|
||||
"inputFiles": [
|
||||
"chain_multiple_single_interpolation.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_multiple_single_interpolation.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain attribute bindings in the presence of other bindings",
|
||||
"inputFiles": [
|
||||
"chain_multiple_bindings_mixed.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_multiple_bindings_mixed.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should not add interpolated attributes to the attribute instruction chain",
|
||||
"inputFiles": [
|
||||
"chain_bindings_with_interpolations.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_bindings_with_interpolations.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple attribute bindings when there are multiple elements",
|
||||
"inputFiles": [
|
||||
"chain_multiple_bindings_for_multiple_elements.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_multiple_bindings_for_multiple_elements.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple attribute bindings when there are child elements",
|
||||
"inputFiles": [
|
||||
"chain_multiple_bindings_with_child_elements.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_multiple_bindings_with_child_elements.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should exclude attribute bindings from the attributes array",
|
||||
"inputFiles": [
|
||||
"exclude_bindings_from_consts.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect attribute array",
|
||||
"files": [
|
||||
"exclude_bindings_from_consts.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should generate the proper update instructions for interpolated attributes",
|
||||
"inputFiles": [
|
||||
"interpolated_attributes.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect handling of interpolated attributes",
|
||||
"files": [
|
||||
"interpolated_attributes.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵattributeInterpolate1("tabindex", "prefix-", 0 + 3, "");
|
||||
$r3$.ɵɵattributeInterpolate2("aria-label", "hello-", 1 + 3, "-", 2 + 3, "");
|
||||
$r3$.ɵɵattribute("title", 1)("id", 2);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
template: `
|
||||
<button
|
||||
[attr.title]="1"
|
||||
[attr.id]="2"
|
||||
attr.tabindex="prefix-{{0 + 3}}"
|
||||
attr.aria-label="hello-{{1 + 3}}-{{2 + 3}}"></button>`
|
||||
})
|
||||
export class MyComponent {
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵattribute("title", ctx.myTitle)("id", ctx.buttonId)("tabindex", 1);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
template: `
|
||||
<button [attr.title]="myTitle" attr.id="{{buttonId}}" [attr.tabindex]="1"></button>
|
||||
`
|
||||
})
|
||||
export class MyComponent {
|
||||
myTitle = 'hello';
|
||||
buttonId = 'special-button';
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵattribute("title", ctx.myTitle)("id", ctx.buttonId)("tabindex", 1);
|
||||
$r3$.ɵɵadvance(1);
|
||||
$r3$.ɵɵattribute("id", 1)("title", "hello")("some-attr", 1 + 2);
|
||||
$r3$.ɵɵadvance(1);
|
||||
$r3$.ɵɵattribute("some-attr", "one")("some-other-attr", 2);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
template: `
|
||||
<button [attr.title]="myTitle" [attr.id]="buttonId" [attr.tabindex]="1"></button>
|
||||
<span [attr.id]="1" [attr.title]="'hello'" [attr.some-attr]="1 + 2"></span>
|
||||
<custom-element [attr.some-attr]="'one'" [attr.some-other-attr]="2"></custom-element>
|
||||
`
|
||||
})
|
||||
export class MyComponent {
|
||||
myTitle = 'hello';
|
||||
buttonId = 'special-button';
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵattributeInterpolate1("aria-label", "prefix-", 1 + 3, "");
|
||||
$r3$.ɵɵproperty("id", 2);
|
||||
$r3$.ɵɵattribute("title", 1)("tabindex", 3);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
template: `
|
||||
<button [attr.title]="1" [id]="2" [attr.tabindex]="3" attr.aria-label="prefix-{{1 + 3}}">
|
||||
</button>
|
||||
`
|
||||
})
|
||||
export class MyComponent {
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵattribute("title", ctx.myTitle)("id", ctx.buttonId)("tabindex", 1);
|
||||
$r3$.ɵɵadvance(1);
|
||||
$r3$.ɵɵattribute("id", 1)("title", "hello")("some-attr", 1 + 2);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
template: `
|
||||
<button [attr.title]="myTitle" [attr.id]="buttonId" [attr.tabindex]="1">
|
||||
<span [attr.id]="1" [attr.title]="'hello'" [attr.some-attr]="1 + 2"></span>
|
||||
</button>`
|
||||
})
|
||||
export class MyComponent {
|
||||
myTitle = 'hello';
|
||||
buttonId = 'special-button';
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵattribute("title", ctx.myTitle)("id", ctx.buttonId)("tabindex", 1);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
template: `
|
||||
<button attr.title="{{myTitle}}" attr.id="{{buttonId}}" attr.tabindex="{{1}}"></button>
|
||||
`
|
||||
})
|
||||
export class MyComponent {
|
||||
myTitle = 'hello';
|
||||
buttonId = 'special-button';
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
|
||||
consts: [["target", "_blank", "aria-label", "link", __AttributeMarker.Bindings__, "title", "id", "customEvent"]],
|
||||
…
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
import {Component, NgModule} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-app',
|
||||
template: `<a
|
||||
target="_blank"
|
||||
[title]="1"
|
||||
[attr.foo]="'one'"
|
||||
(customEvent)="doThings()"
|
||||
[attr.bar]="'two'"
|
||||
[id]="2"
|
||||
aria-label="link"
|
||||
[attr.baz]="three"></a>`
|
||||
})
|
||||
export class MyComponent {
|
||||
doThings() {}
|
||||
}
|
||||
|
||||
@NgModule({declarations: [MyComponent]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
if (rf & 2) {
|
||||
i0.ɵɵattributeInterpolateV("title", ["a", ctx.one, "b", ctx.two, "c", ctx.three, "d", ctx.four, "e", ctx.five, "f", ctx.six, "g", ctx.seven, "h", ctx.eight, "i", ctx.nine, "j"]);
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵattributeInterpolate8("title", "a", ctx.one, "b", ctx.two, "c", ctx.three, "d", ctx.four, "e", ctx.five, "f", ctx.six, "g", ctx.seven, "h", ctx.eight, "i");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵattributeInterpolate7("title", "a", ctx.one, "b", ctx.two, "c", ctx.three, "d", ctx.four, "e", ctx.five, "f", ctx.six, "g", ctx.seven, "h");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵattributeInterpolate6("title", "a", ctx.one, "b", ctx.two, "c", ctx.three, "d", ctx.four, "e", ctx.five, "f", ctx.six, "g");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵattributeInterpolate5("title", "a", ctx.one, "b", ctx.two, "c", ctx.three, "d", ctx.four, "e", ctx.five, "f");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵattributeInterpolate4("title", "a", ctx.one, "b", ctx.two, "c", ctx.three, "d", ctx.four, "e");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵattributeInterpolate3("title", "a", ctx.one, "b", ctx.two, "c", ctx.three, "d");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵattributeInterpolate2("title", "a", ctx.one, "b", ctx.two, "c");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵattributeInterpolate1("title", "a", ctx.one, "b");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵattribute("title", ctx.one);
|
||||
}
|
||||
…
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
import {Component, NgModule} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h{{eight}}i{{nine}}j"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h{{eight}}i"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d{{four}}e"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c{{three}}d"></div>
|
||||
<div attr.title="a{{one}}b{{two}}c"></div>
|
||||
<div attr.title="a{{one}}b"></div>
|
||||
<div attr.title="{{one}}"></div>
|
||||
`
|
||||
})
|
||||
export class MyComponent {
|
||||
name = 'John Doe';
|
||||
}
|
||||
|
||||
@NgModule({declarations: [MyComponent]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,591 @@
|
|||
/****************************************************************************************************
|
||||
* PARTIAL FILE: host_bindings.js
|
||||
****************************************************************************************************/
|
||||
import { Directive, HostBinding, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class HostBindingDir {
|
||||
constructor() {
|
||||
this.dirId = 'some id';
|
||||
}
|
||||
}
|
||||
HostBindingDir.ɵfac = function HostBindingDir_Factory(t) { return new (t || HostBindingDir)(); };
|
||||
HostBindingDir.ɵdir = i0.ɵɵngDeclareDirective({ version: 1, type: HostBindingDir, selector: "[hostBindingDir]", host: { properties: { "id": "dirId" } }, ngImport: i0 });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(HostBindingDir, [{
|
||||
type: Directive,
|
||||
args: [{ selector: '[hostBindingDir]' }]
|
||||
}], null, { dirId: [{
|
||||
type: HostBinding,
|
||||
args: ['id']
|
||||
}] }); })();
|
||||
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: [HostBindingDir] }); })();
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
|
||||
type: NgModule,
|
||||
args: [{ declarations: [HostBindingDir] }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: host_bindings.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class HostBindingDir {
|
||||
dirId: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<HostBindingDir, never>;
|
||||
static ɵdir: i0.ɵɵDirectiveDefWithMeta<HostBindingDir, "[hostBindingDir]", never, {}, {}, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof HostBindingDir], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: host_bindings_with_temporaries.js
|
||||
****************************************************************************************************/
|
||||
import { Directive, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class HostBindingDir {
|
||||
}
|
||||
HostBindingDir.ɵfac = function HostBindingDir_Factory(t) { return new (t || HostBindingDir)(); };
|
||||
HostBindingDir.ɵdir = i0.ɵɵngDeclareDirective({ version: 1, type: HostBindingDir, selector: "[hostBindingDir]", host: { properties: { "id": "getData()?.id" } }, ngImport: i0 });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(HostBindingDir, [{
|
||||
type: Directive,
|
||||
args: [{ selector: '[hostBindingDir]', host: { '[id]': 'getData()?.id' } }]
|
||||
}], 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: [HostBindingDir] }); })();
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
|
||||
type: NgModule,
|
||||
args: [{ declarations: [HostBindingDir] }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: host_bindings_with_temporaries.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class HostBindingDir {
|
||||
getData?: () => {
|
||||
id: number;
|
||||
};
|
||||
static ɵfac: i0.ɵɵFactoryDef<HostBindingDir, never>;
|
||||
static ɵdir: i0.ɵɵDirectiveDefWithMeta<HostBindingDir, "[hostBindingDir]", never, {}, {}, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof HostBindingDir], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: host_bindings_with_pure_functions.js
|
||||
****************************************************************************************************/
|
||||
import { Component, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class HostBindingComp {
|
||||
constructor() {
|
||||
this.id = 'some id';
|
||||
}
|
||||
}
|
||||
HostBindingComp.ɵfac = function HostBindingComp_Factory(t) { return new (t || HostBindingComp)(); };
|
||||
HostBindingComp.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: HostBindingComp, selector: "host-binding-comp", host: { properties: { "id": "[\"red\", id]" } }, ngImport: i0, template: { source: '', isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(HostBindingComp, [{
|
||||
type: Component,
|
||||
args: [{ selector: 'host-binding-comp', host: { '[id]': '["red", id]' }, template: '' }]
|
||||
}], 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: [HostBindingComp] }); })();
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
|
||||
type: NgModule,
|
||||
args: [{ declarations: [HostBindingComp] }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: host_bindings_with_pure_functions.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class HostBindingComp {
|
||||
id: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<HostBindingComp, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<HostBindingComp, "host-binding-comp", never, {}, {}, never, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof HostBindingComp], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: host_attribute_bindings.js
|
||||
****************************************************************************************************/
|
||||
import { Directive, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class HostAttributeDir {
|
||||
constructor() {
|
||||
this.required = true;
|
||||
}
|
||||
}
|
||||
HostAttributeDir.ɵfac = function HostAttributeDir_Factory(t) { return new (t || HostAttributeDir)(); };
|
||||
HostAttributeDir.ɵdir = i0.ɵɵngDeclareDirective({ version: 1, type: HostAttributeDir, selector: "[hostAttributeDir]", host: { properties: { "attr.required": "required" } }, ngImport: i0 });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(HostAttributeDir, [{
|
||||
type: Directive,
|
||||
args: [{ selector: '[hostAttributeDir]', host: { '[attr.required]': 'required' } }]
|
||||
}], 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: [HostAttributeDir] }); })();
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
|
||||
type: NgModule,
|
||||
args: [{ declarations: [HostAttributeDir] }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: host_attribute_bindings.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class HostAttributeDir {
|
||||
required: boolean;
|
||||
static ɵfac: i0.ɵɵFactoryDef<HostAttributeDir, never>;
|
||||
static ɵdir: i0.ɵɵDirectiveDefWithMeta<HostAttributeDir, "[hostAttributeDir]", never, {}, {}, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof HostAttributeDir], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: host_attributes.js
|
||||
****************************************************************************************************/
|
||||
import { Directive, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class HostAttributeDir {
|
||||
}
|
||||
HostAttributeDir.ɵfac = function HostAttributeDir_Factory(t) { return new (t || HostAttributeDir)(); };
|
||||
HostAttributeDir.ɵdir = i0.ɵɵngDeclareDirective({ version: 1, type: HostAttributeDir, selector: "[hostAttributeDir]", host: { attributes: { "aria-label": "label" } }, ngImport: i0 });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(HostAttributeDir, [{
|
||||
type: Directive,
|
||||
args: [{ selector: '[hostAttributeDir]', host: { 'aria-label': 'label' } }]
|
||||
}], 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: [HostAttributeDir] }); })();
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
|
||||
type: NgModule,
|
||||
args: [{ declarations: [HostAttributeDir] }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: host_attributes.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class HostAttributeDir {
|
||||
static ɵfac: i0.ɵɵFactoryDef<HostAttributeDir, never>;
|
||||
static ɵdir: i0.ɵɵDirectiveDefWithMeta<HostAttributeDir, "[hostAttributeDir]", never, {}, {}, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof HostAttributeDir], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: host_attributes_with_classes_and_styles.js
|
||||
****************************************************************************************************/
|
||||
import { Component, Directive, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class HostAttributeComp {
|
||||
}
|
||||
HostAttributeComp.ɵfac = function HostAttributeComp_Factory(t) { return new (t || HostAttributeComp)(); };
|
||||
HostAttributeComp.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: HostAttributeComp, selector: "my-host-attribute-component", host: { attributes: { "title": "hello there from component" }, styleAttribute: "opacity:1" }, ngImport: i0, template: { source: '...', isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(HostAttributeComp, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
selector: 'my-host-attribute-component',
|
||||
template: '...',
|
||||
host: { 'title': 'hello there from component', 'style': 'opacity:1' }
|
||||
}]
|
||||
}], null, null); })();
|
||||
export class HostAttributeDir {
|
||||
}
|
||||
HostAttributeDir.ɵfac = function HostAttributeDir_Factory(t) { return new (t || HostAttributeDir)(); };
|
||||
HostAttributeDir.ɵdir = i0.ɵɵngDeclareDirective({ version: 1, type: HostAttributeDir, selector: "[hostAttributeDir]", host: { attributes: { "title": "hello there from directive" }, properties: { "style.opacity": "true", "class.three": "true" }, styleAttribute: "width: 200px; height: 500px", classAttribute: "one two" }, ngImport: i0 });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(HostAttributeDir, [{
|
||||
type: Directive,
|
||||
args: [{
|
||||
selector: '[hostAttributeDir]',
|
||||
host: {
|
||||
'style': 'width: 200px; height: 500px',
|
||||
'[style.opacity]': 'true',
|
||||
'class': 'one two',
|
||||
'[class.three]': 'true',
|
||||
'title': 'hello there from directive',
|
||||
}
|
||||
}]
|
||||
}], 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: [HostAttributeComp, HostAttributeDir] }); })();
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
|
||||
type: NgModule,
|
||||
args: [{ declarations: [HostAttributeComp, HostAttributeDir] }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: host_attributes_with_classes_and_styles.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class HostAttributeComp {
|
||||
static ɵfac: i0.ɵɵFactoryDef<HostAttributeComp, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<HostAttributeComp, "my-host-attribute-component", never, {}, {}, never, never>;
|
||||
}
|
||||
export declare class HostAttributeDir {
|
||||
static ɵfac: i0.ɵɵFactoryDef<HostAttributeDir, never>;
|
||||
static ɵdir: i0.ɵɵDirectiveDefWithMeta<HostAttributeDir, "[hostAttributeDir]", never, {}, {}, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof HostAttributeComp, typeof HostAttributeDir], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_property_bindings.js
|
||||
****************************************************************************************************/
|
||||
import { Directive } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyDirective {
|
||||
constructor() {
|
||||
this.myTitle = 'hello';
|
||||
this.myId = 'special-directive';
|
||||
}
|
||||
}
|
||||
MyDirective.ɵfac = function MyDirective_Factory(t) { return new (t || MyDirective)(); };
|
||||
MyDirective.ɵdir = i0.ɵɵngDeclareDirective({ version: 1, type: MyDirective, selector: "[my-dir]", host: { properties: { "title": "myTitle", "tabindex": "1", "id": "myId" } }, ngImport: i0 });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyDirective, [{
|
||||
type: Directive,
|
||||
args: [{ selector: '[my-dir]', host: { '[title]': 'myTitle', '[tabindex]': '1', '[id]': 'myId' } }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_property_bindings.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyDirective {
|
||||
myTitle: string;
|
||||
myId: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyDirective, never>;
|
||||
static ɵdir: i0.ɵɵDirectiveDefWithMeta<MyDirective, "[my-dir]", never, {}, {}, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_property_bindings_all.js
|
||||
****************************************************************************************************/
|
||||
import { Directive, HostBinding } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyDirective {
|
||||
constructor() {
|
||||
this.myTitle = 'hello';
|
||||
this.myId = 'special-directive';
|
||||
}
|
||||
}
|
||||
MyDirective.ɵfac = function MyDirective_Factory(t) { return new (t || MyDirective)(); };
|
||||
MyDirective.ɵdir = i0.ɵɵngDeclareDirective({ version: 1, type: MyDirective, selector: "[my-dir]", host: { properties: { "tabindex": "1", "title": "myTitle", "id": "myId" } }, ngImport: i0 });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyDirective, [{
|
||||
type: Directive,
|
||||
args: [{ selector: '[my-dir]', host: { '[tabindex]': '1' } }]
|
||||
}], null, { myTitle: [{
|
||||
type: HostBinding,
|
||||
args: ['title']
|
||||
}], myId: [{
|
||||
type: HostBinding,
|
||||
args: ['id']
|
||||
}] }); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_property_bindings_all.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyDirective {
|
||||
myTitle: string;
|
||||
myId: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyDirective, never>;
|
||||
static ɵdir: i0.ɵɵDirectiveDefWithMeta<MyDirective, "[my-dir]", never, {}, {}, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_property_bindings_mixed.js
|
||||
****************************************************************************************************/
|
||||
import { Directive } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyDirective {
|
||||
}
|
||||
MyDirective.ɵfac = function MyDirective_Factory(t) { return new (t || MyDirective)(); };
|
||||
MyDirective.ɵdir = i0.ɵɵngDeclareDirective({ version: 1, type: MyDirective, selector: "[my-dir]", host: { properties: { "title": "\"my title\"", "attr.tabindex": "1", "id": "\"my-id\"" } }, ngImport: i0 });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyDirective, [{
|
||||
type: Directive,
|
||||
args: [{
|
||||
selector: '[my-dir]',
|
||||
host: { '[title]': '"my title"', '[attr.tabindex]': '1', '[id]': '"my-id"' }
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_property_bindings_mixed.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyDirective {
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyDirective, never>;
|
||||
static ɵdir: i0.ɵɵDirectiveDefWithMeta<MyDirective, "[my-dir]", never, {}, {}, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_synthetic_properties.js
|
||||
****************************************************************************************************/
|
||||
import { Directive } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyDirective {
|
||||
constructor() {
|
||||
this.expandedState = 'collapsed';
|
||||
this.isSmall = true;
|
||||
}
|
||||
}
|
||||
MyDirective.ɵfac = function MyDirective_Factory(t) { return new (t || MyDirective)(); };
|
||||
MyDirective.ɵdir = i0.ɵɵngDeclareDirective({ version: 1, type: MyDirective, selector: "[my-dir]", host: { properties: { "@expand": "expandedState", "@fadeOut": "true", "@shrink": "isSmall" } }, ngImport: i0 });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyDirective, [{
|
||||
type: Directive,
|
||||
args: [{
|
||||
selector: '[my-dir]',
|
||||
host: { '[@expand]': 'expandedState', '[@fadeOut]': 'true', '[@shrink]': 'isSmall' }
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_synthetic_properties.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyDirective {
|
||||
expandedState: string;
|
||||
isSmall: boolean;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyDirective, never>;
|
||||
static ɵdir: i0.ɵɵDirectiveDefWithMeta<MyDirective, "[my-dir]", never, {}, {}, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_attribute_bindings.js
|
||||
****************************************************************************************************/
|
||||
import { Directive } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyDirective {
|
||||
constructor() {
|
||||
this.myTitle = 'hello';
|
||||
this.myId = 'special-directive';
|
||||
}
|
||||
}
|
||||
MyDirective.ɵfac = function MyDirective_Factory(t) { return new (t || MyDirective)(); };
|
||||
MyDirective.ɵdir = i0.ɵɵngDeclareDirective({ version: 1, type: MyDirective, selector: "[my-dir]", host: { properties: { "attr.title": "myTitle", "attr.tabindex": "1", "attr.id": "myId" } }, ngImport: i0 });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyDirective, [{
|
||||
type: Directive,
|
||||
args: [{
|
||||
selector: '[my-dir]',
|
||||
host: { '[attr.title]': 'myTitle', '[attr.tabindex]': '1', '[attr.id]': 'myId' }
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_attribute_bindings.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyDirective {
|
||||
myTitle: string;
|
||||
myId: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyDirective, never>;
|
||||
static ɵdir: i0.ɵɵDirectiveDefWithMeta<MyDirective, "[my-dir]", never, {}, {}, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_attribute_bindings_all.js
|
||||
****************************************************************************************************/
|
||||
import { Directive, HostBinding } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyDirective {
|
||||
constructor() {
|
||||
this.myTitle = 'hello';
|
||||
this.myId = 'special-directive';
|
||||
}
|
||||
}
|
||||
MyDirective.ɵfac = function MyDirective_Factory(t) { return new (t || MyDirective)(); };
|
||||
MyDirective.ɵdir = i0.ɵɵngDeclareDirective({ version: 1, type: MyDirective, selector: "[my-dir]", host: { properties: { "attr.tabindex": "1", "attr.title": "myTitle", "attr.id": "myId" } }, ngImport: i0 });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyDirective, [{
|
||||
type: Directive,
|
||||
args: [{ selector: '[my-dir]', host: { '[attr.tabindex]': '1' } }]
|
||||
}], null, { myTitle: [{
|
||||
type: HostBinding,
|
||||
args: ['attr.title']
|
||||
}], myId: [{
|
||||
type: HostBinding,
|
||||
args: ['attr.id']
|
||||
}] }); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_attribute_bindings_all.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyDirective {
|
||||
myTitle: string;
|
||||
myId: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyDirective, never>;
|
||||
static ɵdir: i0.ɵɵDirectiveDefWithMeta<MyDirective, "[my-dir]", never, {}, {}, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_attribute_bindings_mixed.js
|
||||
****************************************************************************************************/
|
||||
import { Directive } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyDirective {
|
||||
}
|
||||
MyDirective.ɵfac = function MyDirective_Factory(t) { return new (t || MyDirective)(); };
|
||||
MyDirective.ɵdir = i0.ɵɵngDeclareDirective({ version: 1, type: MyDirective, selector: "[my-dir]", host: { properties: { "attr.title": "\"my title\"", "tabindex": "1", "attr.id": "\"my-id\"" } }, ngImport: i0 });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyDirective, [{
|
||||
type: Directive,
|
||||
args: [{
|
||||
selector: '[my-dir]',
|
||||
host: { '[attr.title]': '"my title"', '[tabindex]': '1', '[attr.id]': '"my-id"' }
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_attribute_bindings_mixed.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyDirective {
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyDirective, never>;
|
||||
static ɵdir: i0.ɵɵDirectiveDefWithMeta<MyDirective, "[my-dir]", never, {}, {}, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_listeners.js
|
||||
****************************************************************************************************/
|
||||
import { Directive, HostListener } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyDirective {
|
||||
mousedown() { }
|
||||
mouseup() { }
|
||||
click() {
|
||||
}
|
||||
}
|
||||
MyDirective.ɵfac = function MyDirective_Factory(t) { return new (t || MyDirective)(); };
|
||||
MyDirective.ɵdir = i0.ɵɵngDeclareDirective({ version: 1, type: MyDirective, selector: "[my-dir]", host: { listeners: { "mousedown": "mousedown()", "mouseup": "mouseup()", "click": "click()" } }, ngImport: i0 });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyDirective, [{
|
||||
type: Directive,
|
||||
args: [{
|
||||
selector: '[my-dir]',
|
||||
host: {
|
||||
'(mousedown)': 'mousedown()',
|
||||
'(mouseup)': 'mouseup()',
|
||||
}
|
||||
}]
|
||||
}], null, { click: [{
|
||||
type: HostListener,
|
||||
args: ['click']
|
||||
}] }); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_listeners.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyDirective {
|
||||
mousedown(): void;
|
||||
mouseup(): void;
|
||||
click(): void;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyDirective, never>;
|
||||
static ɵdir: i0.ɵɵDirectiveDefWithMeta<MyDirective, "[my-dir]", never, {}, {}, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_synthetic_listeners.js
|
||||
****************************************************************************************************/
|
||||
import { Component, HostListener } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
start() {
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-comp", host: { listeners: { "@animation.done": "done()", "@animation.start": "start()" } }, ngImport: i0, template: { source: '', isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
selector: 'my-comp',
|
||||
template: '',
|
||||
host: {
|
||||
'(@animation.done)': 'done()',
|
||||
}
|
||||
}]
|
||||
}], null, { start: [{
|
||||
type: HostListener,
|
||||
args: ['@animation.start']
|
||||
}] }); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_synthetic_listeners.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
start(): void;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "my-comp", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_synthetic_listeners_mixed.js
|
||||
****************************************************************************************************/
|
||||
import { Component, HostListener } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
start() {
|
||||
}
|
||||
click() {
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-comp", host: { listeners: { "mousedown": "mousedown()", "@animation.done": "done()", "mouseup": "mouseup()", "@animation.start": "start()", "click": "click()" } }, ngImport: i0, template: { source: '', isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
selector: 'my-comp',
|
||||
template: '',
|
||||
host: {
|
||||
'(mousedown)': 'mousedown()',
|
||||
'(@animation.done)': 'done()',
|
||||
'(mouseup)': 'mouseup()',
|
||||
}
|
||||
}]
|
||||
}], null, { start: [{
|
||||
type: HostListener,
|
||||
args: ['@animation.start']
|
||||
}], click: [{
|
||||
type: HostListener,
|
||||
args: ['click']
|
||||
}] }); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_synthetic_listeners_mixed.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
start(): void;
|
||||
click(): void;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "my-comp", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,229 @@
|
|||
{
|
||||
"$schema": "../../test_case_schema.json",
|
||||
"cases": [
|
||||
{
|
||||
"description": "should support host bindings",
|
||||
"inputFiles": [
|
||||
"host_bindings.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Invalid host binding code",
|
||||
"files": [
|
||||
"host_bindings.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should support host bindings with temporary expressions",
|
||||
"inputFiles": [
|
||||
"host_bindings_with_temporaries.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Invalid host binding code",
|
||||
"files": [
|
||||
"host_bindings_with_temporaries.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should support host bindings with pure functions",
|
||||
"inputFiles": [
|
||||
"host_bindings_with_pure_functions.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Invalid host binding code",
|
||||
"files": [
|
||||
"host_bindings_with_pure_functions.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should support host attribute bindings",
|
||||
"inputFiles": [
|
||||
"host_attribute_bindings.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Invalid host attribute code",
|
||||
"files": [
|
||||
"host_attribute_bindings.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should support host attributes",
|
||||
"inputFiles": [
|
||||
"host_attributes.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Invalid host attribute code",
|
||||
"files": [
|
||||
"host_attributes.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should support host attributes together with host classes and styles",
|
||||
"inputFiles": [
|
||||
"host_attributes_with_classes_and_styles.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Invalid host attribute code",
|
||||
"files": [
|
||||
"host_attributes_with_classes_and_styles.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple host property bindings into a single instruction",
|
||||
"inputFiles": [
|
||||
"chain_multiple_property_bindings.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_multiple_property_bindings.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain both host properties in the decorator and on the class",
|
||||
"inputFiles": [
|
||||
"chain_property_bindings_all.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_property_bindings_all.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple host property bindings in the presence of other bindings",
|
||||
"inputFiles": [
|
||||
"chain_property_bindings_mixed.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_property_bindings_mixed.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple synthetic properties into a single instruction call",
|
||||
"inputFiles": [
|
||||
"chain_synthetic_properties.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_synthetic_properties.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple host attribute bindings into a single instruction",
|
||||
"inputFiles": [
|
||||
"chain_multiple_attribute_bindings.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_multiple_attribute_bindings.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain both host attributes in the decorator and on the class",
|
||||
"inputFiles": [
|
||||
"chain_attribute_bindings_all.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_attribute_bindings_all.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple host attribute bindings in the presence of other bindings",
|
||||
"inputFiles": [
|
||||
"chain_attribute_bindings_mixed.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_attribute_bindings_mixed.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple host listeners into a single instruction",
|
||||
"inputFiles": [
|
||||
"chain_multiple_listeners.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_multiple_listeners.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple synthetic host listeners into a single instruction",
|
||||
"inputFiles": [
|
||||
"chain_synthetic_listeners.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_synthetic_listeners.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple regular and synthetic host listeners into two instructions",
|
||||
"inputFiles": [
|
||||
"chain_synthetic_listeners_mixed.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_synthetic_listeners_mixed.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
hostBindings: function MyDirective_HostBindings(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵattribute("tabindex", 1)("title", ctx.myTitle)("id", ctx.myId);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
import {Directive, HostBinding} from '@angular/core';
|
||||
|
||||
@Directive({selector: '[my-dir]', host: {'[attr.tabindex]': '1'}})
|
||||
export class MyDirective {
|
||||
@HostBinding('attr.title') myTitle = 'hello';
|
||||
|
||||
@HostBinding('attr.id') myId = 'special-directive';
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
hostBindings: function MyDirective_HostBindings(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵhostProperty("tabindex", 1);
|
||||
$r3$.ɵɵattribute("title", "my title")("id", "my-id");
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
import {Directive} from '@angular/core';
|
||||
|
||||
@Directive({
|
||||
selector: '[my-dir]',
|
||||
host: {'[attr.title]': '"my title"', '[tabindex]': '1', '[attr.id]': '"my-id"'}
|
||||
})
|
||||
export class MyDirective {
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
hostBindings: function MyDirective_HostBindings(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵattribute("title", ctx.myTitle)("tabindex", 1)("id", ctx.myId);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import {Directive} from '@angular/core';
|
||||
|
||||
@Directive({
|
||||
selector: '[my-dir]',
|
||||
host: {'[attr.title]': 'myTitle', '[attr.tabindex]': '1', '[attr.id]': 'myId'}
|
||||
})
|
||||
export class MyDirective {
|
||||
myTitle = 'hello';
|
||||
myId = 'special-directive';
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
hostBindings: function MyDirective_HostBindings(rf, ctx) {
|
||||
if (rf & 1) {
|
||||
$r3$.ɵɵlistener("mousedown", function MyDirective_mousedown_HostBindingHandler() { return ctx.mousedown(); })("mouseup", function MyDirective_mouseup_HostBindingHandler() { return ctx.mouseup(); })("click", function MyDirective_click_HostBindingHandler() { return ctx.click(); });
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
import {Directive, HostListener} from '@angular/core';
|
||||
|
||||
@Directive({
|
||||
selector: '[my-dir]',
|
||||
host: {
|
||||
'(mousedown)': 'mousedown()',
|
||||
'(mouseup)': 'mouseup()',
|
||||
}
|
||||
})
|
||||
export class MyDirective {
|
||||
mousedown() {}
|
||||
mouseup() {}
|
||||
|
||||
@HostListener('click')
|
||||
click() {
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
hostBindings: function MyDirective_HostBindings(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵhostProperty("title", ctx.myTitle)("tabindex", 1)("id", ctx.myId);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
import {Directive} from '@angular/core';
|
||||
|
||||
@Directive({selector: '[my-dir]', host: {'[title]': 'myTitle', '[tabindex]': '1', '[id]': 'myId'}})
|
||||
export class MyDirective {
|
||||
myTitle = 'hello';
|
||||
myId = 'special-directive';
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
hostBindings: function MyDirective_HostBindings(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵhostProperty("tabindex", 1)("title", ctx.myTitle)("id", ctx.myId);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
import {Directive, HostBinding} from '@angular/core';
|
||||
|
||||
@Directive({selector: '[my-dir]', host: {'[tabindex]': '1'}})
|
||||
export class MyDirective {
|
||||
@HostBinding('title') myTitle = 'hello';
|
||||
|
||||
@HostBinding('id') myId = 'special-directive';
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
hostBindings: function MyDirective_HostBindings(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵhostProperty("title", "my title")("id", "my-id");
|
||||
$r3$.ɵɵattribute("tabindex", 1);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
import {Directive} from '@angular/core';
|
||||
|
||||
@Directive({
|
||||
selector: '[my-dir]',
|
||||
host: {'[title]': '"my title"', '[attr.tabindex]': '1', '[id]': '"my-id"'}
|
||||
})
|
||||
export class MyDirective {
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
hostBindings: function MyComponent_HostBindings(rf, ctx) {
|
||||
if (rf & 1) {
|
||||
$r3$.ɵɵsyntheticHostListener("@animation.done", function MyComponent_animation_animation_done_HostBindingHandler() { return ctx.done(); })("@animation.start", function MyComponent_animation_animation_start_HostBindingHandler() { return ctx.start(); });
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import {Component, HostListener} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-comp',
|
||||
template: '',
|
||||
host: {
|
||||
'(@animation.done)': 'done()',
|
||||
}
|
||||
})
|
||||
export class MyComponent {
|
||||
@HostListener('@animation.start')
|
||||
start() {
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
hostBindings: function MyComponent_HostBindings(rf, ctx) {
|
||||
if (rf & 1) {
|
||||
$r3$.ɵɵsyntheticHostListener("@animation.done", function MyComponent_animation_animation_done_HostBindingHandler() { return ctx.done(); })("@animation.start", function MyComponent_animation_animation_start_HostBindingHandler() { return ctx.start(); });
|
||||
$r3$.ɵɵlistener("mousedown", function MyComponent_mousedown_HostBindingHandler() { return ctx.mousedown(); })("mouseup", function MyComponent_mouseup_HostBindingHandler() { return ctx.mouseup(); })("click", function MyComponent_click_HostBindingHandler() { return ctx.click(); });
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
import {Component, HostListener} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-comp',
|
||||
template: '',
|
||||
host: {
|
||||
'(mousedown)': 'mousedown()',
|
||||
'(@animation.done)': 'done()',
|
||||
'(mouseup)': 'mouseup()',
|
||||
}
|
||||
})
|
||||
export class MyComponent {
|
||||
@HostListener('@animation.start')
|
||||
start() {
|
||||
}
|
||||
|
||||
@HostListener('click')
|
||||
click() {
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
hostBindings: function MyDirective_HostBindings(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵsyntheticHostProperty("@expand", ctx.expandedState)("@fadeOut", true)("@shrink", ctx.isSmall);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import {Directive} from '@angular/core';
|
||||
|
||||
@Directive({
|
||||
selector: '[my-dir]',
|
||||
host: {'[@expand]': 'expandedState', '[@fadeOut]': 'true', '[@shrink]': 'isSmall'}
|
||||
})
|
||||
export class MyDirective {
|
||||
expandedState = 'collapsed';
|
||||
isSmall = true;
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
|
||||
HostAttributeDir.ɵdir = $r3$.ɵɵdefineDirective({
|
||||
type: HostAttributeDir,
|
||||
selectors: [["", "hostAttributeDir", ""]],
|
||||
hostVars: 1,
|
||||
hostBindings: function HostAttributeDir_HostBindings(rf, ctx) {
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵattribute("required", ctx.required);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import {Directive, NgModule} from '@angular/core';
|
||||
|
||||
@Directive({selector: '[hostAttributeDir]', host: {'[attr.required]': 'required'}})
|
||||
export class HostAttributeDir {
|
||||
required = true;
|
||||
}
|
||||
|
||||
@NgModule({declarations: [HostAttributeDir]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
|
||||
HostAttributeDir.ɵdir = $r3$.ɵɵdefineDirective({
|
||||
type: HostAttributeDir,
|
||||
selectors: [["", "hostAttributeDir", ""]],
|
||||
hostAttrs: ["aria-label", "label"]
|
||||
});
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
import {Directive, NgModule} from '@angular/core';
|
||||
|
||||
@Directive({selector: '[hostAttributeDir]', host: {'aria-label': 'label'}})
|
||||
export class HostAttributeDir {
|
||||
}
|
||||
|
||||
@NgModule({declarations: [HostAttributeDir]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
|
||||
HostAttributeComp.ɵcmp = $r3$.ɵɵdefineComponent({
|
||||
type: HostAttributeComp,
|
||||
selectors: [["my-host-attribute-component"]],
|
||||
hostAttrs: ["title", "hello there from component", __AttributeMarker.Styles__, "opacity", "1"],
|
||||
…
|
||||
HostAttributeDir.ɵdir = $r3$.ɵɵdefineDirective({
|
||||
type: HostAttributeDir,
|
||||
selectors: [["", "hostAttributeDir", ""]],
|
||||
hostAttrs: ["title", "hello there from directive", __AttributeMarker.Classes__, "one", "two", __AttributeMarker.Styles__, "width", "200px", "height", "500px"],
|
||||
hostVars: 4,
|
||||
hostBindings: function HostAttributeDir_HostBindings(rf, ctx) {
|
||||
…
|
||||
}
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
import {Component, Directive, NgModule} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-host-attribute-component',
|
||||
template: '...',
|
||||
host: {'title': 'hello there from component', 'style': 'opacity:1'}
|
||||
})
|
||||
export class HostAttributeComp {
|
||||
}
|
||||
|
||||
@Directive({
|
||||
selector: '[hostAttributeDir]',
|
||||
host: {
|
||||
'style': 'width: 200px; height: 500px',
|
||||
'[style.opacity]': 'true',
|
||||
'class': 'one two',
|
||||
'[class.three]': 'true',
|
||||
'title': 'hello there from directive',
|
||||
}
|
||||
})
|
||||
export class HostAttributeDir {
|
||||
}
|
||||
|
||||
@NgModule({declarations: [HostAttributeComp, HostAttributeDir]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
|
||||
HostBindingDir.ɵdir = $r3$.ɵɵdefineDirective({
|
||||
type: HostBindingDir,
|
||||
selectors: [["", "hostBindingDir", ""]],
|
||||
hostVars: 1,
|
||||
hostBindings: function HostBindingDir_HostBindings(rf, ctx) {
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵhostProperty("id", ctx.dirId);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import {Directive, HostBinding, NgModule} from '@angular/core';
|
||||
|
||||
@Directive({selector: '[hostBindingDir]'})
|
||||
export class HostBindingDir {
|
||||
@HostBinding('id') dirId = 'some id';
|
||||
}
|
||||
|
||||
@NgModule({declarations: [HostBindingDir]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
|
||||
const $ff$ = function ($v$) { return ["red", $v$]; };
|
||||
…
|
||||
HostBindingComp.ɵcmp = $r3$.ɵɵdefineComponent({
|
||||
type: HostBindingComp,
|
||||
selectors: [["host-binding-comp"]],
|
||||
hostVars: 3,
|
||||
hostBindings: function HostBindingComp_HostBindings(rf, ctx) {
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵhostProperty("id", $r3$.ɵɵpureFunction1(1, $ff$, ctx.id));
|
||||
}
|
||||
},
|
||||
decls: 0,
|
||||
vars: 0,
|
||||
template: function HostBindingComp_Template(rf, ctx) {},
|
||||
encapsulation: 2
|
||||
});
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import {Component, NgModule} from '@angular/core';
|
||||
|
||||
@Component({selector: 'host-binding-comp', host: {'[id]': '["red", id]'}, template: ''})
|
||||
export class HostBindingComp {
|
||||
id = 'some id';
|
||||
}
|
||||
|
||||
@NgModule({declarations: [HostBindingComp]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
|
||||
HostBindingDir.ɵdir = $r3$.ɵɵdefineDirective({
|
||||
type: HostBindingDir,
|
||||
selectors: [["", "hostBindingDir", ""]],
|
||||
hostVars: 1,
|
||||
hostBindings: function HostBindingDir_HostBindings(rf, ctx) {
|
||||
if (rf & 2) {
|
||||
let $tmp0$ = null;
|
||||
$r3$.ɵɵhostProperty("id", ($tmp0$ = ctx.getData()) == null ? null : $tmp0$.id);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import {Directive, NgModule} from '@angular/core';
|
||||
|
||||
@Directive({selector: '[hostBindingDir]', host: {'[id]': 'getData()?.id'}})
|
||||
export class HostBindingDir {
|
||||
getData?: () => {
|
||||
id: number
|
||||
};
|
||||
}
|
||||
|
||||
@NgModule({declarations: [HostBindingDir]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,202 @@
|
|||
/****************************************************************************************************
|
||||
* PARTIAL FILE: local_ref_on_host.js
|
||||
****************************************************************************************************/
|
||||
import { Component, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.name = 'John Doe';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-app", ngImport: i0, template: { source: `
|
||||
<b ngNonBindable #myRef id="my-id">
|
||||
<i>Hello {{ name }}!</i>
|
||||
</b>
|
||||
{{ myRef.id }}
|
||||
`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<b ngNonBindable #myRef id="my-id">
|
||||
<i>Hello {{ name }}!</i>
|
||||
</b>
|
||||
{{ myRef.id }}
|
||||
`
|
||||
}]
|
||||
}], 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: local_ref_on_host.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
name: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "my-app", never, {}, {}, never, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof MyComponent], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: local_ref_on_nested.js
|
||||
****************************************************************************************************/
|
||||
import { Component, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.name = 'John Doe';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-app", ngImport: i0, template: { source: `
|
||||
<div ngNonBindable>
|
||||
<input value="one" #myInput> {{ myInput.value }}
|
||||
</div>
|
||||
`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<div ngNonBindable>
|
||||
<input value="one" #myInput> {{ myInput.value }}
|
||||
</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: [MyComponent] }); })();
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
|
||||
type: NgModule,
|
||||
args: [{ declarations: [MyComponent] }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: local_ref_on_nested.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
name: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "my-app", never, {}, {}, never, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof MyComponent], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: property_bindings_and_listeners.js
|
||||
****************************************************************************************************/
|
||||
import { Component, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.name = 'John Doe';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-app", ngImport: i0, template: { source: `
|
||||
<div ngNonBindable>
|
||||
<div [id]="my-id" (click)="onclick"></div>
|
||||
</div>
|
||||
`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<div ngNonBindable>
|
||||
<div [id]="my-id" (click)="onclick"></div>
|
||||
</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: [MyComponent] }); })();
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
|
||||
type: NgModule,
|
||||
args: [{ declarations: [MyComponent] }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: property_bindings_and_listeners.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
name: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "my-app", never, {}, {}, never, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof MyComponent], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: no_child_elements.js
|
||||
****************************************************************************************************/
|
||||
import { Component, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.name = 'John Doe';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-app", ngImport: i0, template: { source: `
|
||||
<div ngNonBindable></div>
|
||||
`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<div ngNonBindable></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: [MyComponent] }); })();
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
|
||||
type: NgModule,
|
||||
args: [{ declarations: [MyComponent] }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: no_child_elements.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
name: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "my-app", never, {}, {}, never, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof MyComponent], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,61 @@
|
|||
{
|
||||
"$schema": "../../test_case_schema.json",
|
||||
"cases": [
|
||||
{
|
||||
"description": "should keep local ref for host element",
|
||||
"inputFiles": [
|
||||
"local_ref_on_host.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect handling of local refs for host element",
|
||||
"files": [
|
||||
"local_ref_on_host.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should not have local refs for nested elements",
|
||||
"inputFiles": [
|
||||
"local_ref_on_nested.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect handling of local refs for nested elements",
|
||||
"files": [
|
||||
"local_ref_on_nested.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should not process property bindings and listeners",
|
||||
"inputFiles": [
|
||||
"property_bindings_and_listeners.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect handling of property bindings and listeners",
|
||||
"files": [
|
||||
"property_bindings_and_listeners.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should not generate extra instructions for elements with no children",
|
||||
"inputFiles": [
|
||||
"no_child_elements.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect handling of elements with no children",
|
||||
"files": [
|
||||
"no_child_elements.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
consts: [["id", "my-id"], ["myRef", ""]],
|
||||
template:function MyComponent_Template(rf, $ctx$){
|
||||
if (rf & 1) {
|
||||
$i0$.ɵɵelementStart(0, "b", 0, 1);
|
||||
$i0$.ɵɵdisableBindings();
|
||||
$i0$.ɵɵelementStart(2, "i");
|
||||
$i0$.ɵɵtext(3, "Hello {{ name }}!");
|
||||
$i0$.ɵɵelementEnd();
|
||||
$i0$.ɵɵenableBindings();
|
||||
$i0$.ɵɵelementEnd();
|
||||
$i0$.ɵɵtext(4);
|
||||
}
|
||||
if (rf & 2) {
|
||||
const $_r0$ = $i0$.ɵɵreference(1);
|
||||
$r3$.ɵɵadvance(4);
|
||||
$i0$.ɵɵtextInterpolate1(" ", $_r0$.id, " ");
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
import {Component, NgModule} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<b ngNonBindable #myRef id="my-id">
|
||||
<i>Hello {{ name }}!</i>
|
||||
</b>
|
||||
{{ myRef.id }}
|
||||
`
|
||||
})
|
||||
export class MyComponent {
|
||||
name = 'John Doe';
|
||||
}
|
||||
|
||||
@NgModule({declarations: [MyComponent]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
consts: [["value", "one", "#myInput", ""]],
|
||||
template:function MyComponent_Template(rf, $ctx$){
|
||||
if (rf & 1) {
|
||||
$i0$.ɵɵelementStart(0, "div");
|
||||
$i0$.ɵɵdisableBindings();
|
||||
$i0$.ɵɵelement(1, "input", 0);
|
||||
$i0$.ɵɵtext(2, " {{ myInput.value }} ");
|
||||
$i0$.ɵɵenableBindings();
|
||||
$i0$.ɵɵelementEnd();
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
import {Component, NgModule} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<div ngNonBindable>
|
||||
<input value="one" #myInput> {{ myInput.value }}
|
||||
</div>
|
||||
`
|
||||
})
|
||||
export class MyComponent {
|
||||
name = 'John Doe';
|
||||
}
|
||||
|
||||
@NgModule({declarations: [MyComponent]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
|
||||
template:function MyComponent_Template(rf, $ctx$){
|
||||
if (rf & 1) {
|
||||
$i0$.ɵɵelement(0, "div");
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
import {Component, NgModule} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<div ngNonBindable></div>
|
||||
`
|
||||
})
|
||||
export class MyComponent {
|
||||
name = 'John Doe';
|
||||
}
|
||||
|
||||
@NgModule({declarations: [MyComponent]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
consts: [["[id]", "my-id", "(click)", "onclick"]],
|
||||
template:function MyComponent_Template(rf, $ctx$){
|
||||
if (rf & 1) {
|
||||
$i0$.ɵɵelementStart(0, "div");
|
||||
$i0$.ɵɵdisableBindings();
|
||||
$i0$.ɵɵelement(1, "div", 0);
|
||||
$i0$.ɵɵenableBindings();
|
||||
$i0$.ɵɵelementEnd();
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
import {Component, NgModule} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<div ngNonBindable>
|
||||
<div [id]="my-id" (click)="onclick"></div>
|
||||
</div>
|
||||
`
|
||||
})
|
||||
export class MyComponent {
|
||||
name = 'John Doe';
|
||||
}
|
||||
|
||||
@NgModule({declarations: [MyComponent]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,456 @@
|
|||
/****************************************************************************************************
|
||||
* PARTIAL FILE: bind.js
|
||||
****************************************************************************************************/
|
||||
import { Component, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.title = 'Hello World';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-app", ngImport: i0, template: { source: '<a [title]="title"></a>', isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{ selector: 'my-app', template: '<a [title]="title"></a>' }]
|
||||
}], 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: bind.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
title: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "my-app", never, {}, {}, never, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof MyComponent], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: interpolation.js
|
||||
****************************************************************************************************/
|
||||
import { Component, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.name = 'World';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-component", ngImport: i0, template: { source: `
|
||||
<a title="Hello {{name}}"></a>`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
selector: 'my-component',
|
||||
template: `
|
||||
<a title="Hello {{name}}"></a>`
|
||||
}]
|
||||
}], 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: interpolation.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
name: string;
|
||||
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>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: interpolated_properties.js
|
||||
****************************************************************************************************/
|
||||
import { Component, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.name = 'John Doe';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-app", ngImport: i0, template: { source: `
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h{{eight}}i{{nine}}j"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h{{eight}}i"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d"></div>
|
||||
<div title="a{{one}}b{{two}}c"></div>
|
||||
<div title="a{{one}}b"></div>
|
||||
<div title="{{one}}"></div>
|
||||
`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h{{eight}}i{{nine}}j"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h{{eight}}i"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d"></div>
|
||||
<div title="a{{one}}b{{two}}c"></div>
|
||||
<div title="a{{one}}b"></div>
|
||||
<div title="{{one}}"></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: [MyComponent] }); })();
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
|
||||
type: NgModule,
|
||||
args: [{ declarations: [MyComponent] }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: interpolated_properties.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
name: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "my-app", never, {}, {}, never, never>;
|
||||
}
|
||||
export declare class MyModule {
|
||||
static ɵmod: i0.ɵɵNgModuleDefWithMeta<MyModule, [typeof MyComponent], never, never>;
|
||||
static ɵinj: i0.ɵɵInjectorDef<MyModule>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: special_property_remapping.js
|
||||
****************************************************************************************************/
|
||||
import { Component, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.forValue = 'some-input';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-component", ngImport: i0, template: { source: `
|
||||
<label [for]="forValue"></label>`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
selector: 'my-component',
|
||||
template: `
|
||||
<label [for]="forValue"></label>`
|
||||
}]
|
||||
}], 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: special_property_remapping.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
forValue: string;
|
||||
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>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: temporary_variables.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
// https://github.com/angular/angular/issues/37194
|
||||
// Verifies that temporary expressions used for expressions with potential side-effects in
|
||||
// the LHS of a safe navigation access are emitted within the binding expression itself, to
|
||||
// ensure that these temporaries are evaluated during the evaluation of the binding. This
|
||||
// is important for when the LHS contains a pipe, as pipe evaluation depends on the current
|
||||
// binding index.
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.myTitle = 'hello';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: '<button [title]="myTitle" [id]="(auth()?.identity() | async)?.id" [tabindex]="1"></button>', isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
template: '<button [title]="myTitle" [id]="(auth()?.identity() | async)?.id" [tabindex]="1"></button>'
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: temporary_variables.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
myTitle: string;
|
||||
auth?: () => {
|
||||
identity(): any;
|
||||
};
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.myTitle = 'hello';
|
||||
this.buttonId = 'special-button';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: '<button [title]="myTitle" [id]="buttonId" [tabindex]="1"></button>', isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{ template: '<button [title]="myTitle" [id]="buttonId" [tabindex]="1"></button>' }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
myTitle: string;
|
||||
buttonId: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings_mixed.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: '<button [title]="1" [attr.id]="2" [tabindex]="3" aria-label="{{1 + 3}}"></button>', isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{ template: '<button [title]="1" [attr.id]="2" [tabindex]="3" aria-label="{{1 + 3}}"></button>' }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings_mixed.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_bindings_with_interpolations.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: '<button [title]="1" [id]="2" tabindex="{{0 + 3}}" aria-label="hello-{{1 + 3}}-{{2 + 3}}"></button>', isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
template: '<button [title]="1" [id]="2" tabindex="{{0 + 3}}" aria-label="hello-{{1 + 3}}-{{2 + 3}}"></button>'
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_bindings_with_interpolations.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_synthetic_bindings.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.expansionState = 'expanded';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: `
|
||||
<button
|
||||
[title]="myTitle"
|
||||
[@expand]="expansionState"
|
||||
[tabindex]="1"
|
||||
[@fade]="'out'"></button>
|
||||
`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
template: `
|
||||
<button
|
||||
[title]="myTitle"
|
||||
[@expand]="expansionState"
|
||||
[tabindex]="1"
|
||||
[@fade]="'out'"></button>
|
||||
`
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_synthetic_bindings.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
expansionState: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_ngtemplate_bindings.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.myTitle = 'hello';
|
||||
this.buttonId = 'custom-id';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: '<ng-template [title]="myTitle" [id]="buttonId" [tabindex]="1"></ng-template>', isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{ template: '<ng-template [title]="myTitle" [id]="buttonId" [tabindex]="1"></ng-template>' }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_ngtemplate_bindings.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
myTitle: string;
|
||||
buttonId: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings_for_multiple_elements.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.myTitle = 'hello';
|
||||
this.buttonId = 'special-button';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: `
|
||||
<button [title]="myTitle" [id]="buttonId" [tabindex]="1"></button>
|
||||
<span [id]="1" [title]="'hello'" [someProp]="1 + 2"></span>
|
||||
<custom-element [prop]="'one'" [otherProp]="2"></custom-element>
|
||||
`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
template: `
|
||||
<button [title]="myTitle" [id]="buttonId" [tabindex]="1"></button>
|
||||
<span [id]="1" [title]="'hello'" [someProp]="1 + 2"></span>
|
||||
<custom-element [prop]="'one'" [otherProp]="2"></custom-element>
|
||||
`
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings_for_multiple_elements.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
myTitle: string;
|
||||
buttonId: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings_with_child_elements.js
|
||||
****************************************************************************************************/
|
||||
import { Component } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.myTitle = 'hello';
|
||||
this.buttonId = 'special-button';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "ng-component", ngImport: i0, template: { source: `
|
||||
<button [title]="myTitle" [id]="buttonId" [tabindex]="1">
|
||||
<span [id]="1" [title]="'hello'" [someProp]="1 + 2"></span>
|
||||
</button>`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
template: `
|
||||
<button [title]="myTitle" [id]="buttonId" [tabindex]="1">
|
||||
<span [id]="1" [title]="'hello'" [someProp]="1 + 2"></span>
|
||||
</button>`
|
||||
}]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: chain_multiple_bindings_with_child_elements.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
myTitle: string;
|
||||
buttonId: string;
|
||||
static ɵfac: i0.ɵɵFactoryDef<MyComponent, never>;
|
||||
static ɵcmp: i0.ɵɵComponentDefWithMeta<MyComponent, "ng-component", never, {}, {}, never, never>;
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,173 @@
|
|||
{
|
||||
"$schema": "../../test_case_schema.json",
|
||||
"cases": [
|
||||
{
|
||||
"description": "should generate bind instruction",
|
||||
"inputFiles": [
|
||||
"bind.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect property binding",
|
||||
"files": [
|
||||
"bind.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should generate interpolation instruction for {{...}} bindings",
|
||||
"inputFiles": [
|
||||
"interpolation.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect interpolated property binding",
|
||||
"files": [
|
||||
"interpolation.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should generate the proper update instructions for interpolated properties",
|
||||
"inputFiles": [
|
||||
"interpolated_properties.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect handling of interpolated properties",
|
||||
"files": [
|
||||
"interpolated_properties.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should not remap property names whose names do not correspond to their attribute names",
|
||||
"inputFiles": [
|
||||
"special_property_remapping.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"special_property_remapping.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should emit temporary evaluation within the binding expression for in-order execution",
|
||||
"inputFiles": [
|
||||
"temporary_variables.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"temporary_variables.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple property bindings into a single instruction",
|
||||
"inputFiles": [
|
||||
"chain_multiple_bindings.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_multiple_bindings.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain property bindings in the presence of other bindings",
|
||||
"inputFiles": [
|
||||
"chain_multiple_bindings_mixed.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_multiple_bindings_mixed.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should not add interpolated properties to the property instruction chain",
|
||||
"inputFiles": [
|
||||
"chain_bindings_with_interpolations.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_bindings_with_interpolations.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain synthetic property bindings together with regular property bindings",
|
||||
"inputFiles": [
|
||||
"chain_synthetic_bindings.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_synthetic_bindings.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple property bindings on an ng-template",
|
||||
"inputFiles": [
|
||||
"chain_ngtemplate_bindings.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_ngtemplate_bindings.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple property bindings when there are multiple elements",
|
||||
"inputFiles": [
|
||||
"chain_multiple_bindings_for_multiple_elements.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_multiple_bindings_for_multiple_elements.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"description": "should chain multiple property bindings when there are child elements",
|
||||
"inputFiles": [
|
||||
"chain_multiple_bindings_with_child_elements.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect template",
|
||||
"files": [
|
||||
"chain_multiple_bindings_with_child_elements.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,9 @@
|
|||
consts: [[__AttributeMarker.Bindings__, "title"]],
|
||||
template:function MyComponent_Template(rf, $ctx$){
|
||||
if (rf & 1) {
|
||||
$i0$.ɵɵelement(0, "a", 0);
|
||||
}
|
||||
if (rf & 2) {
|
||||
$i0$.ɵɵproperty("title", $ctx$.title);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import {Component, NgModule} from '@angular/core';
|
||||
|
||||
@Component({selector: 'my-app', template: '<a [title]="title"></a>'})
|
||||
export class MyComponent {
|
||||
title = 'Hello World';
|
||||
}
|
||||
|
||||
@NgModule({declarations: [MyComponent]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵpropertyInterpolate("tabindex", 0 + 3);
|
||||
$r3$.ɵɵpropertyInterpolate2("aria-label", "hello-", 1 + 3, "-", 2 + 3, "");
|
||||
$r3$.ɵɵproperty("title", 1)("id", 2);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
template:
|
||||
'<button [title]="1" [id]="2" tabindex="{{0 + 3}}" aria-label="hello-{{1 + 3}}-{{2 + 3}}"></button>'
|
||||
})
|
||||
export class MyComponent {
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵproperty("title", ctx.myTitle)("id", ctx.buttonId)("tabindex", 1);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component({template: '<button [title]="myTitle" [id]="buttonId" [tabindex]="1"></button>'})
|
||||
export class MyComponent {
|
||||
myTitle = 'hello';
|
||||
buttonId = 'special-button';
|
||||
}
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵproperty("title", ctx.myTitle)("id", ctx.buttonId)("tabindex", 1);
|
||||
$r3$.ɵɵadvance(1);
|
||||
$r3$.ɵɵproperty("id", 1)("title", "hello")("someProp", 1 + 2);
|
||||
$r3$.ɵɵadvance(1);
|
||||
$r3$.ɵɵproperty("prop", "one")("otherProp", 2);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
template: `
|
||||
<button [title]="myTitle" [id]="buttonId" [tabindex]="1"></button>
|
||||
<span [id]="1" [title]="'hello'" [someProp]="1 + 2"></span>
|
||||
<custom-element [prop]="'one'" [otherProp]="2"></custom-element>
|
||||
`
|
||||
})
|
||||
export class MyComponent {
|
||||
myTitle = 'hello';
|
||||
buttonId = 'special-button';
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵpropertyInterpolate("aria-label", 1 + 3);
|
||||
$r3$.ɵɵproperty("title", 1)("tabindex", 3);
|
||||
$r3$.ɵɵattribute("id", 2);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component(
|
||||
{template: '<button [title]="1" [attr.id]="2" [tabindex]="3" aria-label="{{1 + 3}}"></button>'})
|
||||
export class MyComponent {
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵproperty("title", ctx.myTitle)("id", ctx.buttonId)("tabindex", 1);
|
||||
$r3$.ɵɵadvance(1);
|
||||
$r3$.ɵɵproperty("id", 1)("title", "hello")("someProp", 1 + 2);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
template: `
|
||||
<button [title]="myTitle" [id]="buttonId" [tabindex]="1">
|
||||
<span [id]="1" [title]="'hello'" [someProp]="1 + 2"></span>
|
||||
</button>`
|
||||
})
|
||||
export class MyComponent {
|
||||
myTitle = 'hello';
|
||||
buttonId = 'special-button';
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵproperty("title", ctx.myTitle)("id", ctx.buttonId)("tabindex", 1);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component(
|
||||
{template: '<ng-template [title]="myTitle" [id]="buttonId" [tabindex]="1"></ng-template>'})
|
||||
export class MyComponent {
|
||||
myTitle = 'hello';
|
||||
buttonId = 'custom-id';
|
||||
}
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵproperty("title", ctx.myTitle)("@expand", ctx.expansionState)("tabindex", 1)("@fade", "out");
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
template: `
|
||||
<button
|
||||
[title]="myTitle"
|
||||
[@expand]="expansionState"
|
||||
[tabindex]="1"
|
||||
[@fade]="'out'"></button>
|
||||
`
|
||||
})
|
||||
export class MyComponent {
|
||||
expansionState = 'expanded';
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
…
|
||||
consts: [[__AttributeMarker.Bindings__, "someProp"]],
|
||||
template:function MyComponent_Template(rf, $ctx$){
|
||||
if (rf & 1) {
|
||||
$i0$.ɵɵelement(0, "a", 0);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
@Component({selector: 'test', template: '<a [someProp]></a>'})
|
||||
export class FooCmp {
|
||||
}
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
if (rf & 2) {
|
||||
i0.ɵɵpropertyInterpolateV("title", ["a", ctx.one, "b", ctx.two, "c", ctx.three, "d", ctx.four, "e", ctx.five, "f", ctx.six, "g", ctx.seven, "h", ctx.eight, "i", ctx.nine, "j"]);
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵpropertyInterpolate8("title", "a", ctx.one, "b", ctx.two, "c", ctx.three, "d", ctx.four, "e", ctx.five, "f", ctx.six, "g", ctx.seven, "h", ctx.eight, "i");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵpropertyInterpolate7("title", "a", ctx.one, "b", ctx.two, "c", ctx.three, "d", ctx.four, "e", ctx.five, "f", ctx.six, "g", ctx.seven, "h");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵpropertyInterpolate6("title", "a", ctx.one, "b", ctx.two, "c", ctx.three, "d", ctx.four, "e", ctx.five, "f", ctx.six, "g");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵpropertyInterpolate5("title", "a", ctx.one, "b", ctx.two, "c", ctx.three, "d", ctx.four, "e", ctx.five, "f");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵpropertyInterpolate4("title", "a", ctx.one, "b", ctx.two, "c", ctx.three, "d", ctx.four, "e");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵpropertyInterpolate3("title", "a", ctx.one, "b", ctx.two, "c", ctx.three, "d");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵpropertyInterpolate2("title", "a", ctx.one, "b", ctx.two, "c");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵpropertyInterpolate1("title", "a", ctx.one, "b");
|
||||
i0.ɵɵadvance(1);
|
||||
i0.ɵɵpropertyInterpolate("title", ctx.one);
|
||||
}
|
||||
…
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
import {Component, NgModule} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h{{eight}}i{{nine}}j"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h{{eight}}i"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g{{seven}}h"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f{{six}}g"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e{{five}}f"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d{{four}}e"></div>
|
||||
<div title="a{{one}}b{{two}}c{{three}}d"></div>
|
||||
<div title="a{{one}}b{{two}}c"></div>
|
||||
<div title="a{{one}}b"></div>
|
||||
<div title="{{one}}"></div>
|
||||
`
|
||||
})
|
||||
export class MyComponent {
|
||||
name = 'John Doe';
|
||||
}
|
||||
|
||||
@NgModule({declarations: [MyComponent]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
|
||||
…
|
||||
consts: [[__AttributeMarker.Bindings__, "title"]],
|
||||
template:function MyComponent_Template(rf, $ctx$){
|
||||
if (rf & 1) {
|
||||
$i0$.ɵɵelement(0, "a", 0);
|
||||
}
|
||||
if (rf & 2) {
|
||||
$i0$.ɵɵpropertyInterpolate1("title", "Hello ", $ctx$.name, "");
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import {Component, NgModule} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-component',
|
||||
template: `
|
||||
<a title="Hello {{name}}"></a>`
|
||||
})
|
||||
export class MyComponent {
|
||||
name = 'World';
|
||||
}
|
||||
|
||||
@NgModule({declarations: [MyComponent]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
|
||||
consts: [[__AttributeMarker.Bindings__, "for"]]
|
||||
|
||||
// ...
|
||||
|
||||
function MyComponent_Template(rf, ctx) {
|
||||
if (rf & 1) {
|
||||
$i0$.ɵɵelement(0, "label", 0);
|
||||
}
|
||||
if (rf & 2) {
|
||||
$i0$.ɵɵproperty("for", ctx.forValue);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import {Component, NgModule} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-component',
|
||||
template: `
|
||||
<label [for]="forValue"></label>`
|
||||
})
|
||||
export class MyComponent {
|
||||
forValue = 'some-input';
|
||||
}
|
||||
|
||||
@NgModule({declarations: [MyComponent]})
|
||||
export class MyModule {
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
template: function MyComponent_Template(rf, ctx) {
|
||||
…
|
||||
if (rf & 2) {
|
||||
let $tmp0$ = null;
|
||||
$r3$.ɵɵproperty("title", ctx.myTitle)("id", ($tmp0$ = $r3$.ɵɵpipeBind1(1, 3, ($tmp0$ = ctx.auth()) == null ? null : $tmp0$.identity())) == null ? null : $tmp0$.id)("tabindex", 1);
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
import {Component} from '@angular/core';
|
||||
|
||||
// https://github.com/angular/angular/issues/37194
|
||||
// Verifies that temporary expressions used for expressions with potential side-effects in
|
||||
// the LHS of a safe navigation access are emitted within the binding expression itself, to
|
||||
// ensure that these temporaries are evaluated during the evaluation of the binding. This
|
||||
// is important for when the LHS contains a pipe, as pipe evaluation depends on the current
|
||||
// binding index.
|
||||
@Component({
|
||||
template:
|
||||
'<button [title]="myTitle" [id]="(auth()?.identity() | async)?.id" [tabindex]="1"></button>'
|
||||
})
|
||||
export class MyComponent {
|
||||
myTitle = 'hello';
|
||||
auth?: () => {
|
||||
identity(): any;
|
||||
};
|
||||
}
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
/****************************************************************************************************
|
||||
* PARTIAL FILE: interpolation.js
|
||||
****************************************************************************************************/
|
||||
import { Component, NgModule } from '@angular/core';
|
||||
import * as i0 from "@angular/core";
|
||||
export class MyComponent {
|
||||
constructor() {
|
||||
this.name = 'World';
|
||||
}
|
||||
}
|
||||
MyComponent.ɵfac = function MyComponent_Factory(t) { return new (t || MyComponent)(); };
|
||||
MyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ version: 1, type: MyComponent, selector: "my-component", ngImport: i0, template: { source: `
|
||||
<div>Hello {{ name }}</div>`, isInline: true } });
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyComponent, [{
|
||||
type: Component,
|
||||
args: [{
|
||||
selector: 'my-component',
|
||||
template: `
|
||||
<div>Hello {{ name }}</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: [MyComponent] }); })();
|
||||
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(MyModule, [{
|
||||
type: NgModule,
|
||||
args: [{ declarations: [MyComponent] }]
|
||||
}], null, null); })();
|
||||
|
||||
/****************************************************************************************************
|
||||
* PARTIAL FILE: interpolation.d.ts
|
||||
****************************************************************************************************/
|
||||
import * as i0 from "@angular/core";
|
||||
export declare class MyComponent {
|
||||
name: string;
|
||||
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>;
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
{
|
||||
"$schema": "../../test_case_schema.json",
|
||||
"cases": [
|
||||
{
|
||||
"description": "should generate interpolation instruction",
|
||||
"inputFiles": [
|
||||
"interpolation.ts"
|
||||
],
|
||||
"expectations": [
|
||||
{
|
||||
"failureMessage": "Incorrect interpolated text binding",
|
||||
"files": [
|
||||
"interpolation.js"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
|
||||
template:function MyComponent_Template(rf, $ctx$){
|
||||
if (rf & 1) {
|
||||
$i0$.ɵɵelementStart(0, "div");
|
||||
$i0$.ɵɵtext(1);
|
||||
$i0$.ɵɵelementEnd();
|
||||
}
|
||||
if (rf & 2) {
|
||||
$r3$.ɵɵadvance(1);
|
||||
$i0$.ɵɵtextInterpolate1("Hello ", $ctx$.name, "");
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
import {Component, NgModule} from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'my-component',
|
||||
template: `
|
||||
<div>Hello {{ name }}</div>`
|
||||
})
|
||||
export class MyComponent {
|
||||
name = 'World';
|
||||
}
|
||||
|
||||
@NgModule({declarations: [MyComponent]})
|
||||
export class MyModule {
|
||||
}
|
||||
Loading…
Reference in New Issue