0

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()その呼び出しをコメント アウトしてフックに依存すると、何も表示されません。このようなカスタム フックをテストする方法についてのアイデアはありますか?

4

1 に答える 1