Quramy×Takepepeが語る、フロントエンドテストの最前線 #フロントエンド_findy

かし @cashfooooou

UI フレームワークはテストをされているので大丈夫だろう 小さいコンポーネント（ボタンとかリンク）はアクセシビリティツリー上の意味が取れることを重視したテストを書く #フロントエンド_findy

shintaro @shin_k_2281

> 側があるだけで書こうという意識がだいぶ違う めちゃわかる、hygenやscaffdogは整理しておいてなるべく皆に「あ〜〜そいうことね、書くか〜〜」って思わせたい #フロントエンド_findy

かし @cashfooooou

GraphQL codegen の mock で、まだ辛い目を見ていないのだけど夢を見てるだけだったのか #フロントエンド_findy

shira @9v9Shira

見てる #フロントエンド_findy

かし @cashfooooou

ずれてないことをテストしたいならスナップショットテストを導入するのがよいのかも #フロントエンド_findy

じょう @joe_re

自分的にはsnapshotはあくまでスモークテストだなぁ。意図しない変更が何かないかを知るためのもので合って、テストしたい項目がある場合はassertionを絶対書く感じ #フロントエンド_findy

かし @cashfooooou

> 子コンポーネントや孫コンポーネントは mock して抜いてしまっていい なるほど、残念な snapshot を作らないためにいいかも #フロントエンド_findy

かし @cashfooooou

flaky のテストは早め早めに潰す、そうしないと信頼性が落ちてしまう #フロントエンド_findy

かし @cashfooooou

act のエラーを放置すると速度が低下するんだ、しらなかった #フロントエンド_findy

ケンジ @jp_knj

テストの書きっぱなしはあるある… #フロントエンド_findy

かし @cashfooooou

どこまで書くか、書きすぎないようにするにはどうするか 実行時間に閾値を持たせるのは一つわかりやすいかも #フロントエンド_findy

かし @cashfooooou

実行時間をどの程度待てるかは先に話しておけるといい タバコ1本分の時間か〜 #フロントエンド_findy

かし @cashfooooou

>光の速度でテストが完了するなら全部テストしたい 草 #フロントエンド_findy

かし @cashfooooou

> 自分が作っているものが強調動作させることで初めてわかることをテストするならインテグレーションテストといえるだろう なるほどな、自分が作ったか外部の機能かも重要なんだ 大体のコンポーネントのテストはインテグレーションテストってことか #フロントエンド_findy

かし @cashfooooou

App Router のテスト、まだ難しいんだなあ 今はまだブラウザの E2E テストしかないか〜 #フロントエンド_findy

ケンジ @jp_knj

use client の内側はtesting library で頑張れるけど、それ以外はE2E テストになるのか #フロントエンド_findy

berlysia💭🦔 @berlysia

#フロントエンド_findy 見てた

puku0x @puku0x

ご視聴ありがとうございました！ 明日の昼に再放送がありますので見逃した方はこちらをご覧ください👋 findy.connpass.com/event/291916/ #フロントエンド_findy