Блог

Проблема возникает при запуске ng test

context.js: 265 ‘e-columns’ не является известным элементом:

1. Если ‘e-columns’ является компонентом Angular, то убедитесь, что он является частью этого модуля.
2. Если ‘e-columns’ является веб-компонентом, добавьте ‘CUSTOM_ELEMENTS_SCHEMA’ в ‘@NgModule.schemas’ этого компонента, чтобы подавить это сообщение.

app.component.html

   <mks-query>
    <e-columns>
      <e-column field="EmployeeID" label="Employee ID" type="number"></e-column>
      <e-column field="FirstName" label="First Name" type="string"></e-column>
      <e-column field="TitleOfCourtesy" label="Title Of Courtesy" type="boolean"></e-column>
    </e-columns>
  </mks-query>
  

app.component.ts

 import { Component, ViewChild } from '@angular/core';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
}
  

app.module.ts

 import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  exports:[AppComponent],
  imports: [
    BrowserModule,
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
  

app.componenet.spec.ts

 import { TestBed } from '@angular/core/testing';
import { AppComponent } from './app.component';


describe('AppComponent', () => {
  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [
        AppComponent,
      ],
    }).compileComponents();
  });

  it('should create the app', () => {
    const fixture = TestBed.createComponent(AppComponent);
    const app = fixture.componentInstance;
    expect(app).toBeTruthy();
  });
  
});
  

Существует 2 возможных решения.

Если вам нужно протестировать интеграцию, e-column вам необходимо импортировать модуль, содержащий его.

 await TestBed.configureTestingModule({
  declarations: [
    AppComponent,
  ],
  imports: [ 
    EColumnModule, // I'm guessing the module's name here
  ],
}).compileComponents();
  

Если нет необходимости в таких интеграционных тестах, было бы предпочтительнее включить NO_ERRORS_SCHEMA в конфигурацию. Таким образом e-column , они будут рассматриваться как общие HTMLElement .

 import { NO_ERRORS_SCHEMA } from '@angular/core';
import { TestBed } from '@angular/core/testing';
import { AppComponent } from './app.component';


describe('AppComponent', () => {
  beforeEach(async () => {
    await TestBed.configureTestingModule({
      schemas: [NO_ERRORS_SCHEMA],
      declarations: [
        AppComponent,
      ],
    }).compileComponents();
  });

  it('should create the app', () => {
    const fixture = TestBed.createComponent(AppComponent);
    const app = fixture.componentInstance;
    expect(app).toBeTruthy();
  });
  
});
  

вы должны импортировать mks-query в app.module.ts

когда вы используете угловые компоненты, вам необходимо импортировать их в свой модуль