Ich versuche meine eckige 4.1.0-Komponente zu testen -
export class CellComponent implements OnInit {
lines: Observable<Array<ILine>>;
@Input() dep: string;
@Input() embedded: boolean;
@Input() dashboard: boolean;
constructor(
public dataService: CellService,
private route: ActivatedRoute,
private router: Router, private store: Store<AppStore>) {
}
}
Ein einfacher "sollte erstellen" -Test löst jedoch diesen kryptischen Fehler aus ...
NetworkError: Fehler beim Ausführen von 'send' bei 'XMLHttpRequest': Fehler beim Laden von 'ng: ///DynamicTestModule/module.ngfactory.js'.
Daher habe ich diese Frage gefunden, die darauf hindeutet, dass das Problem darin besteht, dass die Komponente @Input)_
Parameter enthält, die jedoch nicht festgelegt sind, wenn ich meinen Test wie folgt ändere:
it('should create', inject([CellComponent], (cmp: CellComponent) => {
cmp.dep = '';
cmp.embedded = false;
cmp.dashboard = false;
expect(cmp).toBeTruthy();
}));
dann bekomme ich immer noch das gleiche Problem, ähnlich, wenn ich die @Input()
Anmerkungen aus der Komponente entferne , immer noch kein Unterschied. Wie kann ich diese Tests bestehen?
angular
unit-testing
karma-jasmine
angular-cli
George Edwards
quelle
quelle
Antworten:
Dies ist ein Problem des neuen Angular Cli. Führen Sie Ihren Test mit aus
--sourcemaps=false
und Sie erhalten die richtigen Fehlermeldungen.Details finden Sie hier: https://github.com/angular/angular-cli/issues/7296
BEARBEITEN:
Abkürzung dafür ist:
ng test -sm=false
Ab Winkel 6 lautet der Befehl:
ng test --source-map=false
quelle
Ich hatte das gleiche Problem mit angualar cli 6, ich habe dieses Tag verwendet, um die richtige Fehlermeldung zu erhalten:
Vielleicht hilft es jemandem :).
quelle
Für meinen Fall gab es ein Scheindatenproblem und im Falle von
Array
kehrte ichstring
vom Schein zurück.Oft passiert es, wenn Sie Daten verspotten, die unvollständig oder falsch sind.
quelle
Sie können entweder die Eigenschaft input () in component.ts auf den Standardwert setzen
ODER
Ändern Sie Ihre Datei component.spec.ts wie folgt:
quelle
Wie oben hier vorgeschlagen: https://stackoverflow.com/a/45570571/7085047 Mein Problem war in meinem
ngOnInit
. Ich habe einen von Mock Swagger generierten REST-Controller-Proxy angerufen. Es gab null zurück und ich habe diese null abonniert, was nicht funktioniert ...Der Fehler kam zurück:
Failed to load ng:///DynamicTestModule/MockNodeDashboardComponent_Host.ngfactory.js: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
Ich habe das Problem mit ts-mockito behoben: https://github.com/NagRock/ts-mockito
Ich habe Code hinzugefügt, um eine Scheininstanz wie diese zu erstellen:
Anschließend wurde die Instanz wie folgt zum Anbieter-Array des Tests hinzugefügt:
quelle
Dies kann damit zusammenhängen, dass Chrome einen tatsächlichen Testfehler verbirgt. Der Testbereich wird einige nachgebildete http-Fabriken verwirren, die nicht geladen werden können, und daher ist dies der Fehler, den er meldet. Höchstwahrscheinlich liegt der Fehler im Bereich ngOnInit, in dem ein Objekt beispielsweise Unterobjekte erwartet und diese nicht definiert sind.
Um dem Fehler auf den Grund zu gehen, wechseln Sie vorübergehend zu PhantomJS, das anscheinend weniger unter diesen Initialisierungsfehlern leidet. Dadurch wird Ihnen hoffentlich der tatsächliche Fehler gemeldet. Bei mehreren Gelegenheiten stellte ich fest, dass ein bei der Initialisierung erwartetes Objekt nicht vollständig war. IE:
Durch das Korrigieren des Objekts konnte PhantomJS abgeschlossen werden und Chrome konnte mit dem nächsten Test fortfahren.
Ansonsten habe ich keine Lösung gefunden, um das Problem aus Chrome zu entfernen. Versuchen Sie wie immer, die Richtlinie "Code entfernen, bis der Fehler behoben ist" zu verwenden, um den Fehler zu beheben.
UPDATE: Beachten Sie, dass dies jetzt eine ziemlich alte Antwort ist. Ich würde die Verwendung von PhantomJS (EOL) nicht mehr empfehlen. Die Berichterstellung für Browsertests ist viel besser geworden. Wenn Chrome Ihnen Kummer bereitet, versuchen Sie es mit Firefox, das heutzutage auch sehr gute Tests durchführt.
quelle
Ich hatte auch diesen Fehler, dessen Wahrheit ehrlich gesagt nicht gesprächig ist.
Es hing mit den HTTP-Aufrufen über meine Dienste zusammen
Ich benutze myService.ts mit 2 Methoden
Ich verspotte diesen Dienst: mockMyService.ts
Der Fehler war hier, weil meine Komponente die Methode getAll () verwendete, die ich vergessen hatte, im mockMyService zu implementieren. Deshalb habe ich einfach die folgende Methode hinzugefügt:
Fehler war weg :)
quelle
Ich hatte das gleiche Problem und habe herausgefunden, dass Sie zur Behebung Ihrer Eingaben für die Komponente in der Methode vor jedem die folgenden Eingaben vornehmen müssen:
Dies wird Ihr Problem definitiv lösen.
quelle
In meinem Fall wurde der Täter
observable.timeout(x).retry(y)
irgendwo auf der zurückgegebenen Observable auf Serviceklassenebene angewendet, dann wieder in der Komponente, die diesen Service verwendete.Bis zu angle-cli 1.4 hat im Browser alles richtig funktioniert. Dann begann es während der Karma-Tests zu scheitern (mit solch einem dummen Fehler). Die Lösung bestand natürlich darin, diese Timeout- / Wiederholungsoperatoren aufzuräumen.
quelle
Für mich wird diese Meldung angezeigt, wenn ein Mock in meinen Tests falsch ist: Normalerweise geben Sie mockService in Ihrem Test-Bootstrap an. Wenn Ihr Mock unvollständig oder falsch ist, dann gibt Angular diesen dummen Fehler zurück.
Weitere Informationen zu meinem Fall hier
quelle
Was ich tun würde ist:
Fügen Sie console.log () s Zeile für Zeile in ngOnint () hinzu und finden Sie heraus, wie weit es geht. Überprüfen Sie dann die Zeile, die nicht durchlaufen wird.
Ex:
Dies schlug bei meinem Test mit dem gleichen Fehler in diesem Beitrag fehl. Wie oben gezeigt, hatte ich zwei console.logs. Der erste ging durch, der zweite nicht. Also wurde mir klar, dass das Problem online ist. Const id = params.get ('id'); und ich habe es behoben.
Hoffe das wird jemandem helfen.
quelle