I try to test my Ionic 2 app with Karma and Jasmine. I try to test a component and I have a lot of errors for one of my tests. I don't understand it and I don't know how to solve it ...
My test file (p-tools.spec.ts) :
import {TestBed, async} from '@angular/core/testing';
import {StatusBar, Splashscreen} from "ionic-native";
import {IonicModule, NavController} from "ionic-angular";
import {MyApp} from "../app/app.component";
import {PTools} from "./p-tools";
import {ToComePage} from "../pages/to-come/to-come";
import {CHeaderComponent} from "../components/c-header/c-header";
import {MedicalEventCardComponent} from "../components/medical-event-card/medical-event-card";
import {PData} from "./p-data";
import {PTranslate} from "./p-translate";
import {IonicStorageModule} from "@ionic/storage";
describe('App', () => {
let fixture;
let component;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [MyApp, ToComePage, CHeaderComponent, MedicalEventCardComponent],
imports: [
IonicStorageModule.forRoot(MyApp)
],
providers: [
StatusBar,
Splashscreen,
NavController,
PTools,
PData,
PTranslate,
]
})
}));
beforeEach(() => {
fixture = TestBed.createComponent(ToComePage);
component = fixture.componentInstance;
});
it ('should be created', () => {
expect(component instanceof ToComePage).toBe(true);
});
});
And there is my console display :
C:\xampp\htdocs\App>npm test
> ionic-hello-world@ test C:\xampp\htdocs\App
> karma start ./test-config/karma.conf.js
webpack: Compiled successfully.
webpack: Compiling...
ts-loader: Using typescript@2.0.9 and C:\xampp\htdocs\App\tsconfig.json
30 03 2017 09:13:22.914:WARN [karma]: No captured browser, open http://localhost:9876/
webpack: Compiled successfully.
30 03 2017 09:13:22.920:INFO [karma]: Karma v1.5.0 server started at http://0.0.0.0:9876/
30 03 2017 09:13:22.920:INFO [launcher]: Launching browser Chrome with unlimited concurrency
30 03 2017 09:13:22.991:INFO [launcher]: Starting browser Chrome
30 03 2017 09:13:26.939:INFO [Chrome 56.0.2924 (Windows 10 0.0.0)]: Connected on socket N3finxHlN66dY3OOAAAA with id 15833092
...Chrome 56.0.2924 (Windows 10 0.0.0) App should be created FAILED
Error: Template parse errors:
Can't bind to 'content' since it isn't a known property of 'ion-menu'.
1. If 'ion-menu' is an Angular component and it has 'content' input, then verify that it is part of this module.
2. If 'ion-menu' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message.
("<ion-menu [ERROR ->][content]="content" side="right">
<ion-header>
Menu
"): MyApp@0:10
'ion-header' is not a known element:
1. If 'ion-header' is an Angular component, then verify that it is part of this module.
2. If 'ion-header' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("<ion-menu [content]="content" side="right">
[ERROR ->]<ion-header>
Menu
</ion-header>
"): MyApp@1:2
'ion-content' is not a known element:
1. If 'ion-content' is an Angular component, then verify that it is part of this module.
2. If 'ion-content' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("
Menu
</ion-header>
[ERROR ->]<ion-content>
Menu content
</ion-content>
"): MyApp@4:2
'ion-menu' is not a known element:
1. If 'ion-menu' is an Angular component, then verify that it is part of this module.
2. If 'ion-menu' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("[ERROR ->]<ion-menu [content]="content" side="right">
<ion-header>
Menu
"): MyApp@0:0
Can't bind to 'root' since it isn't a known property of 'ion-nav'.
1. If 'ion-nav' is an Angular component and it has 'root' input, then verify that it is part of this module.
2. If 'ion-nav' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message.
("
</ion-menu>
<ion-nav #content [ERROR ->][root]="rootPage"></ion-nav>
"): MyApp@9:18
'ion-nav' is not a known element:
1. If 'ion-nav' is an Angular component, then verify that it is part of this module.
2. If 'ion-nav' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("
</ion-menu>
[ERROR ->]<ion-nav #content [root]="rootPage"></ion-nav>
"): MyApp@9:0
at SyntaxError.BaseError [as constructor] (webpack:///~/@angular/compiler/src/facade/errors.js:27:0 <- karma-test-shim.js:135660:27) [ProxyZone]
at new SyntaxError (webpack:///~/@angular/compiler/src/util.js:151:0 <- karma-test-shim.js:12662:16) [ProxyZone]
at TemplateParser.parse (webpack:///~/@angular/compiler/src/template_parser/template_parser.js:140:0 <- karma-test-shim.js:31022:19) [ProxyZone]
at JitCompiler._compileTemplate (webpack:///~/@angular/compiler/src/jit/compiler.js:362:25 <- karma-test-shim.js:76974:68) [ProxyZone]
at webpack:///~/@angular/compiler/src/jit/compiler.js:245:47 <- karma-test-shim.js:76857:62 [ProxyZone]
at Set.forEach (native) [ProxyZone]
at JitCompiler._compileComponents (webpack:///~/@angular/compiler/src/jit/compiler.js:245:0 <- karma-test-shim.js:76857:19) [ProxyZone]
at createResult (webpack:///~/@angular/compiler/src/jit/compiler.js:147:0 <- karma-test-shim.js:76759:19) [ProxyZone]
at JitCompiler._compileModuleAndAllComponents (webpack:///~/@angular/compiler/src/jit/compiler.js:151:0 <- karma-test-shim.js:76763:88) [ProxyZone]
at JitCompiler.compileModuleAndAllComponentsSync (webpack:///~/@angular/compiler/src/jit/compiler.js:98:0 <- karma-test-shim.js:76710:21) [ProxyZone]
at TestingCompilerImpl.compileModuleAndAllComponentsSync (webpack:///~/@angular/compiler/bundles/compiler-testing.umd.js:482:0 <- karma-test-shim.js:135326:35) [ProxyZone]
at TestBed._initIfNeeded (webpack:///~/@angular/core/bundles/core-testing.umd.js:770:0 <- karma-test-shim.js:24096:40) [ProxyZone]
at TestBed.createComponent (webpack:///~/@angular/core/bundles/core-testing.umd.js:853:0 <- karma-test-shim.js:24179:18) [ProxyZone]
at Function.TestBed.createComponent (webpack:///~/@angular/core/bundles/core-testing.umd.js:682:0 <- karma-test-shim.js:24008:33) [ProxyZone]
at Object.<anonymous> (webpack:///src/providers/p-tools.spec.ts:37:26 <- karma-test-shim.js:175730:82) [ProxyZone]
at ProxyZoneSpec.onInvoke (webpack:///~/zone.js/dist/proxy.js:79:0 <- karma-test-shim.js:130080:39) [ProxyZone]
at Zone.run (webpack:///~/zone.js/dist/zone.js:113:0 <- karma-test-shim.js:130297:43) [ProxyZone => ProxyZone]
at Object.<anonymous> (webpack:///~/zone.js/dist/jasmine-patch.js:102:0 <- karma-test-shim.js:129795:34) [ProxyZone]
at webpack:///~/@angular/core/bundles/core-testing.umd.js:96:0 <- karma-test-shim.js:23422:21 [ProxyZone]
at AsyncTestZoneSpec.onInvoke (webpack:///~/zone.js/dist/async-test.js:49:0 <- karma-test-shim.js:129385:39) [ProxyZone]
at ProxyZoneSpec.onInvoke (webpack:///~/zone.js/dist/proxy.js:76:0 <- karma-test-shim.js:130077:39) [ProxyZone]
at Zone.run (webpack:///~/zone.js/dist/zone.js:113:0 <- karma-test-shim.js:130297:43) [<root> => ProxyZone]
at AsyncTestZoneSpec._finishCallback (webpack:///~/@angular/core/bundles/core-testing.umd.js:91:0 <- karma-test-shim.js:23417:29) [<root>]
at webpack:///~/zone.js/dist/async-test.js:38:0 <- karma-test-shim.js:129374:31 [<root>]
at Zone.runTask (webpack:///~/zone.js/dist/zone.js:151:0 <- karma-test-shim.js:130335:47) [<root> => <root>]
at ZoneTask.invoke (webpack:///~/zone.js/dist/zone.js:332:0 <- karma-test-shim.js:130516:33) [<root>]
at data.args.(anonymous function) (webpack:///~/zone.js/dist/zone.js:1149:0 <- karma-test-shim.js:131333:25) [<root>]
Expected false to be true.
at Object.<anonymous> (webpack:///src/providers/p-tools.spec.ts:42:48 <- karma-test-shim.js:175734:113) [ProxyZone]
at ProxyZoneSpec.onInvoke (webpack:///~/zone.js/dist/proxy.js:79:0 <- karma-test-shim.js:130080:39) [ProxyZone]
at Zone.run (webpack:///~/zone.js/dist/zone.js:113:0 <- karma-test-shim.js:130297:43) [ProxyZone => ProxyZone]
at Object.<anonymous> (webpack:///~/zone.js/dist/jasmine-patch.js:102:0 <- karma-test-shim.js:129795:34) [ProxyZone]
at webpack:///~/@angular/core/bundles/core-testing.umd.js:96:0 <- karma-test-shim.js:23422:21 [ProxyZone]
at AsyncTestZoneSpec.onInvoke (webpack:///~/zone.js/dist/async-test.js:49:0 <- karma-test-shim.js:129385:39) [ProxyZone]
at ProxyZoneSpec.onInvoke (webpack:///~/zone.js/dist/proxy.js:76:0 <- karma-test-shim.js:130077:39) [ProxyZone]
at Zone.run (webpack:///~/zone.js/dist/zone.js:113:0 <- karma-test-shim.js:130297:43) [<root> => ProxyZone]
at AsyncTestZoneSpec._finishCallback (webpack:///~/@angular/core/bundles/core-testing.umd.js:91:0 <- karma-test-shim.js:23417:29) [<root>]
at webpack:///~/zone.js/dist/async-test.js:38:0 <- karma-test-shim.js:129374:31 [<root>]
at Zone.runTask (webpack:///~/zone.js/dist/zone.js:151:0 <- karma-test-shim.js:130335:47) [<root> => <root>]
at ZoneTask.invoke (webpack:///~/zone.js/dist/zone.js:332:0 <- karma-test-shim.js:130516:33) [<root>]
at data.args.(anonymous function) (webpack:///~/zone.js/dist/zone.js:1149:0 <- karma-test-shim.js:131333:25) [<root>]
Chrome 56.0.2924 (Windows 10 0.0.0) App should be created FAILED
Error: Template parse errors:
Can't bind to 'content' since it isn't a known property of 'ion-menu'.
1. If 'ion-menu' is an Angular component and it has 'content' input, then verify that it is part of this module.
2. If 'ion-menu' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message.
("<ion-menu [ERROR ->][content]="content" side="right">
<ion-header>
Menu
"): MyApp@0:10
'ion-header' is not a known element:
1. If 'ion-header' is an Angular component, then verify that it is part of this module.
2. If 'ion-header' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("<ion-menu [content]="content" side="right">
[ERROR ->]<ion-header>
Menu
</ion-header>
"): MyApp@1:2
'ion-content' is not a known element:
1. If 'ion-content' is an Angular component, then verify that it is part of this module.
2. If 'ion-content' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("
Menu
</ion-header>
[ERROR ->]<ion-content>
Menu content
</ion-content>
"): MyApp@4:2
'ion-menu' is not a known element:
1. If 'ion-menu' is an Angular component, then verify that it is part of this module.
2. If 'ion-menu' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("[ERROR ->]<ion-menu [content]="content" side="right">
<ion-header>
Menu
"): MyApp@0:0
Can't bind to 'root' since it isn't a known property of 'ion-nav'.
1. If 'ion-nav' is an Angular component and it has 'root' input, then verify that it is part of this module.
2. If 'ion-nav' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message.
("
</ion-menu>
<ion-nav #content [ERROR ->][root]="rootPage"></ion-nav>
"): MyApp@9:18
'ion-nav' is not a known element:
1. If 'ion-nav' is an Angular component, then verify that it is part of this module.
2. If 'ion-nav' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("
</ion-menu>
[ERROR ->]<ion-nav #content [root]="rootPage"></ion-nav>
"): MyApp@9:0
at SyntaxError.BaseError [as constructor] (webpack:///~/@angular/compiler/src/facade/errors.js:27:0 <- karma-test-shim.js:135660:27) [ProxyZone]
at new SyntaxError (webpack:///~/@angular/compiler/src/util.js:151:0 <- karma-test-shim.js:12662:16) [ProxyZone]
at TemplateParser.parse (webpack:///~/@angular/compiler/src/template_parser/template_parser.js:140:0 <- karma-test-shim.js:31022:19) [ProxyZone]
at JitCompiler._compileTemplate (webpack:///~/@angular/compiler/src/jit/compiler.js:362:25 <- karma-test-shim.js:76974:68) [ProxyZone]
at webpack:///~/@angular/compiler/src/jit/compiler.js:245:47 <- karma-test-shim.js:76857:62 [ProxyZone]
at Set.forEach (native) [ProxyZone]
at JitCompiler._compileComponents (webpack:///~/@angular/compiler/src/jit/compiler.js:245:0 <- karma-test-shim.js:76857:19) [ProxyZone]
at createResult (webpack:///~/@angular/compiler/src/jit/compiler.js:147:0 <- karma-test-shim.js:76759:19) [ProxyZone]
at JitCompiler._compileModuleAndAllComponents (webpack:///~/@angular/compiler/src/jit/compiler.js:151:0 <- karma-test-shim.js:76763:88) [ProxyZone]
at JitCompiler.compileModuleAndAllComponentsSync (webpack:///~/@angular/compiler/src/jit/compiler.js:98:0 <- karma-test-shim.js:76710:21) [ProxyZone]
at TestingCompilerImpl.compileModuleAndAllComponentsSync (webpack:///~/@angular/compiler/bundles/compiler-testing.umd.js:482:0 <- karma-test-shim.js:135326:35) [ProxyZone]
at TestBed._initIfNeeded (webpack:///~/@angular/core/bundles/core-testing.umd.js:770:0 <- karma-test-shim.js:24096:40) [ProxyZone]
at TestBed.createComponent (webpack:///~/@angular/core/bundles/core-testing.umd.js:853:0 <- karma-test-shim.js:24179:18) [ProxyZone]
at Function.TestBed.createComponent (webpack:///~/@angular/core/bundles/core-testing.umd.js:682:0 <- karma-test-shim.js:24008:33) [ProxyZone]
at Object.<anonymous> (webpack:///src/providers/p-tools.spec.ts:37:26 <- karma-test-shim.js:175730:82) [ProxyZone]
at ProxyZoneSpec.onInvoke (webpack:///~/zone.js/dist/proxy.js:79:0 <- karma-test-shim.js:130080:39) [ProxyZone]
at Zone.run (webpack:///~/zone.js/dist/zone.js:113:0 <- karma-test-shim.js:130297:43) [ProxyZone => ProxyZone]
at Object.<anonymous> (webpack:///~/zone.js/dist/jasmine-patch.js:102:0 <- karma-test-shim.js:129795:34) [ProxyZone]
at webpack:///~/@angular/core/bundles/core-testing.umd.js:96:0 <- karma-test-shim.js:23422:21 [ProxyZone]
at AsyncTestZoneSpec.onInvoke (webpack:///~/zone.js/dist/async-test.js:49:0 <- karma-test-shim.js:129385:39) [ProxyZone]
at ProxyZoneSpec.onInvoke (webpack:///~/zone.js/dist/proxy.js:76:0 <- karma-test-shim.js:130077:39) [ProxyZone]
at Zone.run (webpack:///~/zone.js/dist/zone.js:113:0 <- karma-test-shim.js:130297:43) [<root> => ProxyZone]
at AsyncTestZoneSpec._finishCallback (webpack:///~/@angular/core/bundles/core-testing.umd.js:91:0 <- karma-test-shim.js:23417:29) [<root>]
at webpack:///~/zone.js/dist/async-test.js:38:0 <- karma-test-shim.js:129374:31 [<root>]
at Zone.runTask (webpack:///~/zone.js/dist/zone.js:151:0 <- karma-test-shim.js:130335:47) [<root> => <root>]
at ZoneTask.invoke (webpack:///~/zone.js/dist/zone.js:332:0 <- karma-test-shim.js:130516:33) [<root>]
at data.args.(anonymous function) (webpack:///~/zone.js/dist/zone.js:1149:0 <- karma-test-shim.js:131333:25) [<root>]
Expected false to be true.
at Object.<anonymous> (webpack:///src/providers/p-tools.spec.ts:42:48 <- karma-test-shim.js:175734:113) [ProxyZone]
at ProxyZoneSpec.onInvoke (webpack:///~/zone.js/dist/proxy.js:79:0 <- karma-test-shim.js:130080:39) [ProxyZone]
at Zone.run (webpack:///~/zone.js/dist/zone.js:113:0 <- karma-test-shim.js:130297:43) [ProxyZone => ProxyZone]
at Object.<anonymous> (webpack:///~/zone.js/dist/jasmine-patch.js:102:0 <- karma-test-shim.js:129795:34) [ProxyZone]
at webpack:///~/@angular/core/bundles/core-testing.umd.js:96:0 <- karma-test-shim.js:23422:21 [ProxyZone]
at AsyncTestZoneSpec.onInvoke (webpack:///~/zone.js/dist/async-test.js:49:0 <- karma-test-shim.js:129385:39) [ProxyZone]
at ProxyZoneSpec.onInvoke (webpack:///~/zone.js/dist/proxy.js:76:0 <- karma-test-shim.js:130077:39) [ProxyZone]
at Zone.run (webpack:///~/zone.js/dist/zone.js:113:0 <- karma-test-shim.js:130297:43) [<root> => ProxyZone]
at AsyncTestZoneSpec._finishCallback (webpack:///~/@angular/core/bundles/core-testing.umd.js:91:0 <- karma-test-shim.js:23417:29) [<root>]
at webpack:///~/zone.js/dist/async-test.js:38:0 <- karma-test-shim.js:129374:31 [<root>]
at Zone.runTask (webpack:///~/zone.js/dist/zone.js:151:0 <- karma-test-shim.js:130335:47) [<root> => <root>]
at ZoneTask.invoke (webpack:///~/zone.js/dist/zone.js:332:0 <- karma-test-shim.js:130516:33) [<root>]
at data.args.(anonymous function) (webpack:///~/zone.js/dist/zone.js:1149:0 <- karma-test-shim.js:131333:25) [<root>]
Chrome 56.0.2924 (Windows 10 0.0.0): Executed 4 of 4 (1 FAILED) (1.726 secs / 1.329 secs)
My to-come.ts file :
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {PData} from "../../providers/p-data";
import {DetailsMedicalEventPage} from "../details-medical-event/details-medical-event";
import {PTranslate} from "../../providers/p-translate";
import {PTools} from "../../providers/p-tools";
@Component({
selector: 'page-to-come',
templateUrl: 'to-come.html'
})
export class ToComePage {
constructor(public navCtrl: NavController, public pdata : PData, public translate : PTranslate, public ptools: PTools) {
this.pdata.getMedicalEvents();
}
/**
* Open a specific medical event page
* @param guid the guid of the medical event
*/
openMedicalEvent(guid : string) {
this.navCtrl.push(DetailsMedicalEventPage);
}
}
My to-come.html file :
<ion-header>
<c-header></c-header>
</ion-header>
<ion-content padding>
<!-- TEMPORAIRE : Ce spinner a pour but d'informer l'utilisateur qu'un chargement est en cours -->
<div class="alert" *ngIf="this.pdata.spinners['medical_events'] == true">
<p></p>
<ion-spinner></ion-spinner>
</div>
<div class="alert alert-info" *ngIf="this.pdata.spinners['medical_events'] == false && this.pdata.current_patient.to_come_count === 0">
</div>
<div *ngFor="let key of this.pdata.keysGetter(this.pdata.medical_events)">
<medical-event-card
*ngIf="this.pdata.today < this.ptools.getTime(this.pdata.medical_events[key].date, null, this.translate.i18n)
&& this.pdata.medical_events[key].patient_guid == this.pdata.current_patient.guid"
[medical_event]="this.pdata.medical_events[key]"></medical-event-card>
</div>
</ion-content>
I think it's link to Ionic component but I don't know what I have to do to resolve my problem...
Someone had same issues ?
Aucun commentaire:
Enregistrer un commentaire