Download to read offline
エンジニアの気持ちを完全に理解してくれている Cypress Cloud
- 1. © Magic Moment2023 © Magic Moment 2023 2023-12-26 / 完全に理解した Talk / @morishin エンジニアの気持ちを完全に 理解してくれている Cypress Cloud 1
- 2. © Magic Moment2023 話す ● テストって ダルいよね 大事だよね ● E2E テストが何故面倒か ● Cypress Cloud 良いよ ● 特に Test Replay が良いよ ● こんなワークフローを考えてみた 今日話すことと話さないこと 話さない ● QA とは ● E2E テストとは ● Cypress とは ● Cypress の tips ● 弊社の開発・QA スタイル
- 3. © Magic Moment2023 morishin (株) Magic Moment 営業組織が使う SaaS を開発・販売しているスタートアップ ロール フロントエンドエンジニア 趣味 フォートナイト、ボルダリング、イタリア料理、赤ワイン おまえだれよ
- 4. © Magic Moment2023 morishin (株) Magic Moment 営業組織が使う SaaS を開発・販売しているスタートアップ ロール フロントエンドエンジニア 趣味 フォートナイト、ボルダリング、イタリア料理、赤ワイン おまえだれよ 設計 実装 テスト リリース 不具合調査・修正
- 5. © Magic Moment2023 morishin (株) Magic Moment 営業組織が使う SaaS を開発・販売しているスタートアップ ロール フロントエンドエンジニア 趣味 フォートナイト、ボルダリング、イタリア料理、赤ワイン おまえだれよ 設計 実装 テスト リリース 不具合調査・修正 単体テスト (UT) 結合テスト (IT) E2E テスト etc.
- 6. © Magic Moment2023 morishin (株) Magic Moment 営業組織が使う SaaS を開発・販売しているスタートアップ ロール フロントエンドエンジニア 趣味 フォートナイト、ボルダリング、イタリア料理、赤ワイン おまえだれよ 設計 実装 テスト リリース 不具合調査・修正 単体テスト (UT) 結合テスト (IT) E2E テスト etc.
- 7. © Magic Moment2023 Testing Pyramid The Testing Pyramid: Simplified for One and All https://www.headspin.io/blog/the-testing-pyramid-simplified-for-one-and-all
- 8. © Magic Moment2023 Testing Pyramid E2E テストはコストが高い → テスト量は少なくする The Testing Pyramid: Simplified for One and All https://www.headspin.io/blog/the-testing-pyramid-simplified-for-one-and-all
- 9. © Magic Moment2023 Testing Trophy The Testing Trophy and Testing Classifications https://kentcdodds.com/blog/the-testing-trophy-and-testing-classifications
- 10. © Magic Moment2023 Testing Trophy E2E テストは信頼度が高いがコストも高い → テスト量は少な (ry The Testing Trophy and Testing Classifications https://kentcdodds.com/blog/the-testing-trophy-and-testing-classifications
- 11. © Magic Moment2023 要するに E2E テストは少量、大事、面倒
- 12. © Magic Moment2023 要するに E2E テストは少量、大事、面倒 ● テストを書くのが難しい ● テストが Flaky になりやすい ● テストが壊れやすい (陳腐化しやすい) ● 失敗したときに原因を特定しづらい
- 13. © Magic Moment2023 要するに E2E テストは少量、大事、面倒 ● テストを書くのが難しい ● テストが Flaky になりやすい ● テストが壊れやすい (陳腐化しやすい) ● 失敗したときに原因を特定しづらい
- 14. © Magic Moment2023 テストが失敗しているけどすぐに原因が分からない ↓ いったん無視してリリースしてしまおう (開発状況がカツカツだから、 E2E テストって Flaky だから、etc.) ↓ リリース後も慢性的に Failed が出続ける ↓ 対応されないまま放置 (エラー通知の常態化) ↓ プロダクト品質の低下、品質意識の低下、大障害 失敗の原因を特定しづらいと
- 15. © Magic Moment2023 そこでコレですよ cloud Cypress で書かれた E2E テストを実行したり、結果を見たり、分析 したりできる、無料で使えるダッシュボードサービス ※案件じゃないです
- 16. © Magic Moment2023 始め方 1. https://www.cypress.io/cloud?v=2 にアクセスしてサインナップする 2. Project settings にある Record Keys をコピーする 3. Cypress を実行する環境 (自分の PC とか) の環境変数にセットする 4. オプションつきで Cypress を実行する 詳しくはドキュメントを見て下さい → https://docs.cypress.io/guides/cloud/getting-started export CYPRESS_RECORD_KEY=<record key> npx cyprss run --record
- 17. © Magic Moment2023 始め方 1. https://www.cypress.io/cloud?v=2 にアクセスしてサインナップする 2. Project settings にある Record Keys をコピーする 3. Cypress を実行する環境 (自分の PC とか) の環境変数にセットする 4. オプションつきで Cypress を実行する 詳しくはドキュメントを見て下さい → https://docs.cypress.io/guides/cloud/getting-started export CYPRESS_RECORD_KEY=<record key> npx cyprss run --record Cypress の実行結果が Cypress Cloud に貯まるようになる
- 18. © Magic Moment2023 ここが凄いよ Cyprss Cloud
- 19. © Magic Moment2023 ここが凄いよ Cyprss Cloud
- 20. © Magic Moment2023 ここが凄いよ Cyprss Cloud Test Replay
- 21. © Magic Moment2023 21
- 22. © Magic Moment2023 22 テストが失敗したときの様子を動画で観れる
- 23. © Magic Moment2023 23 直観的で、テストの失敗原因を究明しやすい
- 24. © Magic Moment2023 24 Cypress Cloud を活用した開発 & QA ワークフロー ポイント ● Cypress Cloud 上の Test Replay 機能で 直観的にテスト失敗の原因分析ができる ● Cypress Cloud 上でテストの再実行ができる ● ローカルマシンの Cypress 実行結果を Cypress Cloud 上で確認できる 開発と QA を分離できる (ある程度) 非エンジニアでも QA ができる (ある程度)
- 25. © Magic Moment2023 みんなも使おう cloud ※案件じゃないです
- 26. © Magic Moment2023 26 WE ARE HIRING
- 27. © Magic Moment2023 THANK YOU © Magic Moment 2023 27