Как отлаживать ошибку "[object ErrorEvent]" в моих тестах Karma/Jasmine?

У меня есть несколько неудачных тестов, которые выводят только [object ErrorEvent] thrown. Я ничего не вижу в консоли, которая помогает мне определить код нарушения. Есть ли что-то, что мне нужно сделать, чтобы отследить их?

[EDIT]: Я запускаю Karma v1.70, Jasmine v2.7.0

Ответ 1

Чтобы исправить это, вы должны запустить тесты без исходных карт в качестве обходного пути:

CLI v6.0.8 и выше
--source-map=false

CLI v6.0.x ранние версии
--sourceMap=false

CLI v1.x
--sourceMaps=false

ng test -sm=false ярлыка ng test -sm=false также может работать

По этому вопросу есть открытый вопрос https://github.com/angular/angular-cli/issues/7296

ОБНОВЛЕНИЕ: у меня тоже была эта проблема, поэтому я просто перешел на последнюю версию cli и убедился, что все пакеты обновлены в package.json также полностью переустановил node_modules так что теперь проблема node_modules.

Ответ 2

Если sourcemap = false не помогает, попробуйте 1) открыть браузер, на котором выполняются тесты 2) нажать кнопку отладки 3) открыть консоль

Там будет ошибка

enter image description here

Ответ 3

Попробуйте, если вы получите более описательное сообщение об ошибке, выполнив тест с терминала, например:

ng test -sm=false

В своем тесте вы можете заменить

it('should...')

с

fit('should...') 

Теперь будут выполняться только те тесты, которым предшествует fit. Чтобы оставить браузер открытым после запуска теста, запустите тест следующим образом:

ng test -sm=false --single-run false

Лично я столкнулся с этой ошибкой дважды. Оба были вызваны только при вызове fixture.detectChanges().

первое время, я решил его, используя более строчную интерполяцию в моем .html файле.

Небезопасный пример:

<p>{{user.firstName}}</p>

Безопасный (r) пример (обратите внимание на знак вопроса):

<p>{{user?.firstName}}</p>

То же самое относится к привязке свойств:

<p [innerText]="user?.firstName"></p>

Время второе, я использовал DatePipe в моем .html файле, но свойство mock, в котором я его использовал, не было датой.

.html файл:

<p>{{startDate | date: 'dd-MM-yyyy'}}</p>

.ts(mock-data) file (неверно):

let startDate = 'blablah';

.ts(mock-data) file (правильный):

let startDate = '2018-01-26';

Ответ 4

Это связано с тем, что платформа jasmine не может обработать тип ErrorEvent, поэтому она не извлекает сообщение об ошибке и вместо этого вызывает error.toString() для этого объекта.

Я только что подал вопрос в репозиторий Жасмин https://github.com/jasmine/jasmine/issues/1594

Пока это не исправлено, вы можете временно исправить установленный пакет жасмина в папке node_modules. В моем случае это

node_modules/jasmine/node_modules/lib/jasmine-core/jasmine.js

а затем изменить реализацию ExceptionFormatter из этого

if (error.name && error.message) {
    message += error.name + ': ' + error.message;
} else {
    message += error.toString() + ' thrown';
}

к этому

if (error.name && error.message) {
    message += error.name + ': ' + error.message;
} else if (error.message) {
    message += error.message;
} else {
    message += error.toString() + ' thrown';
}

Это помогает определить проблему.

Ответ 5

Для меня это было связано с обещанием, разрешенным в ngOnInit компонента. Мне пришлось использовать async, fakeAsync и поставить галочку, а также выполнить асинхронную службу с помощью spyOn

beforeEach(async(
  //... initialise testbed and component
))
beforeEach(fakeAsync(
  // ... setup mocks then call:
  component.ngOnInit()
  tick()
  fixture.detectChanges()
))

Angular - Как unit test компонент с асинхронным вызовом службы

Ответ 6

TL; DR: это может быть связано с тестированием маршрутизации.

Я тоже получаю [object ErrorEvent] thrown. Через час проследил его до одной строки кода.

this.username = this.userService.getUser(this.route.snapshot.paramMap.get('id'))[0];

Проблема заключается в том, что тестовая среда пытается оценить this.route.snapshot.paramMap.get('id').

Если я заменил его на 0, [object ErrorEvent] thrown уйдет.

У пользователя userService есть такой пользователь:

public users = [ ["admin", "First name", "Surname", etc... ] ].

Итак, 0 просто получает этого пользователя в индексе 0.

В противном случае при обычном запуске моего приложения this.route.snapshot.paramMap.get('id') оценивается, когда пользователь выбирает пользователя для редактирования из моей таблицы пользователей.

