Angular Karma 使用 CUSTOM_ELEMENTS_SCHEMA 测试超时测试 AppComponent答案

【问题标题】：Angular Karma tests timeout testing AppComponent with CUSTOM_ELEMENTS_SCHEMAAngular Karma 使用 CUSTOM_ELEMENTS_SCHEMA 测试超时测试 AppComponent
【发布时间】：2019-11-28 04:27:44
【问题描述】：

我正在向我的 Angular 项目添加一个应用程序组件测试，但在运行所有测试时突然发生超时：

[launcher]: Launching browsers headless with concurrency unlimited
 21% building 95/96 modules 1 active .../src/css/public.scss19 [launcher]: Starting browser ChromeHeadless
[HeadlessChrome 75.0.3770 (Mac OS X 10.14.5)]: Connected on socket -d4Du6uXE65XhnZkAAAA with id 51932343
[HeadlessChrome 75.0.3770 (Mac OS X 10.14.5)]: Disconnected (0 times), because no message in 30000 ms.

我最近添加的测试 app.component.spec.ts：

...
describe('AppComponent', () => {
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      schemas: [CUSTOM_ELEMENTS_SCHEMA],
      imports: [RouterTestingModule],
      declarations: [AppComponent],
      providers: [...],
    }).compileComponents();
  }));

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

});

没有进行任何测试。过了一会儿，我发现 CUSTOM_ELEMENTS_SCHEMA 导致了超时。现在，我的 app.component.html 中有一个自定义元素，这就是我添加架构的原因。删除架构（并从 html 中删除元素）可以解决问题。

为什么添加架构会导致 karma-headlessChrome 超时？另外，将自定义元素添加到应用程序组件是一种不好的做法吗？

--更新--

原来我导入了错误的项目：

import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/compiler/src/core';

应该是

import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';

【问题讨论】：

已修复，请参阅更新

标签： angular jasmine karma-runner google-chrome-headless

【解决方案1】：

原来我导入了错误的项目：

import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/compiler/src/core';

应该是

import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';

【讨论】：