ela*_*ash 5 unit-testing angular2-testing angular
基本上我有一个看起来像这样的组件:
export class CmpB extends CmpA {
variableA:any = {};
@Input() config:any = {};
constructor(private serviceA: serviceA,
@Optional() private CmpC?: CmpC) {
super();
}
ngOnInit() {
if (this.CmpC) {
super.doSomething(parameterA);
//other stuff
}
}
}
Run Code Online (Sandbox Code Playgroud)
所以我基本上得到了扩展CmpA的CmpB(根据配置改变了变量A)并且为了做某事它需要一个特定的父组件CmpC.......我需要为它编写一个实际验证CmpA突变的测试.
我的测试看起来像这样
describe('CmpB', () => {
let mock: any = MockComponent({ selector: "app-element", template: "<CmpC><CmpB></CmpB></CmpC>" });
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [mock, CmpC, CmpB],
providers: [
ServiceA
]
}).compileComponents();
});
it('CmpB component test', async(() => {
const appMock = TestBed.createComponent(mock);
appMock.detectChanges();
const el = appMock.debugElement.nativeElement as HTMLElement;
expect(el.tagName).toEqual("DIV");
}));
}
Run Code Online (Sandbox Code Playgroud)
它的工作原理和覆盖范围都是贯穿整个事情的.但我需要的是手动设置配置输入并查看variableA如何变异; 我无法弄清楚怎么样.
mock组件源自以下代码
import { Component } from '@angular/core';
export function MockComponent(options: Component): Component {
let metadata: Component = {
selector: options.selector,
template: options.template || '',
inputs: options.inputs,
outputs: options.outputs
};
class Mock {}
return Component(metadata)(Mock);
}
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
898 次 |
| 最近记录: |