我在javascript中有以下代码:
class SampleClass {
constructor(param1) {
this.param1 = param1;
this.init();
}
async init() {
await this.getData();
this.loadIframe();
}
async getData() {
const response = fetch(url);
const data = response.json();
//set the response to class variable
this.param2 = data;
}
loadIframe() {
//some logic to load iframe.
}
}
使用笑话进行测试的最佳方法是什么?
目前,我正在通过模拟init()函数来测试构造函数逻辑。
但是我还必须测试getData()函数。什么是测试getData()方法的方法。
我尝试通过不模拟init()函数并使用异步测试来测试getData()函数,但我不确定 在哪里使用在测试中等待,因为该函数是在从构造函数调用的init内部嵌套并调用的。
it('should fetch data', async()=>{
//some logic
})
答案 0 :(得分:2)
您可以使用jest.spyOn(object, methodName)模拟SampleClass
的方法。我的测试环境是node
,所以我在fetch
对象上模拟了global
方法。如果您的测试环境是browser
,则fetch
对象位于window
对象上。
例如
sampleClass.js
:
class SampleClass {
constructor(param1) {
this.param1 = param1;
this.init();
}
async init() {
await this.getData();
this.loadIframe();
}
async getData() {
const url = 'https://stackoverflow.com/';
const response = fetch(url);
const data = response.json();
this.param2 = data;
}
loadIframe() {}
}
export { SampleClass };
sampleClass.test.js
:
import { SampleClass } from './sampleClass';
describe('60146073', () => {
afterEach(() => {
jest.restoreAllMocks();
});
describe('#constructor', () => {
it('should consturt', () => {
jest.spyOn(SampleClass.prototype, 'constructor');
jest.spyOn(SampleClass.prototype, 'init').mockReturnValueOnce();
const instance = new SampleClass('param1');
expect(instance.param1).toBe('param1');
expect(instance.init).toBeCalledTimes(1);
});
});
describe('#init', () => {
it('should init', async () => {
jest.spyOn(SampleClass.prototype, 'getData').mockResolvedValueOnce();
jest.spyOn(SampleClass.prototype, 'loadIframe').mockReturnValueOnce();
jest.spyOn(SampleClass.prototype, 'init').mockReturnValueOnce();
const instance = new SampleClass();
await instance.init();
expect(instance.getData).toBeCalledTimes(1);
expect(instance.loadIframe).toBeCalledTimes(1);
});
});
describe('#getData', () => {
it('should fetch data', async () => {
const mResponse = { json: jest.fn().mockReturnValueOnce({}) };
global.fetch = jest.fn().mockResolvedValueOnce(mResponse);
jest.spyOn(SampleClass.prototype, 'init').mockReturnValueOnce();
const instance = new SampleClass();
await instance.getData();
expect(global.fetch).toBeCalledWith('https://stackoverflow.com/');
expect(mResponse.json).toBeCalledTimes(1);
});
});
});
单元测试结果覆盖率100%:
PASS stackoverflow/60146073/sampleClass.test.js
60146073
#constructor
✓ should consturt (3ms)
#init
✓ should init (2ms)
#getData
✓ should fetch data (2ms)
----------------|---------|----------|---------|---------|-------------------
File | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s
----------------|---------|----------|---------|---------|-------------------
All files | 100 | 100 | 80 | 100 |
sampleClass.js | 100 | 100 | 80 | 100 |
----------------|---------|----------|---------|---------|-------------------
Test Suites: 1 passed, 1 total
Tests: 3 passed, 3 total
Snapshots: 0 total
Time: 4.137s, estimated 5s
源代码:https://github.com/mrdulin/react-apollo-graphql-starter-kit/tree/master/stackoverflow/60146073