test(ivy): update root causes for @angular/core TestBed failures (#27321)

PR Close #27321
This commit is contained in:
Pawel Kozlowski 2018-11-28 12:18:44 +01:00 committed by Jason Aden
parent 0340ba47df
commit 7076773360
2 changed files with 162 additions and 171 deletions

View File

@ -28,16 +28,13 @@ import {stringify} from '../../src/util';
const ANCHOR_ELEMENT = new InjectionToken('AnchorElement');
{
if (ivyEnabled) {
describe('ivy', () => { declareTests(); });
} else {
describe('jit', () => { declareTests({useJit: true}); });
describe('no jit', () => { declareTests({useJit: false}); });
}
if (ivyEnabled) {
describe('ivy', () => { declareTests(); });
} else {
describe('jit', () => { declareTests({useJit: true}); });
describe('no jit', () => { declareTests({useJit: false}); });
}
function declareTests(config?: {useJit: boolean}) {
describe('integration tests', function() {
@ -227,19 +224,18 @@ function declareTests(config?: {useJit: boolean}) {
expect(nativeEl).not.toHaveCssClass('initial');
});
fixmeIvy('FW-587: Inputs with aliases in component decorators don\'t work') &&
it('should consume binding to htmlFor using for alias', () => {
const template = '<label [for]="ctxProp"></label>';
const fixture = TestBed.configureTestingModule({declarations: [MyComp]})
.overrideComponent(MyComp, {set: {template}})
.createComponent(MyComp);
it('should consume binding to htmlFor using for alias', () => {
const template = '<label [for]="ctxProp"></label>';
const fixture = TestBed.configureTestingModule({declarations: [MyComp]})
.overrideComponent(MyComp, {set: {template}})
.createComponent(MyComp);
const nativeEl = fixture.debugElement.children[0].nativeElement;
fixture.debugElement.componentInstance.ctxProp = 'foo';
fixture.detectChanges();
const nativeEl = fixture.debugElement.children[0].nativeElement;
fixture.debugElement.componentInstance.ctxProp = 'foo';
fixture.detectChanges();
expect(getDOM().getProperty(nativeEl, 'htmlFor')).toBe('foo');
});
expect(getDOM().getProperty(nativeEl, 'htmlFor')).toBe('foo');
});
fixmeIvy('FW-587: Inputs with aliases in component decorators don\'t work') &&
it('should consume directive watch expression change.', () => {
@ -856,48 +852,52 @@ function declareTests(config?: {useJit: boolean}) {
dir.triggerChange('two');
}));
fixmeIvy('unknown') && it('should support render events', () => {
TestBed.configureTestingModule({declarations: [MyComp, DirectiveListeningDomEvent]});
const template = '<div listener></div>';
TestBed.overrideComponent(MyComp, {set: {template}});
const fixture = TestBed.createComponent(MyComp);
fixmeIvy(
'FW-743: Registering events on global objects (document, window, body) is not supported') &&
it('should support render events', () => {
TestBed.configureTestingModule({declarations: [MyComp, DirectiveListeningDomEvent]});
const template = '<div listener></div>';
TestBed.overrideComponent(MyComp, {set: {template}});
const fixture = TestBed.createComponent(MyComp);
const tc = fixture.debugElement.children[0];
const listener = tc.injector.get(DirectiveListeningDomEvent);
const tc = fixture.debugElement.children[0];
const listener = tc.injector.get(DirectiveListeningDomEvent);
dispatchEvent(tc.nativeElement, 'domEvent');
dispatchEvent(tc.nativeElement, 'domEvent');
expect(listener.eventTypes).toEqual([
'domEvent', 'body_domEvent', 'document_domEvent', 'window_domEvent'
]);
expect(listener.eventTypes).toEqual([
'domEvent', 'body_domEvent', 'document_domEvent', 'window_domEvent'
]);
fixture.destroy();
listener.eventTypes = [];
dispatchEvent(tc.nativeElement, 'domEvent');
expect(listener.eventTypes).toEqual([]);
});
fixture.destroy();
listener.eventTypes = [];
dispatchEvent(tc.nativeElement, 'domEvent');
expect(listener.eventTypes).toEqual([]);
});
fixmeIvy('unknown') && it('should support render global events', () => {
TestBed.configureTestingModule({declarations: [MyComp, DirectiveListeningDomEvent]});
const template = '<div listener></div>';
TestBed.overrideComponent(MyComp, {set: {template}});
const fixture = TestBed.createComponent(MyComp);
const doc = TestBed.get(DOCUMENT);
fixmeIvy(
'FW-743: Registering events on global objects (document, window, body) is not supported') &&
it('should support render global events', () => {
TestBed.configureTestingModule({declarations: [MyComp, DirectiveListeningDomEvent]});
const template = '<div listener></div>';
TestBed.overrideComponent(MyComp, {set: {template}});
const fixture = TestBed.createComponent(MyComp);
const doc = TestBed.get(DOCUMENT);
const tc = fixture.debugElement.children[0];
const listener = tc.injector.get(DirectiveListeningDomEvent);
dispatchEvent(getDOM().getGlobalEventTarget(doc, 'window'), 'domEvent');
expect(listener.eventTypes).toEqual(['window_domEvent']);
const tc = fixture.debugElement.children[0];
const listener = tc.injector.get(DirectiveListeningDomEvent);
dispatchEvent(getDOM().getGlobalEventTarget(doc, 'window'), 'domEvent');
expect(listener.eventTypes).toEqual(['window_domEvent']);
listener.eventTypes = [];
dispatchEvent(getDOM().getGlobalEventTarget(doc, 'document'), 'domEvent');
expect(listener.eventTypes).toEqual(['document_domEvent', 'window_domEvent']);
listener.eventTypes = [];
dispatchEvent(getDOM().getGlobalEventTarget(doc, 'document'), 'domEvent');
expect(listener.eventTypes).toEqual(['document_domEvent', 'window_domEvent']);
fixture.destroy();
listener.eventTypes = [];
dispatchEvent(getDOM().getGlobalEventTarget(doc, 'body'), 'domEvent');
expect(listener.eventTypes).toEqual([]);
});
fixture.destroy();
listener.eventTypes = [];
dispatchEvent(getDOM().getGlobalEventTarget(doc, 'body'), 'domEvent');
expect(listener.eventTypes).toEqual([]);
});
it('should support updating host element via hostAttributes on root elements', () => {
@Component({host: {'role': 'button'}, template: ''})
@ -1034,7 +1034,8 @@ function declareTests(config?: {useJit: boolean}) {
});
}
fixmeIvy('unknown') &&
fixmeIvy(
'FW-743: Registering events on global objects (document, window, body) is not supported') &&
it('should support render global events from multiple directives', () => {
TestBed.configureTestingModule({
declarations: [MyComp, DirectiveListeningDomEvent, DirectiveListeningDomEventOther]
@ -1457,37 +1458,35 @@ function declareTests(config?: {useJit: boolean}) {
`Directive ${stringify(SomeDirective)} has no selector, please add it!`);
});
fixmeIvy('FW-662: Components without selector are not supported') &&
it('should use a default element name for components without selectors', () => {
let noSelectorComponentFactory: ComponentFactory<SomeComponent> = undefined !;
it('should use a default element name for components without selectors', () => {
let noSelectorComponentFactory: ComponentFactory<SomeComponent> = undefined !;
@Component({template: '----'})
class NoSelectorComponent {
}
@Component({template: '----'})
class NoSelectorComponent {
}
@Component(
{selector: 'some-comp', template: '', entryComponents: [NoSelectorComponent]})
class SomeComponent {
constructor(componentFactoryResolver: ComponentFactoryResolver) {
// grab its own component factory
noSelectorComponentFactory =
componentFactoryResolver.resolveComponentFactory(NoSelectorComponent) !;
}
}
@Component({selector: 'some-comp', template: '', entryComponents: [NoSelectorComponent]})
class SomeComponent {
constructor(componentFactoryResolver: ComponentFactoryResolver) {
// grab its own component factory
noSelectorComponentFactory =
componentFactoryResolver.resolveComponentFactory(NoSelectorComponent) !;
}
}
TestBed.configureTestingModule({declarations: [SomeComponent, NoSelectorComponent]});
TestBed.configureTestingModule({declarations: [SomeComponent, NoSelectorComponent]});
// get the factory
TestBed.createComponent(SomeComponent);
// get the factory
TestBed.createComponent(SomeComponent);
expect(noSelectorComponentFactory.selector).toBe('ng-component');
expect(noSelectorComponentFactory.selector).toBe('ng-component');
expect(getDOM()
.nodeName(
noSelectorComponentFactory.create(Injector.NULL).location.nativeElement)
.toLowerCase())
.toEqual('ng-component');
});
expect(
getDOM()
.nodeName(noSelectorComponentFactory.create(Injector.NULL).location.nativeElement)
.toLowerCase())
.toEqual('ng-component');
});
});
describe('error handling', () => {
@ -1699,15 +1698,13 @@ function declareTests(config?: {useJit: boolean}) {
.toContain('ng-reflect-dir-prop="hello"');
});
fixmeIvy('FW-664: ng-reflect-* is not supported') &&
it(`should work with prop names containing '$'`, () => {
TestBed.configureTestingModule({declarations: [ParentCmp, SomeCmpWithInput]});
const fixture = TestBed.createComponent(ParentCmp);
fixture.detectChanges();
it(`should work with prop names containing '$'`, () => {
TestBed.configureTestingModule({declarations: [ParentCmp, SomeCmpWithInput]});
const fixture = TestBed.createComponent(ParentCmp);
fixture.detectChanges();
expect(getDOM().getInnerHTML(fixture.nativeElement))
.toContain('ng-reflect-test_="hello"');
});
expect(getDOM().getInnerHTML(fixture.nativeElement)).toContain('ng-reflect-test_="hello"');
});
fixmeIvy('FW-664: ng-reflect-* is not supported') &&
it('should reflect property values on template comments', () => {
@ -1725,16 +1722,15 @@ function declareTests(config?: {useJit: boolean}) {
.toContain('"ng\-reflect\-ng\-if"\: "true"');
});
fixmeIvy('FW-664: ng-reflect-* is not supported') &&
it('should indicate when toString() throws', () => {
TestBed.configureTestingModule({declarations: [MyComp, MyDir]});
const template = '<div my-dir [elprop]="toStringThrow"></div>';
TestBed.overrideComponent(MyComp, {set: {template}});
const fixture = TestBed.createComponent(MyComp);
fixmeIvy('unknown') && it('should indicate when toString() throws', () => {
TestBed.configureTestingModule({declarations: [MyComp, MyDir]});
const template = '<div my-dir [elprop]="toStringThrow"></div>';
TestBed.overrideComponent(MyComp, {set: {template}});
const fixture = TestBed.createComponent(MyComp);
fixture.detectChanges();
expect(getDOM().getInnerHTML(fixture.nativeElement)).toContain('[ERROR]');
});
fixture.detectChanges();
expect(getDOM().getInnerHTML(fixture.nativeElement)).toContain('[ERROR]');
});
});
describe('property decorators', () => {

View File

@ -239,38 +239,37 @@ import {fixmeIvy} from '@angular/private/testing';
expect(main.nativeElement).toHaveText('P,text');
});
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 !;
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');
});
fixmeIvy('unknown') && it('should support moving projected light dom around', () => {
it('should support moving projected light dom around', () => {
TestBed.configureTestingModule(
{declarations: [Empty, ProjectDirective, ManualViewportDirective]});
TestBed.overrideComponent(MainComp, {
@ -330,52 +329,49 @@ import {fixmeIvy} from '@angular/private/testing';
// 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!
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);
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!
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);
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', () => {
@ -457,20 +453,19 @@ import {fixmeIvy} from '@angular/private/testing';
expect(main.nativeElement).toHaveText('MAIN(FIRST(SECOND(a)))');
});
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);
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>');
});
fixmeIvy('unknown') && it('should create nested components in the right order', () => {
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>`}});