Угловой модуль-проверка NullInjectorError: R3InjectorError(динамический модуль)[MatSnackBarComponent -> MatSnackBarComponent]:

#angular #unit-testing #jasmine

Вопрос:

В моем основном компоненте у меня есть компонент ввода MatSnackBarComponent(пользовательский компонент). Когда я пишу тесты, я получаю эту ошибку:

NullInjectorError: R3InjectorError(DynamicTestModule)[MatSnackBarComponent -> MatSnackBarComponent]: NullInjectorError: Нет поставщика для MatSnackBarComponent!

 describe('MainComponent', () => {
  let component: MainComponent;
  let fixture: ComponentFixture<MainComponent>;
  let orderService: OrderService;

  const fakeMatDialogRef = jasmine.createSpyObj(['close']);

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [
        FormsModule,
        ReactiveFormsModule,
        HttpClientTestingModule,
        TranslateModule.forRoot()
      ],
      declarations: [MainComponent],
      providers: [
        OrderService,
        { provide: MatDialogRef, useValue: fakeMatDialogRef }, 
        { provide: MAT_DIALOG_DATA, useValue: {} }
      ],
      schemas: [CUSTOM_ELEMENTS_SCHEMA]
    }).compileComponents();
  }));

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

Что мне следует сделать, чтобы устранить эту проблему?

Ответ №1:

Вам необходимо добавить модуль MatSnackBarModule в свой импорт.

 imports: [
        FormsModule,
        ReactiveFormsModule,
        HttpClientTestingModule,
        MatSnackBarModule, //<---Added MatSnackBarModule
        TranslateModule.forRoot()
],
 

Комментарии:

1. Эта проблема все еще возникает после того, как вы добавили модуль MatSnackBarModule в свой импорт?

2. Компонент MatSnackBarКомпонент не добавляется в мой тест, но я пробовал разные способы… Может быть, мне нужно как-то посмеяться над этим

3. Итак, вы используете компонент MatSnackBarComponent в своем основном компоненте? Вы добавили модуль MatSnackBarModule в свой основной модуль, а не в app.module.ts?

4. Я нигде не добавлял MatSnackBarModule. Только MatSnackBar в компоненте MatSnackBarКомпонент

Ответ №2:

Решенный. Необходимо добавить код ниже для поставщиков

 { provide: MatSnackBarComponent, useValue: {} }
 

Комментарии:

1. Да, или создайте a MatSnackBarMockComponent в своем специальном файле с помощью a useClass . Добавьте @Input буквы s и @Output s, которые вы использовали в устройстве.