使用 Jest 對 Redux 做單元測試 - Reducer 篇
16 Apr 2020使用 Jest 對 Redux 的 reducer 做單元測試的簡單記錄。
由於 reducer 是一個 pure function,也就是說,只要 input 相同,即可得到相同的 output。因此,在做測試時,只要比對 output 是否等於預期結果即可。
範例如下,listData 是一個 reducer,對其指定要執行的 action type 和丟入要處理的資料 payload。在此引入兩個檔案 test_data 作為 input,expected_data 作為 output 的比對目標,接著將 test_data 輸出結果與 input,expected_data 做比較即可。
import TEST_DATA from './test_data';
import EXPECTED_DATA from './expected_data';
const initState = {
isLoading: false,
listData: [],
pageIndex: 0,
pageSize: 25,
sortColumn: [{ id: 'level', order: 'asc' }],
};
describe('Check list data...', () => {
// 不傳入任何東西就會得到初始狀態
test('List data should be equal to initial state if nothing passed.', () => {
const result = ruleList(undefined, {});
expect(result).toEqual(initState);
});
test('List data should be as expected.', () => {
const result = listData(initState, {
type: SET_LIST_DATA,
payload: TEST_DATA,
});
expect(result).toEqual(EXPECTED_DATA);
});
});