[英]Setting up a basic unit test for angular "provider"
I'm looking to set up a basic unit test for my angular application, specifically an Ionic application.我希望为我的 angular 应用程序设置一个基本的单元测试,特别是一个 Ionic 应用程序。 I'm using karma/jasmine using a preconfigured solution by the ionic team.
我正在使用离子团队预先配置的解决方案使用业力/茉莉花。 The included sample unit tests passed, so I proceeded to write a new unit-test for my own provider.
包含的示例单元测试通过了,所以我继续为我自己的提供程序编写一个新的单元测试。
Here's where I get into trouble because there's no real sample to reference on.这就是我遇到麻烦的地方,因为没有真正的样本可供参考。 So I just created a
TestBed
and put the minimum required components in as you'd do with your application.所以我刚刚创建了一个
TestBed
并像处理应用程序一样放入最少的组件。 However everytime I run the unit test a rather vague and undescriptive error: Error: Illegal state: Could not load the summary for directive TestServiceProvider.
但是,每次我运行单元测试时都会出现一个相当模糊且
Error: Illegal state: Could not load the summary for directive TestServiceProvider.
描述的错误: Error: Illegal state: Could not load the summary for directive TestServiceProvider.
Error: Illegal state: Could not load the summary for directive TestServiceProvider.
at syntaxError (webpack:///node_modules/@angular/compiler/esm5/compiler.js:486:21 <- karma-test-shim.js:66892:34)
at CompileMetadataResolver.getDirectiveSummary (webpack:///node_modules/@angular/compiler/esm5/compiler.js:15085:0 <- karma-test-shim.js:81491:31)
at JitCompiler.getComponentFactory (webpack:///node_modules/@angular/compiler/esm5/compiler.js:34301:25 <- karma-test-shim.js:100707:63)
Looking at the stack trace it looks like it's caused by a SyntaxError.查看堆栈跟踪,它看起来像是由 SyntaxError 引起的。 Although I'm not sure what and why it is occurring.
虽然我不确定它是什么以及为什么会发生。 Any idea what is being done wrong in this example?
知道在这个例子中做错了什么吗?
import { TestServiceProvider } from './test';
import { TestBed, TestModuleMetadata, async, ComponentFixture } from '@angular/core/testing';
describe('Test Service', () => {
let component: TestServiceProvider;
let fixture: ComponentFixture<TestServiceProvider>;
beforeEach(async( () => {
TestBed.configureTestingModule({
providers: [TestServiceProvider]
}).compileComponents;
}));
beforeEach( () => {
fixture = TestBed.createComponent(TestServiceProvider);
component = fixture.componentInstance;
});
it('should add numbers', () => {
expect(1+1).toBe(2);
});
});
import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map';
/*
Generated class for the TestServiceProvider provider.
See https://angular.io/guide/dependency-injection for more info on providers
and Angular DI.
*/
@Injectable()
export class TestServiceProvider {
constructor() {
console.log('Hello TestServiceProvider Provider');
}
}
You do not need to create a component instance as we are just testing a service.您不需要创建组件实例,因为我们只是在测试服务。 Just inject it and test it in test specs.
只需注入它并在测试规范中测试它。 Below is the minimum code that you need to start testing.
以下是您开始测试所需的最少代码。
import { TestServiceProvider } from './test';
import { TestBed, TestModuleMetadata, async, ComponentFixture } from '@angular/core/testing';
describe('Test Service', () => {
let component: TestServiceProvider;
let fixture: ComponentFixture<TestServiceProvider>;
beforeEach(async( () => {
TestBed.configureTestingModule({
providers: [TestServiceProvider]
});
service = TestBed.inject(TestServiceProvider);
}));
it('should add numbers', () => {
expect(1+1).toBe(2);
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.