Enzyme から React Testing Library への移行

InfoQ ホームページ ニュース Enzyme から React Testing Library への移行 - Sentry のケーススタディ

2023 年 3 月 2 日 3 分で読む

による

ブルーノ・クーリオル

Sentry エンジニアリング チームは最近、フロントエンド テストを Enzyme から React Testing Library に移行することで得られた推進力と教訓をブログで詳しく説明しました。 この移行は、Enzyme が新しいバージョンの React をサポートしていないことがきっかけでした。 移行には約 20 か月かかり、17 人のエンジニアが約 5,000 のテストをレビューしました。

Sentry のエンジニアリング タイムでは、実質的に十分なメリットが得られないため、テスト ベースを React Testing Library (RTL) に移行しないことを何度か決定しました。 チームはこう振り返った。

新しいからといってただ放り込むわけではありません。 私たちは新しいテクノロジーを慎重に評価し、それがチームにどのようなメリットをもたらすかを理解します。 当時、RTL は私たちに知られていましたが、なぜそれをコードベースに導入する必要があるのか​​について強い議論はありませんでした。 私たちがコンポーネント ライブラリをテストするために使用したライブラリである Enzyme は、依然として私たちのニーズに対応していました。

一方で、Sentry はすでに TypeScript への大規模な移行に取り組んでおり、通常の製品作業と合わせてエンジニアリング チームは忙しくしていました。

一方で、酵素検査には非常に時間がかかることが多く、チームは検査速度の向上に強い関心を持っていました。

(出典: Sentry のエンジニアリング ブログ)

概念実証では 12% のパフォーマンス向上が示されましたが、これはさらに別の長期にわたる移行プロジェクトに着手するには不十分であると考えられました。 それにもかかわらず、概念実証では、RTL が Enzyme に比べて目に見える利点があることを証明しました。 チームが報告しているように、Enzyme はアクセシビリティのテストを行わず、テスト環境を自動的にクリーンアップせず、テストの状態にあるコンポーネントに直接アクセスすることがよくありました。 逆に、RTL は統合テストに近く、ユーザーの観点からアプリケーションのユースケースをテストするよう努めています。 特に、RTL は実装の詳細をテストすることを避けるよう努めています。 実装の変更によりテストが中断されるのは、実際にバグが導入された場合のみです。

Sentry が TypeScript に移行し、React 17 (React Hooks を含む) へのアップグレードを開始した後、トレードオフ分析は変更されました。 チームはこう振り返っています。

私たちが React をバージョン 17 に更新するまで、[RTL] 移行はまだあまり注目されていませんでした。React コア チームはライブラリの内部を完全に書き直し、Enzyme は多くの内部 React 機能を直接使用しました。[…] Enzyme はそうではありませんでした。この新しいバージョンの React では 100% 動作しますが、この問題を回避するアダプターが市販されていたので、それを使用しました。 ただし、React 18 では完全な書き換えが必要となるため、このソリューションは長期的には機能しません。Airbnb が Enzyme のサポートを終了したことを考えると、その可能性は低いでしょう。[…] RTL は React の内部に依存しません。 React 18 でも、16 や 17 と同様に機能し続けます。

ゴーサインが出されると、移行プロジェクトのリスクを最小限に抑えることに焦点が切り替わりました (さまざまな仮説に基づいたエンジニアリングの見積もり、反復的なアプローチとビッグバン移行の比較、進捗状況の追跡、RTL トレーニング、ベスト プラクティスの表面化、毎日のコード レビューなど) ）。

移行は 18 か月後に完了しました (推定では 14 か月)。 これにより、チームは古いテストを削除し、以前は見落とされていたアクセシビリティを改善し、実装の詳細ではなくユースケースに基づいてテストを作成できるようになりました。

チームは、いくつかの RTL 推奨事項に忠実に従っているときに遭遇する予期せぬパフォーマンスの問題について詳しく説明しました (たとえば、Web API をモックすることに加えて、ユーザーをできるだけ現実的にモックします)。 テスト パフォーマンスの面 (最初の概念実証への関心を高めた主な問題点) では劇的な改善は見られませんでしたが、チームは次のように前向きに結論付けました。