React Native プロジェクトを実行しており、react-query で記述されたカスタム フックをテストしています。Jest、@testing-library/react-hooks、および @testing-library/react-native を使用しています。私のテストでは、フックによって返された mutate 関数を呼び出す方法が見つからないようです。
カスタムフックは次のとおりです。
export default function useAuthentication() {
const { mutate, data, isSuccess, isError } = useMutation(
authenticationApi.authenticateUser
);
return { mutate, data, isSuccess, isError };
}
react-query のドキュメントに従って、renderHook() でフックをレンダリングし、ミューテーション コールの結果を待っています。
const authBody: AuthBody = {
username: '111111',
password: '111111',
};
describe('Authentication Hook', () => {
const sanityCall = () =>
axios.post('http://localhost:4000/auth/authenticate');
console.log(sanityCall());
const queryClient = new QueryClient();
it('Gets authentication data', async () => {
const wrapper = ({ children }: any) => (
<QueryClientProvider client={queryClient}>
<Provider store={store}>
<PersistGate loading={null} persistor={persistor}>
{children}
</PersistGate>
</Provider>
</QueryClientProvider>
);
const { result, waitFor } = renderHook(() => useAuthentication(), {
wrapper,
});
await waitFor(() => {
result.current.mutate({
username: authBody.username,
password: authBody.password,
});
return result.current.isSuccess;
});
expect(result.current.data).toEqual({ answer: 42 });
});
});
API を呼び出しません。ローカル サーバーのターミナル ウィンドウは、 を使用しているときにサーバーに ping を実行していることをログに記録しますが、sanityCall()
その呼び出しをコメント アウトしてフックに依存すると、何も表示されません。このようなカスタム フックをテストする方法についてのアイデアはありますか?