Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
AIともっと楽するE2Eテスト
Search
Yohei Maeda
July 08, 2025
Programming
9
3.3k
AIともっと楽するE2Eテスト
Yohei Maeda
July 08, 2025
Tweet
Share
More Decks by Yohei Maeda
See All by Yohei Maeda
複雑な仕様に立ち向かうアーキテクチャ
myohei
0
370
Other Decks in Programming
See All in Programming
Flutter로 Gemini와 MCP를 활용한 Agentic App 만들기 - 박제창 2025 I/O Extended Seoul
itsmedreamwalker
0
140
AI時代のドメイン駆動設計-DDD実践におけるAI活用のあり方 / ddd-in-ai-era
minodriven
19
7.2k
Android 15以上でPDFのテキスト検索を爆速開発!
tonionagauzzi
0
200
Langfuseと歩む生成AI活用推進
licux
3
230
CEDEC2025 長期運営ゲームをあと10年続けるための0から始める自動テスト ~4000項目を50%自動化し、月1→毎日実行にした3年間~
akatsukigames_tech
0
140
20250808_AIAgent勉強会_ClaudeCodeデータ分析の実運用〜競馬を題材に回収率100%の先を目指すメソッドとは〜
kkakeru
0
170
tool ディレクティブを導入してみた感想
sgash708
1
100
GUI操作LLMの最新動向: UI-TARSと関連論文紹介
kfujikawa
0
940
Claude Code と OpenAI o3 で メタデータ情報を作る
laket
0
130
生成AI、実際どう? - ニーリーの場合
nealle
0
110
Portapad紹介プレゼンテーション
gotoumakakeru
1
130
それ CLI フレームワークがなくてもできるよ / Building CLI Tools Without Frameworks
orgachem
PRO
17
3.9k
Featured
See All Featured
How to Think Like a Performance Engineer
csswizardry
25
1.8k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
36
2.5k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.9k
The Straight Up "How To Draw Better" Workshop
denniskardys
236
140k
4 Signs Your Business is Dying
shpigford
184
22k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
8
880
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Making the Leap to Tech Lead
cromwellryan
134
9.5k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
The Cult of Friendly URLs
andyhume
79
6.5k
Transcript
AIともっと楽するE2Eテスト 〜未来の「当たり前」を今、試してみる〜 2025/07/08 yohei
アジェンダ 自己紹介 なぜ今、AIとテストの話をするのか? AIとの協業に向けたアーキテクチャの試み AIと目指すテスト自動化への挑戦 我々の現在地と、これからの話
yohei © LayerX Inc. $ whoami LayerX バクラク事業部 (2023-09 -)
Software Engineer バクラク申請経費精算 エンジニアリングマネー ジャー ラジオとお酒が好き 最近の悩み 夜になると疲れ目でコードレビューができない
時代の変化 Agentic Coding コードは 「書く」 から 「生成・レビューする」 時代へ © LayerX
Inc. なぜ今、AIとテストの話をするのか? Cursor, Claude CodeなどのAIツールが急速に普及 コード生成の効率は大幅に向上 テストの重要性が高まり、QA(品質)がボトルネックに 4
新たな課題 開発速度の爆発的な向上 AIツールの普及により、機能開発・コード生成が 大幅に高速化 、多くの人が書ける時代に ↓ 品質保証のボトルネック化 © LayerX Inc.
なぜ今、AIとテストの話をするのか? E2Eテスト作成: 依然として時間がかかる 手動テスト実行: 人的リソースに依存 品質と速度のトレードオフが顕在化 5
我々の視点 AI時代のテスト戦略の重要性 特にユーザー体験の最後の砦である 複雑なドメインのためE2Eテストの重要性が増している バクラク 申請・経費精算での実例 © LayerX Inc. なぜ今、AIとテストの話をするのか?
複雑な申請作成フロー 多様な企業設定(様々な組み合わせ) 属人性の排除できる動く仕様書としてのE2Eテスト 6
AIでテストを書くことの重要性 従来のテスト作成の課題 AIがもたらす変化 ※想像も多分に含んでます © LayerX Inc. AIでテストを書くことの重要性 学習コスト :
テストフレームワークの習得が必要 属人化 : テスト設計・実装に専門知識が必要 メンテ : 仕様変更時のテスト更新が大変 実装障壁の低下 : 自然言語でテストシナリオを記述 民主化 : 専門知識がなくてもテスト作成可能 継続的なメンテ : チーム全体でテストに貢献、AIがテストをメンテナンス 7
我々のアプローチ AI Firstな設計思想 AIが最大限のパフォーマンスを発揮できる アーキテクチャ設計こそが重要 人間のためではなく、AIのための設計へ © LayerX Inc. AIが書きやすい「ScreenActionパターン」
8
技術スタック・ツールと成果 技術構成 © LayerX Inc. 利用している技術スタック 言語: Flutter(Dart) E2Eツール: Patrol
AI基盤: Claude 4 Opus(希望者全員に配布) 開発支援: Cursor, Claude Code, Roo Code, Cline レビュー: Greptile(トライアル中) 9
E2Eアーキテクチャの検討 3つのパターンを比較検討 © LayerX Inc. AIが書きやすい「ScreenActionパターン」 Page Object Pattern: 画面ごとに要素と操作を一つのクラスに統合
シンプルだが、大規模になると責務が混在 Custom Commands Pattern: よく使う操作を再利用可能なコマンドとして定義 重複は減るが、画面固有のロジックが散らばりがち Screen Action Pattern: 要素・操作・検証を別々のクラスに分離 責務が明確で、AIが理解しやすい構造 10
検討結果:Screen Action Patternを採用 採用理由 AIが特化しやすい設計 各クラスの役割が明確で、 AIが迷わずコード生成できる © LayerX Inc.
AIが書きやすい「ScreenActionパターン」 AI適性: 生成すべきコードの責務が明確 保守性: 変更の影響範囲が限定的 チーム開発: 役割分担がしやすい 11
ScreenActionパターンの概要 責務を明確に分離した構造 © LayerX Inc. AIが書きやすい「ScreenActionパターン」 PageObject: UI要素の定義のみ ( enterEmail()
, enterPassword() , tapLoginButton() ) ActionObject: 操作の定義のみ ( login() ) StateObject: 状態検証のみ ( isErrorVisible , isLoggedIn ) ScreenObject: 上記3つを統合 ( isLoginSuccess() , navigateToNextScreen() ) ScenarioFile: テストケースの定義 (ログイン→申請作成ボタンタップ→申請作成) 12
AIと目指すテスト自動化への挑戦 AIと目指すテスト自動化への挑戦
Before / After ※まだ実験段階です これまで(手作業) 手作業でのテスト作成にはかなりの時間がかかっていた AI活用後 プロンプト一つで短時間でベースとなるテストコードを生成可能 大幅な効率化を実現 ©
LayerX Inc. Step 1: 既存コードからテストコード生成 14
実際のプロンプト例 → 簡単なページの作成はこれで十分 © LayerX Inc. Step 1: 既存コードからテストコード生成 15
Dart MCP使った自動生成の例 ※Dart MCPは開発中の機能になります(次回Flutterリリースで使えるようになりそう) © LayerX Inc. Step 2: MCP利用したテスト作成
0:00 16
チーム全体でのテスト作成の可能性 チーム開発の革新につながる可能性 期待される成果 © LayerX Inc. チーム全体でのテスト作成 QAエンジニア: 実際に操作しながらシナリオを自然言語で描述→コード生成 プロダクトオーナー:
ユーザーストーリーをテストに変換 デザイナー: UIの振る舞いを直接テスト化 テスト作成時間の大幅短縮 カバレッジの向上 品質の継続的改善 17
未来へのロードマップ 今後の目標 © LayerX Inc. 我々の現在地と、これからの話 Mobile MCPの本格導入 アプリ内自動回遊テストの実現 ビジュアルリグレッションテストの自動生成
チーム全体でのテスト作成フロー確立 18
長期ビジョン AIによるテストの完全自動生成 そんな未来を夢見て、これからも試行錯誤を続けます © LayerX Inc. 未来へのロードマップ テスト保守の自動化 ユーザーストーリーからの直接生成 19
None
ご清聴ありがとうございました © LayerX Inc. 21