test(core): add JIRA references for root-casuse ivy TestBed failures (#27196)
PR Close #27196
This commit is contained in:
Pawel Kozlowski
Miško Hevery
parent
a72250bace
commit
d666370e16
@ -15,10 +15,10 @@ import {fixmeIvy} from '@angular/private/testing';
|
||||
|
||||
{
|
||||
if (ivyEnabled) {
|
||||
fixmeIvy('unknown') && describe('ivy', () => { declareTests(); });
|
||||
describe('ivy', () => { declareTests(); });
|
||||
} else {
|
||||
fixmeIvy('unknown') && describe('jit', () => { declareTests({useJit: true}); });
|
||||
fixmeIvy('unknown') && describe('no jit', () => { declareTests({useJit: false}); });
|
||||
describe('jit', () => { declareTests({useJit: true}); });
|
||||
describe('no jit', () => { declareTests({useJit: false}); });
|
||||
}
|
||||
}
|
||||
|
||||
@ -71,18 +71,21 @@ function declareTests(config?: {useJit: boolean}) {
|
||||
expect(childComp.cfr.resolveComponentFactory(ChildComp) !.componentType).toBe(ChildComp);
|
||||
});
|
||||
|
||||
it('should not be able to get components from a parent component (content hierarchy)', () => {
|
||||
TestBed.overrideComponent(MainComp, {set: {template: '<child><nested></nested></child>'}});
|
||||
TestBed.overrideComponent(ChildComp, {set: {template: '<ng-content></ng-content>'}});
|
||||
fixmeIvy('unknown') &&
|
||||
it('should not be able to get components from a parent component (content hierarchy)',
|
||||
() => {
|
||||
TestBed.overrideComponent(
|
||||
MainComp, {set: {template: '<child><nested></nested></child>'}});
|
||||
TestBed.overrideComponent(ChildComp, {set: {template: '<ng-content></ng-content>'}});
|
||||
|
||||
const compFixture = TestBed.createComponent(MainComp);
|
||||
const nestedChildCompEl = compFixture.debugElement.children[0].children[0];
|
||||
const nestedChildComp: NestedChildComp = nestedChildCompEl.componentInstance;
|
||||
expect(nestedChildComp.cfr.resolveComponentFactory(ChildComp) !.componentType)
|
||||
.toBe(ChildComp);
|
||||
expect(() => nestedChildComp.cfr.resolveComponentFactory(NestedChildComp))
|
||||
.toThrow(noComponentFactoryError(NestedChildComp));
|
||||
});
|
||||
const compFixture = TestBed.createComponent(MainComp);
|
||||
const nestedChildCompEl = compFixture.debugElement.children[0].children[0];
|
||||
const nestedChildComp: NestedChildComp = nestedChildCompEl.componentInstance;
|
||||
expect(nestedChildComp.cfr.resolveComponentFactory(ChildComp) !.componentType)
|
||||
.toBe(ChildComp);
|
||||
expect(() => nestedChildComp.cfr.resolveComponentFactory(NestedChildComp))
|
||||
.toThrow(noComponentFactoryError(NestedChildComp));
|
||||
});
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -15,7 +15,8 @@ import {expect} from '@angular/platform-browser/testing/src/matchers';
|
||||
import {fixmeIvy} from '@angular/private/testing';
|
||||
|
||||
{
|
||||
fixmeIvy('unknown') && describe('Jit Summaries', () => {
|
||||
// ivy fix in https://github.com/angular/angular/pull/26871
|
||||
fixmeIvy('FW-514: ngSummary shims not generated by ngtsc') && describe('Jit Summaries', () => {
|
||||
let instances: Map<any, Base>;
|
||||
let summaries: () => any[];
|
||||
|
||||
|
||||
@ -15,10 +15,10 @@ import {fixmeIvy} from '@angular/private/testing';
|
||||
|
||||
{
|
||||
if (ivyEnabled) {
|
||||
fixmeIvy('unknown') && describe('ivy', () => { declareTests(); });
|
||||
describe('ivy', () => { declareTests(); });
|
||||
} else {
|
||||
fixmeIvy('unknown') && describe('jit', () => { declareTests({useJit: true}); });
|
||||
fixmeIvy('unknown') && describe('no jit', () => { declareTests({useJit: false}); });
|
||||
describe('jit', () => { declareTests({useJit: true}); });
|
||||
describe('no jit', () => { declareTests({useJit: false}); });
|
||||
}
|
||||
}
|
||||
|
||||
@ -38,74 +38,78 @@ function declareTests(config?: {useJit: boolean}) {
|
||||
});
|
||||
});
|
||||
|
||||
it('should support the "i18n" attribute', () => {
|
||||
const template = '<ng-container i18n>foo</ng-container>';
|
||||
TestBed.overrideComponent(MyComp, {set: {template}});
|
||||
const fixture = TestBed.createComponent(MyComp);
|
||||
fixmeIvy('FW-663: ReferenceError: goog is not defined') &&
|
||||
it('should support the "i18n" attribute', () => {
|
||||
const template = '<ng-container i18n>foo</ng-container>';
|
||||
TestBed.overrideComponent(MyComp, {set: {template}});
|
||||
const fixture = TestBed.createComponent(MyComp);
|
||||
|
||||
fixture.detectChanges();
|
||||
fixture.detectChanges();
|
||||
|
||||
const el = fixture.nativeElement;
|
||||
expect(el).toHaveText('foo');
|
||||
});
|
||||
const el = fixture.nativeElement;
|
||||
expect(el).toHaveText('foo');
|
||||
});
|
||||
|
||||
it('should be rendered as comment with children as siblings', () => {
|
||||
const template = '<ng-container><p></p></ng-container>';
|
||||
TestBed.overrideComponent(MyComp, {set: {template}});
|
||||
const fixture = TestBed.createComponent(MyComp);
|
||||
fixmeIvy('FW-678: ivy generates different DOM structure for <ng-container>') &&
|
||||
it('should be rendered as comment with children as siblings', () => {
|
||||
const template = '<ng-container><p></p></ng-container>';
|
||||
TestBed.overrideComponent(MyComp, {set: {template}});
|
||||
const fixture = TestBed.createComponent(MyComp);
|
||||
|
||||
fixture.detectChanges();
|
||||
fixture.detectChanges();
|
||||
|
||||
const el = fixture.nativeElement;
|
||||
const children = getDOM().childNodes(el);
|
||||
expect(children.length).toBe(2);
|
||||
expect(getDOM().isCommentNode(children[0])).toBe(true);
|
||||
expect(getDOM().tagName(children[1]).toUpperCase()).toEqual('P');
|
||||
});
|
||||
const el = fixture.nativeElement;
|
||||
const children = getDOM().childNodes(el);
|
||||
expect(children.length).toBe(2);
|
||||
expect(getDOM().isCommentNode(children[0])).toBe(true);
|
||||
expect(getDOM().tagName(children[1]).toUpperCase()).toEqual('P');
|
||||
});
|
||||
|
||||
it('should support nesting', () => {
|
||||
const template =
|
||||
'<ng-container>1</ng-container><ng-container><ng-container>2</ng-container></ng-container>';
|
||||
TestBed.overrideComponent(MyComp, {set: {template}});
|
||||
const fixture = TestBed.createComponent(MyComp);
|
||||
fixmeIvy('FW-678: ivy generates different DOM structure for <ng-container>') &&
|
||||
it('should support nesting', () => {
|
||||
const template =
|
||||
'<ng-container>1</ng-container><ng-container><ng-container>2</ng-container></ng-container>';
|
||||
TestBed.overrideComponent(MyComp, {set: {template}});
|
||||
const fixture = TestBed.createComponent(MyComp);
|
||||
|
||||
fixture.detectChanges();
|
||||
fixture.detectChanges();
|
||||
|
||||
const el = fixture.nativeElement;
|
||||
const children = getDOM().childNodes(el);
|
||||
expect(children.length).toBe(5);
|
||||
expect(getDOM().isCommentNode(children[0])).toBe(true);
|
||||
expect(children[1]).toHaveText('1');
|
||||
expect(getDOM().isCommentNode(children[2])).toBe(true);
|
||||
expect(getDOM().isCommentNode(children[3])).toBe(true);
|
||||
expect(children[4]).toHaveText('2');
|
||||
});
|
||||
const el = fixture.nativeElement;
|
||||
const children = getDOM().childNodes(el);
|
||||
expect(children.length).toBe(5);
|
||||
expect(getDOM().isCommentNode(children[0])).toBe(true);
|
||||
expect(children[1]).toHaveText('1');
|
||||
expect(getDOM().isCommentNode(children[2])).toBe(true);
|
||||
expect(getDOM().isCommentNode(children[3])).toBe(true);
|
||||
expect(children[4]).toHaveText('2');
|
||||
});
|
||||
|
||||
it('should group inner nodes', () => {
|
||||
const template = '<ng-container *ngIf="ctxBoolProp"><p></p><b></b></ng-container>';
|
||||
TestBed.overrideComponent(MyComp, {set: {template}});
|
||||
const fixture = TestBed.createComponent(MyComp);
|
||||
fixmeIvy('FW-678: ivy generates different DOM structure for <ng-container>') &&
|
||||
it('should group inner nodes', () => {
|
||||
const template = '<ng-container *ngIf="ctxBoolProp"><p></p><b></b></ng-container>';
|
||||
TestBed.overrideComponent(MyComp, {set: {template}});
|
||||
const fixture = TestBed.createComponent(MyComp);
|
||||
|
||||
fixture.componentInstance.ctxBoolProp = true;
|
||||
fixture.detectChanges();
|
||||
fixture.componentInstance.ctxBoolProp = true;
|
||||
fixture.detectChanges();
|
||||
|
||||
const el = fixture.nativeElement;
|
||||
const children = getDOM().childNodes(el);
|
||||
const el = fixture.nativeElement;
|
||||
const children = getDOM().childNodes(el);
|
||||
|
||||
expect(children.length).toBe(4);
|
||||
// ngIf anchor
|
||||
expect(getDOM().isCommentNode(children[0])).toBe(true);
|
||||
// ng-container anchor
|
||||
expect(getDOM().isCommentNode(children[1])).toBe(true);
|
||||
expect(getDOM().tagName(children[2]).toUpperCase()).toEqual('P');
|
||||
expect(getDOM().tagName(children[3]).toUpperCase()).toEqual('B');
|
||||
expect(children.length).toBe(4);
|
||||
// ngIf anchor
|
||||
expect(getDOM().isCommentNode(children[0])).toBe(true);
|
||||
// ng-container anchor
|
||||
expect(getDOM().isCommentNode(children[1])).toBe(true);
|
||||
expect(getDOM().tagName(children[2]).toUpperCase()).toEqual('P');
|
||||
expect(getDOM().tagName(children[3]).toUpperCase()).toEqual('B');
|
||||
|
||||
fixture.componentInstance.ctxBoolProp = false;
|
||||
fixture.detectChanges();
|
||||
fixture.componentInstance.ctxBoolProp = false;
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(children.length).toBe(1);
|
||||
expect(getDOM().isCommentNode(children[0])).toBe(true);
|
||||
});
|
||||
expect(children.length).toBe(1);
|
||||
expect(getDOM().isCommentNode(children[0])).toBe(true);
|
||||
});
|
||||
|
||||
it('should work with static content projection', () => {
|
||||
const template = `<simple><ng-container><p>1</p><p>2</p></ng-container></simple>`;
|
||||
@ -130,19 +134,20 @@ function declareTests(config?: {useJit: boolean}) {
|
||||
expect(dir.text).toEqual('container');
|
||||
});
|
||||
|
||||
it('should contain all direct child directives in a <ng-container> (content dom)', () => {
|
||||
const template =
|
||||
'<needs-content-children #q><ng-container><div text="foo"></div></ng-container></needs-content-children>';
|
||||
TestBed.overrideComponent(MyComp, {set: {template}});
|
||||
const fixture = TestBed.createComponent(MyComp);
|
||||
fixmeIvy('unknown') &&
|
||||
it('should contain all direct child directives in a <ng-container> (content dom)', () => {
|
||||
const template =
|
||||
'<needs-content-children #q><ng-container><div text="foo"></div></ng-container></needs-content-children>';
|
||||
TestBed.overrideComponent(MyComp, {set: {template}});
|
||||
const fixture = TestBed.createComponent(MyComp);
|
||||
|
||||
fixture.detectChanges();
|
||||
const q = fixture.debugElement.children[0].references !['q'];
|
||||
fixture.detectChanges();
|
||||
fixture.detectChanges();
|
||||
const q = fixture.debugElement.children[0].references !['q'];
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(q.textDirChildren.length).toEqual(1);
|
||||
expect(q.numberOfChildrenAfterContentInit).toEqual(1);
|
||||
});
|
||||
expect(q.textDirChildren.length).toEqual(1);
|
||||
expect(q.numberOfChildrenAfterContentInit).toEqual(1);
|
||||
});
|
||||
|
||||
it('should contain all child directives in a <ng-container> (view dom)', () => {
|
||||
const template = '<needs-view-children #q></needs-view-children>';
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -14,7 +14,7 @@ import {expect} from '@angular/platform-browser/testing/src/matchers';
|
||||
import {fixmeIvy} from '@angular/private/testing';
|
||||
|
||||
{
|
||||
fixmeIvy('unknown') && describe('projection', () => {
|
||||
describe('projection', () => {
|
||||
beforeEach(() => TestBed.configureTestingModule({declarations: [MainComp, OtherComp, Simple]}));
|
||||
|
||||
it('should support simple components', () => {
|
||||
@ -82,7 +82,7 @@ import {fixmeIvy} from '@angular/private/testing';
|
||||
expect(main.nativeElement).toHaveText('');
|
||||
});
|
||||
|
||||
it('should support multiple content tags', () => {
|
||||
fixmeIvy('unknown') && it('should support multiple content tags', () => {
|
||||
TestBed.configureTestingModule({declarations: [MultipleContentTagsComponent]});
|
||||
TestBed.overrideComponent(MainComp, {
|
||||
set: {
|
||||
@ -113,33 +113,34 @@ import {fixmeIvy} from '@angular/private/testing';
|
||||
expect(main.nativeElement).toHaveText('(, BAC)');
|
||||
});
|
||||
|
||||
it('should redistribute direct child viewcontainers when the light dom changes', () => {
|
||||
TestBed.configureTestingModule(
|
||||
{declarations: [MultipleContentTagsComponent, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(MainComp, {
|
||||
set: {
|
||||
template: '<multiple-content-tags>' +
|
||||
'<ng-template manual class="left"><div>A1</div></ng-template>' +
|
||||
'<div>B</div>' +
|
||||
'</multiple-content-tags>'
|
||||
}
|
||||
});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
fixmeIvy('FW-665: Unable to find the given context data for the given target') &&
|
||||
it('should redistribute direct child viewcontainers when the light dom changes', () => {
|
||||
TestBed.configureTestingModule(
|
||||
{declarations: [MultipleContentTagsComponent, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(MainComp, {
|
||||
set: {
|
||||
template: '<multiple-content-tags>' +
|
||||
'<ng-template manual class="left"><div>A1</div></ng-template>' +
|
||||
'<div>B</div>' +
|
||||
'</multiple-content-tags>'
|
||||
}
|
||||
});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
|
||||
const viewportDirectives = main.debugElement.children[0]
|
||||
.childNodes.filter(By.directive(ManualViewportDirective))
|
||||
.map(de => de.injector.get(ManualViewportDirective));
|
||||
const viewportDirectives = main.debugElement.children[0]
|
||||
.childNodes.filter(By.directive(ManualViewportDirective))
|
||||
.map(de => de.injector.get(ManualViewportDirective));
|
||||
|
||||
expect(main.nativeElement).toHaveText('(, B)');
|
||||
expect(main.nativeElement).toHaveText('(, B)');
|
||||
|
||||
viewportDirectives.forEach(d => d.show());
|
||||
main.detectChanges();
|
||||
expect(main.nativeElement).toHaveText('(A1, B)');
|
||||
viewportDirectives.forEach(d => d.show());
|
||||
main.detectChanges();
|
||||
expect(main.nativeElement).toHaveText('(A1, B)');
|
||||
|
||||
viewportDirectives.forEach(d => d.hide());
|
||||
main.detectChanges();
|
||||
expect(main.nativeElement).toHaveText('(, B)');
|
||||
});
|
||||
viewportDirectives.forEach(d => d.hide());
|
||||
main.detectChanges();
|
||||
expect(main.nativeElement).toHaveText('(, B)');
|
||||
});
|
||||
|
||||
it('should support nested components', () => {
|
||||
TestBed.configureTestingModule({declarations: [OuterWithIndirectNestedComponent]});
|
||||
@ -156,33 +157,34 @@ import {fixmeIvy} from '@angular/private/testing';
|
||||
expect(main.nativeElement).toHaveText('OUTER(SIMPLE(AB))');
|
||||
});
|
||||
|
||||
it('should support nesting with content being direct child of a nested component', () => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations:
|
||||
[InnerComponent, InnerInnerComponent, OuterComponent, ManualViewportDirective]
|
||||
});
|
||||
TestBed.overrideComponent(MainComp, {
|
||||
set: {
|
||||
template: '<outer>' +
|
||||
'<ng-template manual class="left"><div>A</div></ng-template>' +
|
||||
'<div>B</div>' +
|
||||
'<div>C</div>' +
|
||||
'</outer>'
|
||||
}
|
||||
});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
fixmeIvy('FW-665: Unable to find the given context data for the given target') &&
|
||||
it('should support nesting with content being direct child of a nested component', () => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations:
|
||||
[InnerComponent, InnerInnerComponent, OuterComponent, ManualViewportDirective]
|
||||
});
|
||||
TestBed.overrideComponent(MainComp, {
|
||||
set: {
|
||||
template: '<outer>' +
|
||||
'<ng-template manual class="left"><div>A</div></ng-template>' +
|
||||
'<div>B</div>' +
|
||||
'<div>C</div>' +
|
||||
'</outer>'
|
||||
}
|
||||
});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
|
||||
const viewportDirective =
|
||||
main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[0].injector.get(
|
||||
ManualViewportDirective);
|
||||
const viewportDirective =
|
||||
main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[0]
|
||||
.injector.get(ManualViewportDirective);
|
||||
|
||||
expect(main.nativeElement).toHaveText('OUTER(INNER(INNERINNER(,BC)))');
|
||||
viewportDirective.show();
|
||||
expect(main.nativeElement).toHaveText('OUTER(INNER(INNERINNER(,BC)))');
|
||||
viewportDirective.show();
|
||||
|
||||
expect(main.nativeElement).toHaveText('OUTER(INNER(INNERINNER(A,BC)))');
|
||||
});
|
||||
expect(main.nativeElement).toHaveText('OUTER(INNER(INNERINNER(A,BC)))');
|
||||
});
|
||||
|
||||
it('should redistribute when the shadow dom changes', () => {
|
||||
fixmeIvy('unknown') && it('should redistribute when the shadow dom changes', () => {
|
||||
TestBed.configureTestingModule(
|
||||
{declarations: [ConditionalContentComponent, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(MainComp, {
|
||||
@ -237,37 +239,38 @@ import {fixmeIvy} from '@angular/private/testing';
|
||||
expect(main.nativeElement).toHaveText('P,text');
|
||||
});
|
||||
|
||||
it('should support moving non projected light dom around', () => {
|
||||
let sourceDirective: ManualViewportDirective = undefined !;
|
||||
fixmeIvy('FW-665: Unable to find the given context data for the given target') &&
|
||||
it('should support moving non projected light dom around', () => {
|
||||
let sourceDirective: ManualViewportDirective = undefined !;
|
||||
|
||||
@Directive({selector: '[manual]'})
|
||||
class ManualViewportDirective {
|
||||
constructor(public templateRef: TemplateRef<Object>) { sourceDirective = this; }
|
||||
}
|
||||
@Directive({selector: '[manual]'})
|
||||
class ManualViewportDirective {
|
||||
constructor(public templateRef: TemplateRef<Object>) { sourceDirective = this; }
|
||||
}
|
||||
|
||||
TestBed.configureTestingModule(
|
||||
{declarations: [Empty, ProjectDirective, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(MainComp, {
|
||||
set: {
|
||||
template: '<empty>' +
|
||||
' <ng-template manual><div>A</div></ng-template>' +
|
||||
'</empty>' +
|
||||
'START(<div project></div>)END'
|
||||
}
|
||||
});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
TestBed.configureTestingModule(
|
||||
{declarations: [Empty, ProjectDirective, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(MainComp, {
|
||||
set: {
|
||||
template: '<empty>' +
|
||||
' <ng-template manual><div>A</div></ng-template>' +
|
||||
'</empty>' +
|
||||
'START(<div project></div>)END'
|
||||
}
|
||||
});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
|
||||
const projectDirective: ProjectDirective =
|
||||
main.debugElement.queryAllNodes(By.directive(ProjectDirective))[0].injector.get(
|
||||
ProjectDirective);
|
||||
const projectDirective: ProjectDirective =
|
||||
main.debugElement.queryAllNodes(By.directive(ProjectDirective))[0].injector.get(
|
||||
ProjectDirective);
|
||||
|
||||
expect(main.nativeElement).toHaveText('START()END');
|
||||
expect(main.nativeElement).toHaveText('START()END');
|
||||
|
||||
projectDirective.show(sourceDirective.templateRef);
|
||||
expect(main.nativeElement).toHaveText('START(A)END');
|
||||
});
|
||||
projectDirective.show(sourceDirective.templateRef);
|
||||
expect(main.nativeElement).toHaveText('START(A)END');
|
||||
});
|
||||
|
||||
it('should support moving projected light dom around', () => {
|
||||
fixmeIvy('unknown') && it('should support moving projected light dom around', () => {
|
||||
TestBed.configureTestingModule(
|
||||
{declarations: [Empty, ProjectDirective, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(MainComp, {
|
||||
@ -290,83 +293,89 @@ import {fixmeIvy} from '@angular/private/testing';
|
||||
expect(main.nativeElement).toHaveText('SIMPLE()START(A)END');
|
||||
});
|
||||
|
||||
it('should support moving ng-content around', () => {
|
||||
TestBed.configureTestingModule(
|
||||
{declarations: [ConditionalContentComponent, ProjectDirective, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(MainComp, {
|
||||
set: {
|
||||
template: '<conditional-content>' +
|
||||
'<div class="left">A</div>' +
|
||||
'<div>B</div>' +
|
||||
'</conditional-content>' +
|
||||
'START(<div project></div>)END'
|
||||
}
|
||||
});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
fixmeIvy('FW-665: Unable to find the given context data for the given target') &&
|
||||
it('should support moving ng-content around', () => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations:
|
||||
[ConditionalContentComponent, ProjectDirective, ManualViewportDirective]
|
||||
});
|
||||
TestBed.overrideComponent(MainComp, {
|
||||
set: {
|
||||
template: '<conditional-content>' +
|
||||
'<div class="left">A</div>' +
|
||||
'<div>B</div>' +
|
||||
'</conditional-content>' +
|
||||
'START(<div project></div>)END'
|
||||
}
|
||||
});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
|
||||
const sourceDirective: ManualViewportDirective =
|
||||
main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[0].injector.get(
|
||||
ManualViewportDirective);
|
||||
const projectDirective: ProjectDirective =
|
||||
main.debugElement.queryAllNodes(By.directive(ProjectDirective))[0].injector.get(
|
||||
ProjectDirective);
|
||||
expect(main.nativeElement).toHaveText('(, B)START()END');
|
||||
const sourceDirective: ManualViewportDirective =
|
||||
main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[0]
|
||||
.injector.get(ManualViewportDirective);
|
||||
const projectDirective: ProjectDirective =
|
||||
main.debugElement.queryAllNodes(By.directive(ProjectDirective))[0].injector.get(
|
||||
ProjectDirective);
|
||||
expect(main.nativeElement).toHaveText('(, B)START()END');
|
||||
|
||||
projectDirective.show(sourceDirective.templateRef);
|
||||
expect(main.nativeElement).toHaveText('(, B)START(A)END');
|
||||
projectDirective.show(sourceDirective.templateRef);
|
||||
expect(main.nativeElement).toHaveText('(, B)START(A)END');
|
||||
|
||||
// Stamping ng-content multiple times should not produce the content multiple
|
||||
// times...
|
||||
projectDirective.show(sourceDirective.templateRef);
|
||||
expect(main.nativeElement).toHaveText('(, B)START(A)END');
|
||||
});
|
||||
// Stamping ng-content multiple times should not produce the content multiple
|
||||
// times...
|
||||
projectDirective.show(sourceDirective.templateRef);
|
||||
expect(main.nativeElement).toHaveText('(, B)START(A)END');
|
||||
});
|
||||
|
||||
// Note: This does not use a ng-content element, but
|
||||
// is still important as we are merging proto views independent of
|
||||
// the presence of ng-content elements!
|
||||
it('should still allow to implement a recursive trees', () => {
|
||||
TestBed.configureTestingModule({declarations: [Tree, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(MainComp, {set: {template: '<tree></tree>'}});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
fixmeIvy('FW-665: Unable to find the given context data for the given target') &&
|
||||
it('should still allow to implement a recursive trees', () => {
|
||||
TestBed.configureTestingModule({declarations: [Tree, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(MainComp, {set: {template: '<tree></tree>'}});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
|
||||
main.detectChanges();
|
||||
const manualDirective: ManualViewportDirective =
|
||||
main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[0].injector.get(
|
||||
ManualViewportDirective);
|
||||
expect(main.nativeElement).toHaveText('TREE(0:)');
|
||||
manualDirective.show();
|
||||
main.detectChanges();
|
||||
expect(main.nativeElement).toHaveText('TREE(0:TREE(1:))');
|
||||
});
|
||||
main.detectChanges();
|
||||
const manualDirective: ManualViewportDirective =
|
||||
main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[0]
|
||||
.injector.get(ManualViewportDirective);
|
||||
expect(main.nativeElement).toHaveText('TREE(0:)');
|
||||
manualDirective.show();
|
||||
main.detectChanges();
|
||||
expect(main.nativeElement).toHaveText('TREE(0:TREE(1:))');
|
||||
});
|
||||
|
||||
// Note: This does not use a ng-content element, but
|
||||
// is still important as we are merging proto views independent of
|
||||
// the presence of ng-content elements!
|
||||
it('should still allow to implement a recursive trees via multiple components', () => {
|
||||
TestBed.configureTestingModule({declarations: [Tree, Tree2, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(MainComp, {set: {template: '<tree></tree>'}});
|
||||
TestBed.overrideComponent(
|
||||
Tree, {set: {template: 'TREE({{depth}}:<tree2 *manual [depth]="depth+1"></tree2>)'}});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
fixmeIvy('FW-665: Unable to find the given context data for the given target') &&
|
||||
it('should still allow to implement a recursive trees via multiple components', () => {
|
||||
TestBed.configureTestingModule({declarations: [Tree, Tree2, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(MainComp, {set: {template: '<tree></tree>'}});
|
||||
TestBed.overrideComponent(
|
||||
Tree, {set: {template: 'TREE({{depth}}:<tree2 *manual [depth]="depth+1"></tree2>)'}});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
|
||||
main.detectChanges();
|
||||
main.detectChanges();
|
||||
|
||||
expect(main.nativeElement).toHaveText('TREE(0:)');
|
||||
expect(main.nativeElement).toHaveText('TREE(0:)');
|
||||
|
||||
const tree = main.debugElement.query(By.directive(Tree));
|
||||
let manualDirective: ManualViewportDirective = tree.queryAllNodes(By.directive(
|
||||
ManualViewportDirective))[0].injector.get(ManualViewportDirective);
|
||||
manualDirective.show();
|
||||
main.detectChanges();
|
||||
expect(main.nativeElement).toHaveText('TREE(0:TREE2(1:))');
|
||||
const tree = main.debugElement.query(By.directive(Tree));
|
||||
let manualDirective: ManualViewportDirective = tree.queryAllNodes(By.directive(
|
||||
ManualViewportDirective))[0].injector.get(ManualViewportDirective);
|
||||
manualDirective.show();
|
||||
main.detectChanges();
|
||||
expect(main.nativeElement).toHaveText('TREE(0:TREE2(1:))');
|
||||
|
||||
const tree2 = main.debugElement.query(By.directive(Tree2));
|
||||
manualDirective = tree2.queryAllNodes(By.directive(ManualViewportDirective))[0].injector.get(
|
||||
ManualViewportDirective);
|
||||
manualDirective.show();
|
||||
main.detectChanges();
|
||||
expect(main.nativeElement).toHaveText('TREE(0:TREE2(1:TREE(2:)))');
|
||||
});
|
||||
const tree2 = main.debugElement.query(By.directive(Tree2));
|
||||
manualDirective =
|
||||
tree2.queryAllNodes(By.directive(ManualViewportDirective))[0].injector.get(
|
||||
ManualViewportDirective);
|
||||
manualDirective.show();
|
||||
main.detectChanges();
|
||||
expect(main.nativeElement).toHaveText('TREE(0:TREE2(1:TREE(2:)))');
|
||||
});
|
||||
|
||||
if (getDOM().supportsNativeShadowDOM()) {
|
||||
it('should support native content projection and isolate styles per component', () => {
|
||||
@ -427,38 +436,41 @@ import {fixmeIvy} from '@angular/private/testing';
|
||||
});
|
||||
}
|
||||
|
||||
it('should support nested conditionals that contain ng-contents', () => {
|
||||
TestBed.configureTestingModule(
|
||||
{declarations: [ConditionalTextComponent, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(
|
||||
MainComp, {set: {template: `<conditional-text>a</conditional-text>`}});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
fixmeIvy('FW-665: Unable to find the given context data for the given target') &&
|
||||
it('should support nested conditionals that contain ng-contents', () => {
|
||||
TestBed.configureTestingModule(
|
||||
{declarations: [ConditionalTextComponent, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(
|
||||
MainComp, {set: {template: `<conditional-text>a</conditional-text>`}});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
|
||||
expect(main.nativeElement).toHaveText('MAIN()');
|
||||
expect(main.nativeElement).toHaveText('MAIN()');
|
||||
|
||||
let viewportElement =
|
||||
main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[0];
|
||||
viewportElement.injector.get(ManualViewportDirective).show();
|
||||
expect(main.nativeElement).toHaveText('MAIN(FIRST())');
|
||||
let viewportElement =
|
||||
main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[0];
|
||||
viewportElement.injector.get(ManualViewportDirective).show();
|
||||
expect(main.nativeElement).toHaveText('MAIN(FIRST())');
|
||||
|
||||
viewportElement = main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[1];
|
||||
viewportElement.injector.get(ManualViewportDirective).show();
|
||||
expect(main.nativeElement).toHaveText('MAIN(FIRST(SECOND(a)))');
|
||||
});
|
||||
viewportElement =
|
||||
main.debugElement.queryAllNodes(By.directive(ManualViewportDirective))[1];
|
||||
viewportElement.injector.get(ManualViewportDirective).show();
|
||||
expect(main.nativeElement).toHaveText('MAIN(FIRST(SECOND(a)))');
|
||||
});
|
||||
|
||||
it('should allow to switch the order of nested components via ng-content', () => {
|
||||
TestBed.configureTestingModule({declarations: [CmpA, CmpB, CmpD, CmpC]});
|
||||
TestBed.overrideComponent(MainComp, {set: {template: `<cmp-a><cmp-b></cmp-b></cmp-a>`}});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
fixmeIvy('unknown') &&
|
||||
it('should allow to switch the order of nested components via ng-content', () => {
|
||||
TestBed.configureTestingModule({declarations: [CmpA, CmpB, CmpD, CmpC]});
|
||||
TestBed.overrideComponent(MainComp, {set: {template: `<cmp-a><cmp-b></cmp-b></cmp-a>`}});
|
||||
const main = TestBed.createComponent(MainComp);
|
||||
|
||||
main.detectChanges();
|
||||
expect(getDOM().getInnerHTML(main.nativeElement))
|
||||
.toEqual(
|
||||
'<cmp-a><cmp-b><cmp-d><i>cmp-d</i></cmp-d></cmp-b>' +
|
||||
'<cmp-c><b>cmp-c</b></cmp-c></cmp-a>');
|
||||
});
|
||||
main.detectChanges();
|
||||
expect(getDOM().getInnerHTML(main.nativeElement))
|
||||
.toEqual(
|
||||
'<cmp-a><cmp-b><cmp-d><i>cmp-d</i></cmp-d></cmp-b>' +
|
||||
'<cmp-c><b>cmp-c</b></cmp-c></cmp-a>');
|
||||
});
|
||||
|
||||
it('should create nested components in the right order', () => {
|
||||
fixmeIvy('unknown') && it('should create nested components in the right order', () => {
|
||||
TestBed.configureTestingModule(
|
||||
{declarations: [CmpA1, CmpA2, CmpB11, CmpB12, CmpB21, CmpB22]});
|
||||
TestBed.overrideComponent(MainComp, {set: {template: `<cmp-a1></cmp-a1><cmp-a2></cmp-a2>`}});
|
||||
@ -471,7 +483,7 @@ import {fixmeIvy} from '@angular/private/testing';
|
||||
'<cmp-a2>a2<cmp-b21>b21</cmp-b21><cmp-b22>b22</cmp-b22></cmp-a2>');
|
||||
});
|
||||
|
||||
it('should project filled view containers into a view container', () => {
|
||||
fixmeIvy('unknown') && it('should project filled view containers into a view container', () => {
|
||||
TestBed.configureTestingModule(
|
||||
{declarations: [ConditionalContentComponent, ManualViewportDirective]});
|
||||
TestBed.overrideComponent(MainComp, {
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -7,7 +7,7 @@
|
||||
*/
|
||||
|
||||
import {ANALYZE_FOR_ENTRY_COMPONENTS, ApplicationRef, Component, ComponentRef, ContentChild, Directive, ErrorHandler, EventEmitter, HostListener, InjectionToken, Injector, Input, NgModule, NgModuleRef, NgZone, Output, Pipe, PipeTransform, Provider, QueryList, Renderer2, SimpleChanges, TemplateRef, ViewChildren, ViewContainerRef, destroyPlatform, ɵivyEnabled as ivyEnabled} from '@angular/core';
|
||||
import {TestBed, async, fakeAsync, inject, tick} from '@angular/core/testing';
|
||||
import {TestBed, fakeAsync, inject, tick} from '@angular/core/testing';
|
||||
import {BrowserModule, By, DOCUMENT} from '@angular/platform-browser';
|
||||
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
|
||||
import {getDOM} from '@angular/platform-browser/src/dom/dom_adapter';
|
||||
@ -16,11 +16,10 @@ import {fixmeIvy} from '@angular/private/testing';
|
||||
|
||||
{
|
||||
if (ivyEnabled) {
|
||||
fixmeIvy('unknown') && describe('ivy', () => { declareTests(); });
|
||||
describe('ivy', () => { declareTests(); });
|
||||
} else {
|
||||
fixmeIvy('unknown') && describe('jit', () => { declareTests({useJit: true}); });
|
||||
|
||||
fixmeIvy('unknown') && describe('no jit', () => { declareTests({useJit: false}); });
|
||||
describe('jit', () => { declareTests({useJit: true}); });
|
||||
describe('no jit', () => { declareTests({useJit: false}); });
|
||||
}
|
||||
|
||||
declareTestsUsingBootstrap();
|
||||
@ -35,7 +34,7 @@ function declareTests(config?: {useJit: boolean}) {
|
||||
describe('platform pipes', () => {
|
||||
beforeEach(() => { TestBed.configureCompiler({...config}); });
|
||||
|
||||
it('should overwrite them by custom pipes', () => {
|
||||
fixmeIvy('unknown') && it('should overwrite them by custom pipes', () => {
|
||||
TestBed.configureTestingModule({declarations: [CustomPipe]});
|
||||
const template = '{{true | somePipe}}';
|
||||
TestBed.overrideComponent(MyComp1, {set: {template}});
|
||||
@ -77,43 +76,46 @@ function declareTests(config?: {useJit: boolean}) {
|
||||
expect(CountingPipe.calls).toBe(1);
|
||||
});
|
||||
|
||||
it('should only update the bound property when using asyncPipe - #15205', fakeAsync(() => {
|
||||
@Component({template: '<div myDir [a]="p | async" [b]="2"></div>'})
|
||||
class MyComp {
|
||||
p = Promise.resolve(1);
|
||||
}
|
||||
fixmeIvy('unknown') &&
|
||||
it('should only update the bound property when using asyncPipe - #15205',
|
||||
fakeAsync(() => {
|
||||
@Component({template: '<div myDir [a]="p | async" [b]="2"></div>'})
|
||||
class MyComp {
|
||||
p = Promise.resolve(1);
|
||||
}
|
||||
|
||||
@Directive({selector: '[myDir]'})
|
||||
class MyDir {
|
||||
setterCalls: {[key: string]: any} = {};
|
||||
// TODO(issue/24571): remove '!'.
|
||||
changes !: SimpleChanges;
|
||||
@Directive({selector: '[myDir]'})
|
||||
class MyDir {
|
||||
setterCalls: {[key: string]: any} = {};
|
||||
// TODO(issue/24571): remove '!'.
|
||||
changes !: SimpleChanges;
|
||||
|
||||
@Input()
|
||||
set a(v: number) { this.setterCalls['a'] = v; }
|
||||
@Input()
|
||||
set b(v: number) { this.setterCalls['b'] = v; }
|
||||
@Input()
|
||||
set a(v: number) { this.setterCalls['a'] = v; }
|
||||
@Input()
|
||||
set b(v: number) { this.setterCalls['b'] = v; }
|
||||
|
||||
ngOnChanges(changes: SimpleChanges) { this.changes = changes; }
|
||||
}
|
||||
ngOnChanges(changes: SimpleChanges) { this.changes = changes; }
|
||||
}
|
||||
|
||||
TestBed.configureTestingModule({declarations: [MyDir, MyComp]});
|
||||
const fixture = TestBed.createComponent(MyComp);
|
||||
const dir = fixture.debugElement.query(By.directive(MyDir)).injector.get(MyDir) as MyDir;
|
||||
TestBed.configureTestingModule({declarations: [MyDir, MyComp]});
|
||||
const fixture = TestBed.createComponent(MyComp);
|
||||
const dir =
|
||||
fixture.debugElement.query(By.directive(MyDir)).injector.get(MyDir) as MyDir;
|
||||
|
||||
fixture.detectChanges();
|
||||
expect(dir.setterCalls).toEqual({'a': null, 'b': 2});
|
||||
expect(Object.keys(dir.changes)).toEqual(['a', 'b']);
|
||||
fixture.detectChanges();
|
||||
expect(dir.setterCalls).toEqual({'a': null, 'b': 2});
|
||||
expect(Object.keys(dir.changes)).toEqual(['a', 'b']);
|
||||
|
||||
dir.setterCalls = {};
|
||||
dir.changes = {};
|
||||
dir.setterCalls = {};
|
||||
dir.changes = {};
|
||||
|
||||
tick();
|
||||
fixture.detectChanges();
|
||||
tick();
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(dir.setterCalls).toEqual({'a': 1});
|
||||
expect(Object.keys(dir.changes)).toEqual(['a']);
|
||||
}));
|
||||
expect(dir.setterCalls).toEqual({'a': 1});
|
||||
expect(Object.keys(dir.changes)).toEqual(['a']);
|
||||
}));
|
||||
|
||||
it('should only evaluate methods once - #10639', () => {
|
||||
TestBed.configureTestingModule({declarations: [MyCountingComp]});
|
||||
@ -160,13 +162,14 @@ function declareTests(config?: {useJit: boolean}) {
|
||||
expect(injector.get(token)).toEqual(tokenValue);
|
||||
});
|
||||
|
||||
it('should support providers with string token with a `.` in it', () => {
|
||||
const token = 'a.b';
|
||||
const tokenValue = 1;
|
||||
const injector = createInjector([{provide: token, useValue: tokenValue}]);
|
||||
fixmeIvy('FW-646: Directive providers don\'t support primitive types as DI tokens') &&
|
||||
it('should support providers with string token with a `.` in it', () => {
|
||||
const token = 'a.b';
|
||||
const tokenValue = 1;
|
||||
const injector = createInjector([{provide: token, useValue: tokenValue}]);
|
||||
|
||||
expect(injector.get(token)).toEqual(tokenValue);
|
||||
});
|
||||
expect(injector.get(token)).toEqual(tokenValue);
|
||||
});
|
||||
|
||||
it('should support providers with an anonymous function as token', () => {
|
||||
const token = () => true;
|
||||
@ -188,14 +191,15 @@ function declareTests(config?: {useJit: boolean}) {
|
||||
expect(injector.get(token2)).toEqual(tokenValue2);
|
||||
});
|
||||
|
||||
it('should support providers that have a `name` property with a number value', () => {
|
||||
class TestClass {
|
||||
constructor(public name: number) {}
|
||||
}
|
||||
const data = [new TestClass(1), new TestClass(2)];
|
||||
const injector = createInjector([{provide: 'someToken', useValue: data}]);
|
||||
expect(injector.get('someToken')).toEqual(data);
|
||||
});
|
||||
fixmeIvy('FW-646: Directive providers don\'t support primitive types as DI tokens') &&
|
||||
it('should support providers that have a `name` property with a number value', () => {
|
||||
class TestClass {
|
||||
constructor(public name: number) {}
|
||||
}
|
||||
const data = [new TestClass(1), new TestClass(2)];
|
||||
const injector = createInjector([{provide: 'someToken', useValue: data}]);
|
||||
expect(injector.get('someToken')).toEqual(data);
|
||||
});
|
||||
|
||||
describe('ANALYZE_FOR_ENTRY_COMPONENTS providers', () => {
|
||||
|
||||
@ -333,7 +337,7 @@ function declareTests(config?: {useJit: boolean}) {
|
||||
expect(fixture.debugElement.childNodes.length).toBe(0);
|
||||
});
|
||||
|
||||
it('should allow empty embedded templates', () => {
|
||||
fixmeIvy('unknown') && it('should allow empty embedded templates', () => {
|
||||
@Component({template: '<ng-template [ngIf]="true"></ng-template>'})
|
||||
class MyComp {
|
||||
}
|
||||
@ -350,35 +354,37 @@ function declareTests(config?: {useJit: boolean}) {
|
||||
});
|
||||
});
|
||||
|
||||
it('should support @ContentChild and @Input on the same property for static queries', () => {
|
||||
@Directive({selector: 'test'})
|
||||
class Test {
|
||||
// TODO(issue/24571): remove '!'.
|
||||
@Input() @ContentChild(TemplateRef) tpl !: TemplateRef<any>;
|
||||
}
|
||||
fixmeIvy('unknown') &&
|
||||
it('should support @ContentChild and @Input on the same property for static queries',
|
||||
() => {
|
||||
@Directive({selector: 'test'})
|
||||
class Test {
|
||||
// TODO(issue/24571): remove '!'.
|
||||
@Input() @ContentChild(TemplateRef) tpl !: TemplateRef<any>;
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
@Component({
|
||||
selector: 'my-app',
|
||||
template: `
|
||||
<test></test><br>
|
||||
<test><ng-template>Custom as a child</ng-template></test><br>
|
||||
<ng-template #custom>Custom as a binding</ng-template>
|
||||
<test [tpl]="custom"></test><br>
|
||||
`
|
||||
})
|
||||
class App {
|
||||
}
|
||||
})
|
||||
class App {
|
||||
}
|
||||
|
||||
const fixture =
|
||||
TestBed.configureTestingModule({declarations: [App, Test]}).createComponent(App);
|
||||
fixture.detectChanges();
|
||||
const fixture =
|
||||
TestBed.configureTestingModule({declarations: [App, Test]}).createComponent(App);
|
||||
fixture.detectChanges();
|
||||
|
||||
const testDirs =
|
||||
fixture.debugElement.queryAll(By.directive(Test)).map(el => el.injector.get(Test));
|
||||
expect(testDirs[0].tpl).toBeUndefined();
|
||||
expect(testDirs[1].tpl).toBeDefined();
|
||||
expect(testDirs[2].tpl).toBeDefined();
|
||||
});
|
||||
const testDirs =
|
||||
fixture.debugElement.queryAll(By.directive(Test)).map(el => el.injector.get(Test));
|
||||
expect(testDirs[0].tpl).toBeUndefined();
|
||||
expect(testDirs[1].tpl).toBeDefined();
|
||||
expect(testDirs[2].tpl).toBeDefined();
|
||||
});
|
||||
|
||||
it('should not add ng-version for dynamically created components', () => {
|
||||
@Component({template: ''})
|
||||
|
||||
@ -16,9 +16,8 @@ import {fixmeIvy} from '@angular/private/testing';
|
||||
if (ivyEnabled) {
|
||||
fixmeIvy('unknown') && describe('ivy', () => { declareTests(); });
|
||||
} else {
|
||||
fixmeIvy('unknown') && describe('jit', () => { declareTests({useJit: true}); });
|
||||
|
||||
fixmeIvy('unknown') && describe('no jit', () => { declareTests({useJit: false}); });
|
||||
describe('jit', () => { declareTests({useJit: true}); });
|
||||
describe('no jit', () => { declareTests({useJit: false}); });
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user