Угловые 2 поблочных тестирования - получение ошибки, Неудавшейся для загрузки 'ng:///DynamicTestModule/module.ngfactory.js'
У меня есть угловые 2 webpack приложения, весь webpack, конфигурация кармы, созданная согласно angular.io webpack руководство. Я не использую aot. Я пишу жасминовую спецификацию модульного теста для тестирования моих компонентов. Сначала я попробовал без асинхронного блока, в этом случае, модульный тест просто добираются, выполняются только, до fixture.detectChanges () вызов, код после этого не становится выполняемым. Походит на вызов fixture.detectChanges, заблокированный бесконечно.
Я попробовал включением кода в асинхронном блоке. Затем я получаю следующую ошибку. Error:Failed для выполнения 'отправляют' на 'XMLHttpRequest': Не удалось загрузить '/module.ngfactory.js' ng:///DynamicTestModule
Код без асинхронного
beforeeach(()=> {
TestBed.configureTestingModule({
imports:[],
declaration :[Mycomp],
providers:[{ provide:MyService, useclass:MyMockService}]
});
fixture=TestBed.createComponent(Mycomp);
console.log(' before detect changes'):
fixture.detectChanges():
console.log('after detect changes');// this is not getting
logged .. karma shows 0 of 1 executed successfully
});
С асинхронным
beforeeach(async(()=> {
TestBed.configureTestingModule({
imports:[],
declaration :[Mycomp],
providers:[{ provide:MyService, useclass:MyMockService}]
});
fixture=TestBed.createComponent(Mycomp);
fixture.detectChanges():
}));
получение ошибки, Неудавшейся для загрузки dynamictestmodule/module.ngfactory.js
9 ответов
Я столкнулся с этой проблемой сам вчера. Проблема состояла в том, что у меня было свойство Input () на моем классе компонента, который я не устанавливал в тесте. Так, например, в мой-component.ts:
@Component({
selector: 'my-component'
})
export class MyComponent {
@Input() title: string;
}
и мой-component.spec.ts:
beforeEach(() => {
fixture = TestBed.createComponent(MyComponent);
component = fixture.componentInstance;
component.title = 'Hello there!' // <-- this is required!
fixture.detectChanges();
});
Или Вы могли обеспечить значение по умолчанию в компоненте где-нибудь. Так или иначе тест откажет, если какие-либо исходные данные не будут установлены, и Вы получите ту неинтуитивную ошибку.
Примечание: Выполнение ng test -sm=false даст фактическое сообщение об ошибке, вызывающее проблему. Кредит: https://stackoverflow.com/a/45802115/61311
Для обнаружения, что действительно вызывает ошибку отключите исходные карты:
Для углового-cli> = v6.x:
ng test --source-map=false
Для углового-cli v1.x:
ng test -sm=false
Вы будете затем видеть, что лучшая ошибка, например, "Не может считать свойство 'x' неопределенных" в фактическом исходном файле, это вызывает ошибку . По некоторым причинам существует ошибка с sourcemaps прямо сейчас в тестировании, и Вы просто получаете эту загадочную ошибку.
запущение тестов с --sourcemaps=false не приведет Карму к сбою тихо, но предоставит Вам некоторую подробную информацию об ошибке вместо этого.
Прибавление к ответу Dan Field
Это - проблема с Angular Cli версия 1.2.2 или более новый . Запустите свой тест с --sourcemaps=false, и Вы получите правильные сообщения об ошибках.
тест нг - сокращение sourcemaps=false
от этого:
тестовый-sm=false
нг Посмотрите детали здесь: https://github.com/angular/angular-cli/issues/7296
У меня также была эта проблема, и это происходило из-за уродливых дразнивших данных. В моем компоненте у меня был сервис, который выполнил http вызов.
что-то как: ( служебный код )
getData() {
return this.http.get(obj);
}
В компоненте я вызвал эту функцию и подписался на него: ( код компонента )
this.service.getData().subscribe((data) => {
this.componentData = data.things; //**<=== part that broke everything**
}, (error) => {
console.log(error);
});
Решение:
, Когда я дразнил служебную функцию, мне не удалось возвратить данные, которые имели атрибут things. Это - то, что вызвало отказ XMLHttpRequest, я предполагаю к угловому, было похоже, что ошибка произошла, как будто это был Запрос HTTP. Удостоверение, что я возвратил корректные атрибуты на любых дразнивших Запросах HTTP, устранило проблемы.
Hope это разрешает вещи. Ниже код для реализации насмешки.
( component.specs)
function fakeSubscribe(returnValue,errorValue) {
return {
subscribe:function(callback,error){
callback(returnValue);
error(errorValue);
}
}
}
class MockService {
getData() {
var fakeData = {
things:[]
}
return fakeSubscribe(fakeData,0);
}
}
Это - большая часть сообщения об ошибке обмана, что я когда-либо встречался в Угловом.
В моем случае это не имело никакого отношения отправка , ничто, чтобы сделать с XmlHttpRequest - по крайней мере, не на уровне, который Вы предположите при попытке следовать сообщению.
Это было также о насмешке класса, а именно, ngrx/store. Я представил два Заметных метода в контейнере, который не был включен в мой класс макета прежде, и я забыл делать так, когда я начал использовать их. После того, как добавленный к макету, ошибка ушла.
... Карма отъезда, счастливая смочь к , выполняется, 'отправляют' от XmlHttpRequest вообще, это означает.
Я был укушен той же ошибкой на следующий день - на этот раз, проблема была проложена под землей в файле HTML. Используя тест длины простого массива для *ngIf
<ng-container *ngIf="myArray.length > 0">
должен был быть пересмотрен в
<ng-container *ngIf="myArrayNotEmpty">
с методом считывания как в:
get myArrayNotEmpty(){
return this.myArray && this.myArray.length > 0;
}
я немного раздражен, хотя то такое множество причин охвачено одним очень вводящим в заблуждение и бесполезным сообщением.
В моем случае мой ложный сервис пропускал некоторые общедоступные переменные, к которым получает доступ компонент в ngOnInit методе.
У меня просто была эта проблема также. Это оказалось простой ошибкой нулевой ссылки в моем компоненте в одном из моего *ngIf проверки.
я предложил бы выполнить подачу ng и проверить, что компонент работает в браузере без любых ошибок или просто работает тест нг - source-map=false для получения более полезного сообщения об ошибке.