测试 Angular 2 Material 对话框组件时出错

Question

当我运行测试时出现 "Can't resolve all parameters for MdDialogRef: (?, ?)" 错误。请帮忙。

请参考以下代码以供进一步参考。

MyComponent.spec.ts

import { async, ComponentFixture, ComponentFixtureAutoDetect, TestBed } from '@angular/core/testing';
import { MyComponent } from './my.component';
import { MdDialogModule, MdDialog, MdDialogConfig, MdDialogRef } from '@angular/material';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

describe('Component: My Component', () => {

  let component: MyComponent;
  let fixture: ComponentFixture<MyComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [MyComponent],
      imports: [BrowserAnimationsModule, MdDialogModule.forRoot()],
      providers: [MdDialogRef],
    })
      .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(MyComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should, have defined component', () => {
    expect(component).toBeDefined();
  });
});

MyComponent.ts

import { Component } from '@angular/core';
import { MdDialog, MdDialogRef } from '@angular/material';
@Component({
    templateUrl: './mys.component.html'
})

export class MyComponent {
    constructor(public dialogRef: MdDialogRef<any>) { }
}

Answer 1

在 Angular [https://github.com/angular/angular/issues/10760]

中打开问题

根据评论解决：

"依赖ComponentFactoryResolver的测试需要正确填充通过 configureTestModule 声明 "entryComponents" （或导入一个模块这样做）。这样你就可以测试你的模块是否正确/测试如何用户会使用你的模块。"

演示插件： https://plnkr.co/edit/Tv5fbtPtsiNhFIJ5QhRf?p=preview

创建的组件：

import { Component } from '@angular/core';
import { MdDialogRef } from '@angular/material';

@Component({
  selector: 'dialog-component',
  template: `Can't resolve all parameters for MdDialogRef: (?)`
})
export class TestComponent {
  constructor(private dialogRef: MdDialogRef<any>) { }
}

已添加到模块中

@NgModule({
    declarations: [TestComponent],
    entryComponents: [TestComponent],
    exports: [TestComponent],
})
class TestModule { }

使用的测试模块

describe('Component: Login', () => {
    let component: TestComponent;
    let dialog: MdDialog;

    beforeEach(() => {
      TestBed.configureTestingModule({
        imports: [
          TestModule, 
          MdDialogModule.forRoot()
        ]
      });
    });

    beforeEach(() => {
      dialog = TestBed.get(MdDialog);
      let dialogRef = dialog.open(TestComponent);

      component = dialogRef.componentInstance;
    });

    it('should create', () => {
      expect(component).toBeTruthy();
    });
});

测试 Angular 2 Material 对话框组件时出错

Getting error while testing Angular 2 Material Dialog Component

karma-jasmine

angular-material2

angular