Ошибка тестирования в Карме: Невозможно связать с 'cdkObserveContentDisabled', так как это не известное свойство 'label'

Question

Настройка базового тестирования с родительским компонентом с использованием дочернего компонента FORM.Появляется следующая ошибка:

Failed: Ошибки синтаксического анализа шаблона: невозможно связать с 'cdkObserveContentDisabled', поскольку оно не является известным свойством 'label'.("m-field-label-wrapper">] [cdkObserveContentDisabled] = "внешность! = 'контур'" [id] = "_ labelId" [attr.for] = "_ control.id" [attr. "): ng:///DynamicTestModule/MatFormField.html@0:930 Ошибка: ошибки синтаксического анализа шаблона: невозможно связать с 'cdkObserveContentDisabled', так как это не известное свойство 'label'

component.spec.ts is

import { CreatepageComponent } from './createpage.component';
import { NavbarComponent } from '../common/navbar/navbar.component';
import { TitleComponent } from '../common/title/title.component';
import { MobileTitleComponent } from '../common/mobile-title/mobile-title.component';
import { FormComponent } from '../common/form/form.component';
import { FooterComponent } from '../common/footer/footer.component';
import { MapComponent } from '../common/map/map.component';
import { SvgComponent } from '../common/svg/svg.component';
import { SvgDefinitionsComponent } from '../common/svg/svg-definitions/svg-definitions.component';
import { LinkComponent } from '../common/link/link.component';
import { DropdownMenuComponent } from '../common/dropdown-menu/dropdown-menu.component';
import { RouterTestingModule } from '@angular/router/testing';
import { RouterModule } from '@angular/router';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { ValidationErrorsComponent } from '../common/form/validation-errors/validation-errors.component';
import {
  MatError,
  MatFormFieldModule,
  MatInputModule,
  MatFormField,
  MatLabel,
} from '@angular/material';
import { ButtonComponent } from '../common/button/button.component';
describe('CreatepageComponent', () => {
  let component: CreatepageComponent;
  let fixture: ComponentFixture<CreatepageComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [
        CreatepageComponent,
        NavbarComponent,
        TitleComponent,
        MobileTitleComponent,
        FormComponent,
        FooterComponent,
        SvgComponent,
        SvgDefinitionsComponent,
        LinkComponent,
        DropdownMenuComponent,
        ValidationErrorsComponent,
        MatError,
        MatFormField,
        ButtonComponent,
        MapComponent
      ],
      providers: [
        RouterModule,
        ReactiveFormsModule,
        FormsModule,
        MatFormFieldModule,
        MatInputModule,
        MatLabel
      ],
      imports: [FormsModule, ReactiveFormsModule, RouterTestingModule]
    }).compileComponents();
  }));

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

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

Ожидаемое: Карма проходит все тесты. Фактически: Карма отвечает ошибками в любом компоненте формы, как ребенок.

Answer 1

Просто столкнулся с этим сам. Похоже, вам нужно импортировать ObserversModule из «@ angular / cdk / наблюдатели» в ваш файл spec.ts и включить его в раздел «импорт» в функции configureTestingModule.

import {ObserversModule} from '@angular/cdk/observers'; <== HERE

---------------------------

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [],
      imports: [ObserversModule] <== HERE
    },)
    .compileComponents();
  }));

Видно здесь:

https://material.angular.io/cdk/observers/api