Итак, в моем HTML, *ngFor="let user of users; index as i" петли, чтобы отобразить всех пользователей, а затем routerLink="/edit/{{i}}", чтобы вы могли нажимать на кнопки редактирования для каждого пользователя, которые при щелчке переходите к примеру. http://localhost:4200/edit/0, чтобы отредактировать приведенные выше данные пользователя администратора.

Ответ 7

У меня такая же проблема. Одним из способов возникновения этой ошибки является попытка доступа к чему-либо пустому или неопределенному в шаблоне. Убедитесь, что у вас есть проверка безопасности этих переменных.

Например, это выдает [object: ErrorEvent], когда config не определен при загрузке компонента.

template.html

<div *ngIf="config.options">
   .....
   ......
</div>

Сделай это вместо

<div *ngIf="config?.options">
   .....
   ......
</div>

Ответ 8

У вас может быть гонка или асинхронный тест, который настроен неправильно или используется неправильно. Я хотел бы предположить, что отладочный случай должен быть исправлен и игнорировать прохождение командной строки. Просто продолжайте обновлять программу запуска кармы (браузер) на случай, если [object ErrorEvent] thrown ошибка [object ErrorEvent] thrown появляется периодически, затем убедитесь, что вы правильно выполнили условие асинхронности.

Надеюсь, это работает.

Ответ 9

Для меня проблема заключалась в том, что у меня был тест, в котором я случайно использовал библиотеку auth0-lock.

Ответ 10

Оказалось, чтобы быть проблемой асинхронная, потому что после того, как я добавил достаточно it в одном из своих компонентов спецификации, я был в состоянии получить сообщение об ошибке, которое полезная указал на файл и строку в этом файле (это было связано с paramMap.

В спецификации, которая тестировала ParamMap, я просто добавил:

  describe('this test', () => {
    it('will succeed', () => {
      expect(true).toBeTruthy();
    });

    it('will succeed', () => {
      expect(true).toBeTruthy();
    });

    it('will succeed', () => {
      expect(true).toBeTruthy();
    });

    it('will succeed', () => {
      expect(true).toBeTruthy();
    });
  });

Ответ 11

как насчет очистки после каждого теста:

  afterEach(() => {
    TestBed.resetTestingModule();
  })

Ответ 12

[объект ErrorEvent] брошен

Эта ошибка показывает, что у вас есть что-то неопределенное. Самый простой способ отладить его из моего опыта:

it('should create', () => {
    console.log(component);
    // You can check in the browser log which property is undefined
    });

Ответ 13

В моем случае проблема была с сервисом, так как один из объектов будет неопределенным во время выполнения тестов.

Пример сервисного кода был что-то вроде ниже доступа к DOM,

  const elem = this.document.querySelector(element) as HTMLElement;
  elem.scrollIntoView({param1: ''});

Спецификации, ссылающиеся на этот сервис, не выполнялись с ошибкой " [объект ErrorEvent] брошен ".

Я высмеял свой сервисный объект во всех спецификациях, которые ссылались на это, и проблема была решена.

Ложный сервис

class MockService {
serviceMethod(div) : void {
  testElement = document.querySelector('div') as HTMLElement;
  return testElement;
  } 
}

И используйте этот объект службы в провайдерах, как показано ниже,

beforeEach(async(() => {

TestBed.configureTestingModule({
  declarations: [Component],
  providers: [
     { provide: Service, useClass: MockService },
    ],
})
  .compileComponents();
}));

Ответ 14

Что может помочь, если у вас открыто окно Chrome для вашего бегуна тестов Karma, чтобы открыть инструменты разработчика и проверить консоль там. Для меня это помогло мне узнать, что приложение не может использовать метод Array.findIndex для неопределенного массива (поскольку структура данных была организована в виде строки даты, такой как data [2018] [3] [28], и Я случайно указал на неправильную дату), но вместо того, чтобы просто остановиться на ошибке, тест продолжался.

Ответ 15

Я использовал прокси в моем приложении, определенном в proxy.conf.json, например:

'/api': { 'target': 'some path', 'changeOrigin': false }

Поскольку Карма не знал об этом прокси, он продолжал выдавать ошибки в консоли, что конечная точка API не может быть найдена. Поэтому, просмотрев документацию по Karma, я обнаружил, что могу добавить свойство "прокси" в karma.conf.js с тем же объектом из proxy.conf.json:

proxies: { '/api': { 'target': 'some path', 'changeOrigin': false }}

Ошибка в консоли исчезла, и объект [errorEvent] больше не генерировался.