はじめに 最近、JESTとReact Testing Libraryを使ってテストを書く機会が増えてきました。 最初は愚直にテストを書いていたのですが、以下のような課題が出てきたため、コンポーネント構成を見直してみました。 コンポーネント外のパラメータ(Props や store, API など) と画面表示項目の間に複雑な変換ロジックが入っていてテストを書くのが大変 UI の変更などによりテストが通らなくなる Before 1 コンポーネントの中に表示値への変換ロジックが入っているコンポーネントになります。 変換部分が複雑化するとテストを書くのがだんだん億劫になってきます。 /** * Props */ export type Props = { /** * 係数 */ coefficient: number; }; /** * Component */ export const Com