我正在尝试使用模拟服务测试 Angular 6 组件。
我对下面代码的意图是使用嵌套describe语句以允许不同版本的模拟服务返回不同的结果
真正的服务执行一些 HTTP 调用，而我的模拟返回一个带有数据的 Observable。
当我执行测试时，我看到 Jasmine 正在尝试实际执行 HTTP 调用并且忽略了我的模拟
// Core imports
import { async, ComponentFixture, TestBed, inject, fakeAsync } from '@angular/core/testing';
import { FormsModule } from '@angular/forms';
import { DebugElement, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { ActivatedRoute, Params } from "@angular/router";
import { Observable } from "rxjs/Observable"
import 'rxjs/add/observable/of';
import { HttpClientModule } from "@angular/common/http";
// Vendor imports
import { ToastrModule, ToastrService } from 'ngx-toastr';
import { NgbModule } from "@ng-bootstrap/ng-bootstrap";
// Project imports
import { FormComponent } from './form.component';
import { FormService } from "../../services/form.service";
import { DatastoreService } from "../../services/datastore.service";
describe('FormComponent', () => {
let component: FormComponent;
let fixture: ComponentFixture<FormComponent>;
let de: DebugElement;
let el;
beforeEach(async(() => {
console.info('First setup of module');
return TestBed.configureTestingModule({
imports: [HttpClientModule, FormsModule, ToastrModule.forRoot(), NgbModule.forRoot()],
providers: [
FormService,
ToastrService,
DatastoreService,
{
provide: ActivatedRoute,
useValue: {
params: {
subscribe: (fn: (value: Params) => void) => fn({
tab: 0,
}),
},
snapshot: {
url: [{path: 'worker'}],
queryParams: {table: 'portal', sysId: undefined}
},
},
},
],
declarations: [ FormComponent ],
schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
});
}));
beforeEach(() => {
console.info('establishing components');
fixture = TestBed.createComponent(FormComponent);
component = fixture.componentInstance;
fixture.detectChanges();
de = fixture.debugElement;
el = de.nativeElement;
});
describe('with a form layout containing an invalid element', () => {
let FormServiceMock = class FormServiceMock {
constructor() { console.info('instantiated'); }
public getForm(table) {
console.log('getForm called');
return Observable.of({
"table": "portalx",
"schema": {
"name": {"title": "name", "element_type": "string"},
"suffix": {"title": "suffix", "element_type": "string"},
"active": {"title": "active", "element_type": "boolean"}
}, "layout": ["name", "suffix", "notexists", "active"]
});
}
};
beforeEach( () => {
console.info('Second re-setup of module');
TestBed.resetTestingModule();
return TestBed.configureTestingModule({
providers: [{ provide: FormService, useClass: FormServiceMock }]
}).compileComponents();
});
fit('ngOnInit sets values correctly', inject([FormService], (service: FormService) => {
console.info('hello world');
component.ngOnInit();
expect(component.portal).toEqual('worker');
}));
});
});
运行茉莉花测试给了我
Chrome 66.0.3359 (Mac OS X 10.12.6) ERROR Chrome 66.0.3359 (Mac OS X 10.12.6) ERROR Disconnectedundefined Chrome 66.0.3359 (Mac OS X 10.12.6): Executed 1 of 37 (skipped 36) SUCCESS ( 1.779 秒/1.655 秒）sNm6eZUIrnZxAOwqAAAI，ID 为 92987428 Chrome 66.0.3359（Mac OS X 10.12.6）：执行 0 of 37 成功（0 秒/0 秒）信息：“模块的第一次设置”Chrome 66.0.3359（Mac OS X 10.12.6): 执行 0 of 37 SUCCESS (0 secs / 0 secs) INFO: 'First setup of module' 27 05 2018 17:36:00.293:WARN [web-server]: 404: /api/services/ui /form/portal 27 05 2018 17:36:00.551:WARN [web-server]: 404: /api/services/ui/form/portal INFO: '建立组件' Chrome 66.0.3359 (Mac OS X 10.12.6) ：执行 0 of 37 SUCCESS (0 secs / 0 secs) INFO: '建立组件' INFO: '第二次重新设置模块' Chrome 66.0.3359 (Mac OS X 10.12.6): Executed 0 of 37 SUCCESS (0 secs / 0 秒）信息：“第二次重新设置模块”信息：“实例化”Chrome 66.0.3359（Mac OS X 10.12.6）：执行 0 次，共 37 次成功（0 秒/0 秒）信息：“实例化”信息： 'hello world' Chrome 66.0.3359 (Mac OS X 10.12.6): 执行 0 of 37 SUCCESS (0 secs / 0 secs) INFO: 'hello world' LOG: HttpErrorResponse{headers: HttpHeaders{normalizedNames: Map{},lazyUpdate ：空，lazyInit：函数（）{...}}，状态：404，状态文本：'未找到'，网址：'建立组件的信息：“第二次重新设置模块”Chrome 66.0.3359（Mac OS X 10.12.6）：执行 0 次，共 37 次成功（0 秒/0 秒）信息：“第二次重新设置模块”信息： '实例化' Chrome 66.0.3359 (Mac OS X 10.12.6): 执行 0 of 37 成功 (0 秒 / 0 秒) 信息: '实例化' 信息: 'hello world' Chrome 66.0.3359 (Mac OS X 10.12.6 ): 执行 0 of 37 SUCCESS (0 secs / 0 secs) INFO: 'hello world' LOG: HttpErrorResponse{headers: HttpHeaders{normalizedNames: Map{}, lazyUpdate: null, lazyInit: function () { ... }},状态：404，状态文本：'未找到'，网址：'建立组件的信息：“第二次重新设置模块”Chrome 66.0.3359（Mac OS X 10.12.6）：执行 0 次，共 37 次成功（0 秒/0 秒）信息：“第二次重新设置模块”信息： '实例化' Chrome 66.0.3359 (Mac OS X 10.12.6): 执行 0 of 37 成功 (0 秒 / 0 秒) 信息: '实例化' 信息: 'hello world' Chrome 66.0.3359 (Mac OS X 10.12.6 ): 执行 0 of 37 SUCCESS (0 secs / 0 secs) INFO: 'hello world' LOG: HttpErrorResponse{headers: HttpHeaders{normalizedNames: Map{}, lazyUpdate: null, lazyInit: function () { ... }},状态：404，状态文本：'未找到'，网址：'执行 0 of 37 SUCCESS (0 secs / 0 secs) INFO: 'Second re-setup of module' INFO: 'instantiated' Chrome 66.0.3359 (Mac OS X 10.12.6): Executed 0 of 37 SUCCESS (0 secs / 0秒）信息：“实例化”信息：“你好世界”Chrome 66.0.3359（Mac OS X 10.12.6）：执行 0 次，共 37 次成功（0 秒 / 0 秒）信息：“你好世界”日志：HttpErrorResponse {标题： HttpHeaders{normalizedNames: Map{},lazyUpdate: null,lazyInit: function () { ... }}, status: 404, statusText: 'Not Found', url: '执行 0 of 37 SUCCESS (0 secs / 0 secs) INFO: 'Second re-setup of module' INFO: 'instantiated' Chrome 66.0.3359 (Mac OS X 10.12.6): Executed 0 of 37 SUCCESS (0 secs / 0秒）信息：“实例化”信息：“你好世界”Chrome 66.0.3359（Mac OS X 10.12.6）：执行 0 次，共 37 次成功（0 秒 / 0 秒）信息：“你好世界”日志：HttpErrorResponse {标题： HttpHeaders{normalizedNames: Map{},lazyUpdate: null,lazyInit: function () { ... }}, status: 404, statusText: 'Not Found', url: '实例化'信息：'hello world' Chrome 66.0.3359（Mac OS X 10.12.6）：执行 0 次，共 37 次成功（0 秒 / 0 秒）信息：'hello world' 日志：HttpErrorResponse{headers: HttpHeaders{normalizedNames: Map {}，lazyUpdate：null，lazyInit：function（）{...}}，状态：404，statusText：'未找到'，url：'实例化'信息：'hello world' Chrome 66.0.3359（Mac OS X 10.12.6）：执行 0 次，共 37 次成功（0 秒 / 0 秒）信息：'hello world' 日志：HttpErrorResponse{headers: HttpHeaders{normalizedNames: Map {}，lazyUpdate：null，lazyInit：function（）{...}}，状态：404，statusText：'未找到'，url：'http://localhost:9876/api/seLOG : HttpErrorResponse{headers: HttpHeaders{normalizedNames: Map{},lazyUpdate: null,lazyInit: function () { ... }}, status: 404, statusText: 'Not Found' , url: ' http://localhost:9876/api/services/ui/form/portal ', ok: false, name: 'HttpErrorResponse', message: ' http://localhost:9876/api/的Http失败响应services/ui/form/portal : 404 Not Found'，错误：'NOT FOUND'} Chrome 66.0.3359 (Mac OS X 10.12.6): Executed 0 of 37 SUCCESS (0 secs / 0 secs) LOG: HttpErrorResponse {headers : HttpHeaders{normalizedNames: Map{}, lazyUpdate: null, lazyInit: function () { ... }}, status: 404, statusText: 'Not Found', url: ' http://localhost:9876/api/services/ui/form/portal'，好的：false，名称：'HttpErrorResponse'，消息：' http://localhost:9876/api/services/ui/form/portal的 Http 失败响应：404 Not Found'，错误：'NOT FOUND'} 日志: HttpErrorResponse{headers: HttpHeaders{normalizedNames: Map{},lazyUpdate: null,lazyInit: function () { ... }}, status: 404, statusText: 'Not Found', url: ' http://localhost:9876 /api/seLOG : HttpErrorResponse{headers: HttpHeaders{normalizedNames: Map{}, lazyUpdate: null, lazyInit: function () { ... }}, status: 404, statusText: 'Not Found', url: ' http:// /localhost:9876/api/services/ui/form/portal ', ok: false, name: 'HttpErrorResponse', message: ' http://localhost 的 Http 失败响应：9876/api/services/ui/form/portal: 404 Not Found', 错误: 'NOT FOUND'} Chrome 66.0.3359 (Mac OS X 10.12.6): Executed 0 of 37 SUCCESS (0 secs / 0 secs) LOG: HttpErrorResponse{headers: HttpHeaders{normalizedNames: Map{ }，lazyUpdate：null，lazyInit：function（）{...}}，状态：404，statusText：'未找到'，url：' http://localhost:9876/api/seChrome 66.0.3359（Mac OS X 10.12.6）：执行 1 of 37（跳过 36）成功（1.638 秒 / 1.52 秒）
在该日志输出中，我看到Instantiated哪个在我的模拟构造函数中，但我没有看到我的getForm方法被调用，而是从服务中调用了真正的方法。
Chrome 66.0.3359 (Mac OS X 10.12.6) 错误已断开连接未定义 27 05 2018 17:35:58.128:
INFO [Chrome 66.0.3359 (Mac OS X 10.12.6)]: Connected on socket
有什么帮助吗？