我有一个表格。当用户从步骤1转到步骤2时,代码会在将用户移至步骤2之前检查步骤1中的所有必填字段。当用户位于步骤2、3或4并点击刷新或在新窗口中打开网址时,它们将被重定向到简介页面。
我的问题是测试代码以及要测试的内容。
我正在使用React,Redux,Jest和Sinon。
// actions.js
export const redirectToIntroPage = () => (dispatch, getState) => {
const fields = {
field1: getState().app.inputs.field1,
field2: getState().app.inputs.field2,
field3: getState().app.inputs.field3,
};
if (objHasNullValue(fields)) {
goToPage(PAGES.INTRODUCTION);
}
};
getState()
被调用了几次,因为我只关心指定的键。 app
还有很多我不需要的东西。
// parsing.js
export const objHasNullValue = obj => {
for (var property in obj) {
if (isNull(obj[property]) === true) {
return true;
}
}
return false;
};
goToPage
不言自明。
// action.test.js
describe('redirect to intro page', () => {
let sandbox, fakeDispatch, fakeState, goToPage;
const fakeGetState = () => (fakeState);
beforeEach(() => {
sandbox = sinon.createSandbox();
fakeDispatch = sandbox.stub();
goToPage = sandbox.spy();
});
afterEach(() => {
sandbox.restore();
});
it('should redirect if the Personalisation Form has a null value', () => {
fakeState = {
app: {
inputs: {
field1: null,
field2: null,
field3: null,
},
},
};
redirectToIntroPage()(fakeDispatch, fakeGetState);
expect(goToPage.calledOnce).toBe(true);
});
it('shouldn\'t redirect if the Personalisation Form is complete', () => {
});
});
我对测试的想法是将goToPage
存根并检查它是否已被调用。为此,我必须打电话给redirectToIntroPage()(fakeDispatch, fakeGetState)
,但是我如何进入redirectToIntroPage
来检查goToPage
?
我看过here,从概念上讲是有意义的,但是如何在Sinon和Jest中翻译呢?
我也看过here,这是相同的想法。
答案 0 :(得分:0)
从参数中获取goToPage
,而不是从外部范围获取(因为很难模拟)。
将您的功能分为2:
// Use for testing
export const redirectTo = (goToPage) => () => (dispatch, getState) => {
const fields = {
field1: getState().app.inputs.field1,
field2: getState().app.inputs.field2,
field3: getState().app.inputs.field3,
};
if (objHasNullValue(fields)) {
goToPage(PAGES.INTRODUCTION);
}
};
// Use as before
export const redirectToIntroPage = redirectTo(goToPage);