アーカイブ：2021年 6月
-
axios 404などエラーを受け取るとcatchできる。 GitHubスター数が多い。 node-fetch サイズが小さい npmのダウンロード数で言えばaxiosよりも多い。 …
-
MSW(Mock Server Worker) RestとGraphQL両方に対応している。 Service Workerがブラウザリクエストをインターセプトして、任意のレスポンスを返せる。 SSR/CSRの両方に対応…
-
React-routerとは？ ReactでSPAによるページ遷移を実現するためのライブラリです。 特徴 ブラウザの履歴にも蓄積されるのでブラウザバック とかも普通に行えます。 インストール [crayon-63e1448aacd…
-
package.json scripts デフォルトでは以下のようになっています。 [crayon-63e1448aad637381702250/] test 以下のように指定することで「npm test」を実行した際に複数ケース…
-
【SPA】用意した方が良いテストケース
06.13
認証のテストケース ログイン成功時に成功メッセージが表示されていること。 ログイン失敗時に画面遷移してないこと。 ユーザー登録に成功すること。 ユーザー登録に失敗すること。 ユーザー登録に成功したが、ログイ…
-
各コンポーネントからuseDispatchなどでRedux Tool Kit内のReducer関数を呼び出したり、useSelectorでstateを参照したりすると思いますが、RTK独自の構文になるのでRenderでそのまま呼び出そうとし…
-
【React】「ページ遷移」のテスト
06.13
コンポーネント内でページ遷移のテストをする方法です。 react-router-domをモック化する方法 react-router-dom自体をjestでモック化します。ただ、この方法だとwithRouterとかがコードに記述してあるコ…
-
useMutationとは？ React Queryでデータを登録・編集・削除したりする場合に使います。 登録処理のサンプル [crayon-63e1448aae10b080215706/] onSuccess APIのリクエスト…
-
インストール react-qureryとdevtoolsをインストールしておくと便利です。 [crayon-63e1448aae57b631905535/] react-query-devtools 導入するとブラウザ左下でデバッガ…