2017-11-30 11 views
1

redux-thunkを使用して、ストアにディスパッチするものを決定するロジックを実行するreduxアクションクリエーターがあります。 HTTPリクエストのような約束通りではないので、正しくテストする方法に問題があります。病気が病状を満たしているかどうか、病気がないかどうかのテストが必要です。アクション作成者は約束を返さないので、私のテストで.then()を実行することはできません。このようなことをテストする最良の方法は何ですか?Redux Thunkアクションクリエーターのテスト

同様に、私は実際に約束を返すので、それはかなり簡単なテストを行うと信じています。getRemoveFileMetrics()アクションクリエイター。しかし、値がremoveFilesであり、条件を満たす場合に呼び出されるものをどのようにアサートすることができますか?それはどのようにテストに書かれますか?

ありがとうございましたこれが私に最後の数日間詰まっていたので。

アクションクリエーター

export const handleSelection = (value, cacheKey) => { 
    return dispatch => { 
     if (value === "removeFiles") { 
      dispatch(getRemoveFileMetrics(cacheKey)); 
     } 
     dispatch({ type: HANDLE_SELECTION, value }); 
    }; 
}; 

export const getRemoveFileMetrics = cacheKey => { 
    return dispatch => { 
     dispatch({ type: IS_FETCHING_DELETE_METRICS }); 
     return axios 
      .get(`../GetRemoveFileMetrics`, { params: { cacheKey } }) 
      .then(response => { 
       dispatch({ type: GET_REMOVE_FILE_METRICS, payload: response.data }); 
      }) 
      .catch(err => console.log(err)); 
    }; 
}; 

冗談

it("should dispatch HANDLE_SELECTION when selecting operation",() => { 
    const store = mockStore({}); 
    const value = "switchVersion"; 
    const expectedAction = [{ 
     type: MOA.HANDLE_SELECTION, 
     value, 
    }]; // TypeError: Cannot read property 'then' of undefined 
    return store.dispatch(MOA.handleSelection(value)).then(() => { 
     const returnedActions = store.getActions(); 
     expect(returnedActions).toEqual(expectedAction); 
    }); 
}); 

NEW EDIT

だから約束を返すためにダニーDelottの答えのオフに基づいて、私は合格テストをacheived次のようになります。

export const handleSelection = (value, cacheKey) => { 
    return dispatch => { 
     if (value === "removeFiles") { 
      return dispatch(getRemoveFileMetrics(cacheKey)); 
     } 
     return new Promise((resolve, reject) => { 
      resolve(dispatch({ type: HANDLE_SELECTION, value })); 
     }); 
    }; 
}; 

答えて

1

アクションクリエイターに約束を明示的に返さない理由はありますか?それ以外の場合は

export const handleSelection = (value, cacheKey) => { 
    return dispatch => { 
     if (value === "removeFiles") { 
      return dispatch(getRemoveFileMetrics(cacheKey)); 
     } 
     dispatch({ type: HANDLE_SELECTION, value }); 
     return new Promise(); 
    }; 
}; 

、あなたはイベントの後、あなたの主張を作る必要があります:それは約束を返してgetRemoveFileMetricsのように、それはちょうどhandleSelectionに飲み込まれます...

最も簡単な解決策はただ約束を返すことです見えますループが終了する。 PromiseでラップされたsetTimeoutを使って、.thenの動作をさせることができます。

it("should dispatch HANDLE_SELECTION when selecting operation",() => { 
    const store = mockStore({}); 
    const value = "switchVersion"; 
    const expectedAction = [{ 
     type: MOA.HANDLE_SELECTION, 
     value, 
    }]; 

    store.dispatch(MOA.handleSelection(value)); 

    // flush outstanding async tasks 
    return new Promise(resolve => { 
    setTimeout(resolve, 0); 
    }) 
    .then(() => { 
     const returnedActions = store.getActions(); 
     expect(returnedActions).toEqual(expectedAction); 
    }); 
}); 
+0

私は修正を見つけたと思うので、上記の新しい編集を確認してください、それはアサーションを満たすようです。 – dcook

関連する問題