Как отлаживать ошибку "[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] больше не генерировался.