Карма Жасмин — Модульный тест по умолчанию «он должен создать» сбой с ошибкой «Ошибка неперехваченного типа: Не удается прочитать свойство nativeElement неопределенного»

#javascript #angular #unit-testing #jasmine #karma-jasmine

Вопрос:

У меня есть чрезвычайно простой модульный тест-тест, который автоматически генерируется Angular.

 import { Component, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { NO_ERRORS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { CtaSecondaryComponent } from './cta-secondary.component';

describe('CtaSecondaryComponent', () => {
  let component: CtaSecondaryComponent;
  let fixture: ComponentFixture<CtaSecondaryComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ CtaSecondaryComponent ],
      schemas: [NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA]
    })
    .compileComponents();
  }));

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

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

});
 

Я получаю ошибку примерно в 50% случаев (т. Е. Никаких изменений в тесте-иногда он терпит неудачу, иногда проходит).:

     Uncaught TypeError: Cannot read property 'nativeElement' of undefined thrown
 

Насколько я могу судить, нигде в этом компоненте нет ссылки на nativeElement. На самом деле, нигде во всем этом проекте нет ссылки на nativeElement. Я не могу найти никого другого с этой проблемой в Интернете. Может ли кто-нибудь внести свой вклад?

cta-secondary.component.html

 <!-- button -->
<button [ngClass]="{'disabled': disabled}" class="btn btn-secondary">
  <span>{{label}}</span>
</button>
 

cta-вторичный.компонент.ts

 import {Component, Input, OnInit, HostListener, ElementRef} from '@angular/core';

@Component({
  selector: 'fuse-cta-secondary',
  templateUrl: './cta-secondary.component.html',
  styleUrls: ['./cta-secondary.component.scss']
})
export class CtaSecondaryComponent implements OnInit {
  // label for cta secondary
  @Input() label: string;
  @Input() disabled: boolean;

  constructor() { }

  ngOnInit() {

  }

}
 

Версии:

угловой/сердечник: 8.2.2

карма: 6.3.4

жасмин-ядро: 2.99.1

узел: 12.18.3

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

1. ОБНОВЛЕНИЕ: Переключение с chrome без головы в качестве браузера на PhantomJS, похоже, решило проблему. Возможно, хром-безголовый что-то спрятал. В любом случае, похоже, что сейчас все работает так, как и ожидалось.

2. Я собирался сказать вам, чтобы вы попробовали удалить schemas: [NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA] , потому что я не думаю, что вам это нужно, чтобы посмотреть, исправит ли это проблему.

3. Да, я оставил это там после предыдущей попытки решить эту проблему. Как ты сам заметил, в моем случае это не имело значения.

Ответ №1:

В итоге я «решил» это сам. Переход на PhantomJS из chrome-безголовый, как браузер в karma.config.js похоже, что это решило проблему. Возможно, хром-безголовый что-то спрятал. В любом случае, похоже, что сейчас все работает так, как и ожидалось.

Может быть, кто-то еще может вмешаться, если есть какая-то перезагрузка кэша, которую необходимо выполнить в безголовом хроме?