HTML 图像在 Karma 之上渲染

Question

当我运行 "ng test" 时，为什么我的导航栏组件中的徽标会在 Karma 中呈现？

当运行宁"ng test"时出现如下图：

以下代码来自我的 app.component.spec.ts 文件。

describe("AppComponent", () => {
  let component: AppComponent;
  let fixture: ComponentFixture<AppComponent>;
  let de: DebugElement

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [
        RouterTestingModule, 
        AngularFireDatabaseModule,
        AngularFireAuthModule,
        AngularFirestoreModule,
        AngularFireStorageModule,
        AngularFireModule.initializeApp( environment.firebase)],
      declarations: [
        AppComponent, 
        NavbarComponent],
      providers: 
        [ 
          DatabaseService, 
        ],
    }).compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(AppComponent);
    component = fixture.componentInstance;
    de = fixture.debugElement;
    fixture.detectChanges();
  });

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

Answer 1

我猜图像显示时没有 CSS 它应该有多大或多小。

如果 NavbarComponent 对 AppComponent 的单元测试不重要，您可以使用 NO_ERRORS_SCHEMA 使 NavbarComponent 成为死的 HTML 元素你的单元测试。

尝试：

import { NO_ERRORS_SCHEMA } from '@angular/core';
....
declarations: [
        AppComponent, 
        // NavbarComponent,
   ],
schemas: [NO_ERRORS_SCHEMA],

那么希望图片不会出现。

HTML 图像在 Karma 之上渲染

HTML image gets rendered on top of Karma

html

testing

karma-jasmine

angular