我正在使用angular 7.1和Jasmine测试我的组件。我正在尝试编写一些测试,但这对我来说似乎太多了。
我正在尝试测试的简化课程:
import { HttpClient } from '@angular/common/http';
@Component({
selector: 'a',
templateUrl: './a.html',
styleUrls: ['./a.scss']
}
export class A implements OnInit {
constructor(private http: HttpClient) {}
private privateState: State;
public publicState: State2;
ngOnInit() {
this.http.get(this.GetUrl()).subscribe((x) => {
this.privateState = x['whatever'];
});
}
private hiddenComplexFunction() {
this.publicState = this.privateState.something;
}
public testedFunction() {
//someComplex Code
this.hiddenComplexFunction();
}
}
我尝试过的
A.['privateState']
但是没有用最后,我尝试通过以下方式对privateState进行保护和测试:
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
class AMock extends A {
ngOnInit() {
//privateState is now protected
this.privateState = mockedState;
}
}
describe('A', () => {
let component: AMock;
let fixture: ComponentFixture<AMock>;
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [HttpClientTestingModule],
declarations: [AMock]
})
.compileComponents().catch();
}));
beforeEach(() => {
fixture = TestBed.createComponent(AMock);
component = fixture.componentInstance;
});
it('testedFunction should set up public state correctly', () => {
component.testedFunction();
expect(component.publicState).toEqual(mockedState.something);
});
最后一点不起作用,并返回错误,因为在运行ng test
命令后无法读取未定义的属性“ testedFunction” 。
我不知道哪种方法是测试此方法的正确方法。我知道我可以hiddenComplexFunction
公开,我所有的问题都会消失,而且我不喜欢这样的事实,由于测试,我必须更改访问修饰符(如模拟示例中那样,从私有更改为受保护,这对我来说似乎完全不对)。
您的问题有很多事情,因此,我将从我容易看到的事情开始。
我们可以从您的核心组件代码开始。在您的testingFunction()中,调用this.hiddenComplexFunction()。您需要函数的实例版本,因此需要向其添加““ this。”“。完全合适,而且您也不想直接测试私有功能/私有属性。
接下来,我猜你想要这个代码
this.state = x['whatever'];
设置您的privateState,而不是state
this.privateState = x['whatever'];
接下来,您不需要在您的AMock类上模拟A,测试装配将为您完成。请尝试以下类似方法作为开始。我在这里没有的是州代码。我真正要做的就是摆脱您的AMock并将其替换为实际的组件,并建立一个测试状态(并且可能会建立状态较差,我可能会补充。哈!)。我在下面处理HTTP数据,这与您通过查看代码猜测的状态有关。
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { A } from './zing.component'; // this should point to your component
// get rid of this, not needed
// class AMock extends A {
// ngOnInit() {
// //privateState is now protected
// let privateState = mockedState;
// }
// }
describe('A', () => {
let component: A; // changed from AMock to A
let fixture: ComponentFixture<A>; // changed from AMock to A
let mockedState = {something: 'yelp'}; // build your expected state here
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [HttpClientTestingModule],
declarations: [A] // changed from AMock to A
})
.compileComponents().catch();
}));
beforeEach(() => {
fixture = TestBed.createComponent(A); // changed from AMock to A
component = fixture.componentInstance;
});
it('testedFunction should set up public state correctly', () => {
component.testedFunction();
expect(component.publicState).toEqual(mockedState.something);
});
});
最后,对于HTTP模拟,您可以使用HttpTestingController将一些数据刷新到您的组件。
在描述块中-
let backend: HttpTestingController;
在每个之前-
backend = TestBed.get(HttpTestingController);
在您的IT声明中-
backend.expectOne(expectedURL).flush(mockedState);
backend.verify();
如果有帮助或遇到其他错误,请告诉我们您能走多远。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句