我创建了一个MatDialog组件,我在另一个组件中使用它。 它工作正常,但我无法在我使用对话框传递的组件上进行测试 测试失败:错误:找不到具有id"对话框"。
的列我调用对话框的组件:
import { ConfirmDialogComponent } from '../../shared/modals/confirm-dialog/confirm-dialog.component';
constructor(private userService: UserService, private dialog: MatDialog) { }
openDialog(user: User): void {
const dialogRef = this.dialog.open(ConfirmDialogComponent, {
width: '250px',
data: { tille: 'Confirm box', msg: 'Are you sure you want to delete this user?' }
});
dialogRef.afterClosed().subscribe(result => {
if (result === 'OK') {
this.dataSource.deleteUsers(user, this.paginator.pageIndex, this.paginator.pageSize, this.sort.active, this.sort.direction, this.input.nativeElement.value);
}
});
}
测试
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import {SharedModule} from '../../shared/shared.module';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { DebugElement } from '@angular/core';
import { ListUserComponent } from './list-user.component';
import { UserService } from '../user.service';
import { RouterTestingModule } from '@angular/router/testing';
import { GraphqlModuleModule } from '../../graphql-module/graphql-module.module';
import { MatDialog } from '@angular/material';
describe('ListUserComponent', () => {
let component: ListUserComponent;
let fixture: ComponentFixture<ListUserComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [BrowserAnimationsModule, SharedModule, RouterTestingModule, GraphqlModuleModule],
declarations: [ListUserComponent],
providers: [UserService, { provide: MatDialog, useValue: {} }]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ListUserComponent);
component = fixture.componentInstance;
fixture.detectChanges();
// UserService actually injected into the component
// const userService = fixture.debugElement.injector.get(UserService);
// Setup spy on the `getQuote` method
// spyOn(userService, 'getUsers').and.returnValue(Promise.resolve(getUsers));
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
ConfirmDialogComponent是SharedModule的exports,declarations和entryComponents列表
哪些版本的Angular,Material,OS,TypeScript,浏览器都会受到影响?Angular:5.2.1 材料:5.1.0 Windows 10,