Skip to content

Commit

Permalink
fix(ivy): match directives on bindings and element outputs
Browse files Browse the repository at this point in the history 
Closes #23560
  • Loading branch information
@pkozlowski-opensource
pkozlowski-opensource committed Aug 22, 2018
1 parent f33dbf4 commit 904b664
Show file tree
Hide file tree
Showing 16 changed files with 459 additions and 101 deletions.
9 changes: 5 additions & 4 deletions packages/common/test/directives/ng_class_spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ import {ComponentFixture, TestBed, async} from '@angular/core/testing';

function detectChangesAndExpectClassName(classes: string): void {
fixture !.detectChanges();
console.log(fixture !.nativeElement.className);
let nonNormalizedClassName = fixture !.debugElement.children[0].nativeElement.className;
expect(normalizeClassNames(nonNormalizedClassName)).toEqual(normalizeClassNames(classes));
}
Expand All @@ -44,11 +45,11 @@ import {ComponentFixture, TestBed, async} from '@angular/core/testing';

describe('expressions evaluating to objects', () => {

it('should add classes specified in an object literal', async(() => {
fixture = createTestComponent('<div [ngClass]="{foo: true, bar: false}"></div>');
fit('should add classes specified in an object literal', async(() => {
fixture = createTestComponent('<div [ngClass]="{foo: true, bar: false}"></div>');

detectChangesAndExpectClassName('foo');
}));
detectChangesAndExpectClassName('foo');
}));

it('should add classes specified in an object literal without change in class names',
async(() => {
Expand Down
47 changes: 27 additions & 20 deletions packages/compiler-cli/test/compliance/r3_compiler_compliance_spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -200,7 +200,7 @@ describe('compiler compliance', () => {

// The template should look like this (where IDENT is a wild card for an identifier):
const template = `
const $c1$ = ["class", "my-app", 0, "http://someuri/foo", "foo:bar", "baz", "title", "Hello", 0, "http://someuri/foo", "foo:qux", "quacks"];
const $e0_attrs$ = ["class", "my-app", 0, "http://someuri/foo", "foo:bar", "baz", "title", "Hello", 0, "http://someuri/foo", "foo:qux", "quacks"];
…
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
Expand Down Expand Up @@ -315,9 +315,11 @@ describe('compiler compliance', () => {
const factory =
'factory: function MyComponent_Factory(t) { return new (t || MyComponent)(); }';
const template = `
const $e0_attrs$ = [$r3$.ɵamSelectOnly, "id"];
…
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵelement(0, "div");
$r3$.ɵelement(0, "div", $e0_attrs$);
}
if (rf & 2) {
$r3$.ɵelementProperty(0, "id", $r3$.ɵbind(ctx.id));
Expand Down Expand Up @@ -357,20 +359,21 @@ describe('compiler compliance', () => {
}
};

const $e0_attrs$ = [];
const factory =
'factory: function MyComponent_Factory(t) { return new (t || MyComponent)(); }';
const template = `
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵelement(0, "div");
$r3$.ɵelement(0, "div", $e0_attrs$);
$r3$.ɵpipe(1,"pipe");
$r3$.ɵreserveSlots(10);
}
if (rf & 2) {
$r3$.ɵelementProperty(0, "ternary", $r3$.ɵbind((ctx.cond ? $r3$.ɵpureFunction1(6, _c0, ctx.a): _c1)));
$r3$.ɵelementProperty(0, "ternary", $r3$.ɵbind((ctx.cond ? $r3$.ɵpureFunction1(6, _c1, ctx.a): _c2)));
$r3$.ɵelementProperty(0, "pipe", $r3$.ɵbind($r3$.ɵpipeBind3(1, 4, ctx.value, 1, 2)));
$r3$.ɵelementProperty(0, "and", $r3$.ɵbind((ctx.cond && $r3$.ɵpureFunction1(8, _c0, ctx.b))));
$r3$.ɵelementProperty(0, "or", $r3$.ɵbind((ctx.cond || $r3$.ɵpureFunction1(10, _c0, ctx.c))));
$r3$.ɵelementProperty(0, "and", $r3$.ɵbind((ctx.cond && $r3$.ɵpureFunction1(8, _c1, ctx.b))));
$r3$.ɵelementProperty(0, "or", $r3$.ɵbind((ctx.cond || $r3$.ɵpureFunction1(10, _c1, ctx.c))));
}
}
`;
Expand Down Expand Up @@ -706,6 +709,7 @@ describe('compiler compliance', () => {
};

const MyAppDeclaration = `
const $e0_attrs$ = [$r3$.ɵamSelectOnly, "names"];
const $e0_ff$ = function ($v$) { return ["Nancy", $v$]; };
…
MyApp.ngComponentDef = $r3$.ɵdefineComponent({
Expand All @@ -717,7 +721,7 @@ describe('compiler compliance', () => {
vars: 3,
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵelement(0, "my-comp");
$r3$.ɵelement(0, "my-comp", $e0_attrs$);
$r3$.ɵreserveSlots(2);
}
if (rf & 2) {
Expand Down Expand Up @@ -786,6 +790,7 @@ describe('compiler compliance', () => {
};

const MyAppDefinition = `
const $e0_attr$ = [$r3$.ɵamSelectOnly, "names"];
const $e0_ff$ = function ($v0$, $v1$, $v2$, $v3$, $v4$, $v5$, $v6$, $v7$, $v8$) {
return ["start-", $v0$, $v1$, $v2$, $v3$, $v4$, "-middle-", $v5$, $v6$, $v7$, $v8$, "-end"];
}
Expand All @@ -799,7 +804,7 @@ describe('compiler compliance', () => {
vars: 11,
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵelement(0, "my-comp");
$r3$.ɵelement(0, "my-comp", $e0_attr$);
$r3$.ɵreserveSlots(10);
}
if (rf & 2) {
Expand Down Expand Up @@ -852,6 +857,7 @@ describe('compiler compliance', () => {
};

const MyAppDefinition = `
const $e0_attrs$ = [$r3$.ɵamSelectOnly, "config"];
const $e0_ff$ = function ($v$) { return {"duration": 500, animation: $v$}; };
…
MyApp.ngComponentDef = $r3$.ɵdefineComponent({
Expand All @@ -863,7 +869,7 @@ describe('compiler compliance', () => {
vars: 3,
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵelement(0, "object-comp");
$r3$.ɵelement(0, "object-comp", $e0_attrs$);
$r3$.ɵreserveSlots(2);
}
if (rf & 2) {
Expand Down Expand Up @@ -917,6 +923,7 @@ describe('compiler compliance', () => {
};

const MyAppDefinition = `
const $e0_attrs$ = [$r3$.ɵamSelectOnly, "config"];
const $c0$ = {opacity: 0, duration: 0};
const $e0_ff$ = function ($v$) { return {opacity: 1, duration: $v$}; };
const $e0_ff_1$ = function ($v$) { return [$c0$, $v$]; };
Expand All @@ -931,7 +938,7 @@ describe('compiler compliance', () => {
vars: 8,
template: function MyApp_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵelement(0, "nested-comp");
$r3$.ɵelement(0, "nested-comp", $e0_attrs$);
$r3$.ɵreserveSlots(7);
}
if (rf & 2) {
Expand Down Expand Up @@ -1439,9 +1446,9 @@ describe('compiler compliance', () => {
};

const template = `
const $c0$ = ["ngFor","","ngForOf",""];
const $c0$ = ["ngFor", "" , $i0$.ɵamSelectOnly, "ngForOf"];
const $c1$ = ["foo", ""];
const $c2$ = ["ngIf",""];
const $c2$ = [$i0$.ɵamSelectOnly, "ngIf"];
function MyComponent_div_span_Template_3(rf, ctx) {
if (rf & 1) {
Expand Down Expand Up @@ -1551,8 +1558,8 @@ describe('compiler compliance', () => {
vars: 2,
template: function SimpleLayout_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵelement(0, "lifecycle-comp");
$r3$.ɵelement(1, "lifecycle-comp");
$r3$.ɵelement(0, "lifecycle-comp", $e0_attrs$);
$r3$.ɵelement(1, "lifecycle-comp", $e1_attrs$);
}
if (rf & 2) {
$r3$.ɵelementProperty(0, "name", $r3$.ɵbind(ctx.name1));
Expand Down Expand Up @@ -1662,7 +1669,7 @@ describe('compiler compliance', () => {
`;

const MyComponentDefinition = `
const $_c0$ = ["for","","forOf",""];
const $t1_attrs$ = ["for", "", $r3$.ɵamSelectOnly, "forOf"];
function MyComponent__svg_g_Template_1(rf, ctx) {
if (rf & 1) {
$r3$.ɵnamespaceSVG();
Expand All @@ -1683,7 +1690,7 @@ describe('compiler compliance', () => {
if (rf & 1) {
$r3$.ɵnamespaceSVG();
$r3$.ɵelementStart(0,"svg");
$r3$.ɵtemplate(1, MyComponent__svg_g_Template_1, 2, 0, null, $_c0$);
$r3$.ɵtemplate(1, MyComponent__svg_g_Template_1, 2, 0, null, $t1_attrs$);
$r3$.ɵelementEnd();
}
if (rf & 2) { $r3$.ɵelementProperty(1,"forOf",$r3$.ɵbind(ctx.items)); }
Expand Down Expand Up @@ -1738,7 +1745,7 @@ describe('compiler compliance', () => {
`;

const MyComponentDefinition = `
const $_c0$ = ["for","","forOf",""];
const $t1_attrs$ = ["for", "", $r3$.ɵamSelectOnly, "forOf"];
function MyComponent_li_Template_1(rf, ctx) {
if (rf & 1) {
$r3$.ɵelementStart(0, "li");
Expand All @@ -1761,7 +1768,7 @@ describe('compiler compliance', () => {
template: function MyComponent_Template(rf, ctx) {
if (rf & 1) {
$r3$.ɵelementStart(0, "ul");
$r3$.ɵtemplate(1, MyComponent_li_Template_1, 2, 1, null, $_c0$);
$r3$.ɵtemplate(1, MyComponent_li_Template_1, 2, 1, null, $t1_attrs$);
$r3$.ɵelementEnd();
}
if (rf & 2) {
Expand Down Expand Up @@ -1818,7 +1825,7 @@ describe('compiler compliance', () => {
};

const MyComponentDefinition = `
const $c1$ = ["for", "", "forOf", ""];
const $t4_attrs$ = ["for", "", $r3$.ɵamSelectOnly, "forOf"];
function MyComponent_li_li_Template_4(rf, ctx) {
if (rf & 1) {
$r3$.ɵelementStart(0, "li");
Expand All @@ -1839,7 +1846,7 @@ describe('compiler compliance', () => {
$r3$.ɵtext(2);
$r3$.ɵelementEnd();
$r3$.ɵelementStart(3, "ul");
$r3$.ɵtemplate(4, MyComponent_li_li_Template_4, 2, 1, null, $c1$);
$r3$.ɵtemplate(4, MyComponent_li_li_Template_4, 2, 1, null, $t4_attrs$);
$r3$.ɵelementEnd();
$r3$.ɵelementEnd();
}
Expand Down
8 changes: 6 additions & 2 deletions packages/compiler-cli/test/compliance/r3_view_compiler_binding_spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,9 +73,11 @@ describe('compiler compliance: bindings', () => {
};

const template = `
const $e0_attrs$ = [$i0$.ɵamSelectOnly, "title"];
…
template:function MyComponent_Template(rf, $ctx$){
if (rf & 1) {
$i0$.ɵelement(0, "a");
$i0$.ɵelement(0, "a", $e0_attrs$);
}
if (rf & 2) {
$i0$.ɵelementProperty(0, "title", $i0$.ɵbind($ctx$.title));
Expand Down Expand Up @@ -105,9 +107,11 @@ describe('compiler compliance: bindings', () => {
};

const template = `
const $e0_attrs$ = [$i0$.ɵamSelectOnly, "title"];
…
template:function MyComponent_Template(rf, $ctx$){
if (rf & 1) {
$i0$.ɵelement(0, "a");
$i0$.ɵelement(0, "a", $e0_attrs$);
}
if (rf & 2) {
$i0$.ɵelementProperty(0, "title", $i0$.ɵinterpolation1("Hello ", $ctx$.name, ""));
Expand Down

0 comments on commit 904b664

Please sign in to comment.