序章
このレッスンには、テスト結果をより簡単に理解し、問題を迅速に切り分けるのに役立つ内容が盛り込まれています
受講者の前提知識として:
- mabl トレーナーでのテスト作成の基本について理解している (レッスン: mabl トレーナーの概要)
- ワークスペース、プラン、テスト、クレデンシャル情報、アプリケーション、環境など、mablの基本的な概念について理解している (レッスン: mablアプリケーションの概要)
学習目標 🧠
このレッスンを修了すると、以下の知識や技能が身につきます。
- デバッグに使用するツール 👾
- 失敗に対処する際に、これらのツールを使用する方法/タイミング 🎯
- 問題を切り分けた後の一般的な次のステップ⛑
学習内容 📚
- デバッグツールの概要
- テストのレビューのベストプラクティス
- 問題を切り分けた後の一般的な次のステップ
このレッスンでは最終的に、テストレビューの反復可能なプロセスを学習することで、チームが自信を持って問題を発見し、それを伝達できるようにします
これが重要である理由
mablを使用してアプリケーションのフロントエンドをテストする場合:
- テストが作成される (ユーザーによって)
- テストがクラウドで実行される (mablによって)
- 機能している要素と破損している要素を示す結果が提供される
機能する要素の場合: 問題なし 🤘
破損している要素の場合: 根本原因の発見と伝達を行い、問題を可能な限り速やかに修正 🛠
mablのデバッグツールは、以下のような場合に役立ちます。
- クラウドでの実行中に何が起こったかを理解することで、根本原因を迅速かつ効果的に発見することができる。
- チームに問題を簡単に伝えて報告し、修正できるようにする。
明確で反復可能なトラブルシューティングを行うことで、チームはバグの迅速な発見と修正が可能になります。これによりアプリケーション全体の品質の向上と、最も重要なこととして、ユーザーの満足度の向上 🙂 を実現できます。
デバッグツールの概要
デバッグツールの概要
- ステップの詳細 📝
- スクリーンショット 📸
- ログ 📋
1. ステップの詳細 📝
- ステップのステータス/説明 - ステップで実行したアクションと、ステップが成功、失敗、警告付き成功のいずれであるかを示します。
- タイミング - ステップの実行にかかった時間
- 視覚的変化 - 検出された視覚的変化
ネットワーク問題 - 検出されたネットワーク問題
自動修復 - 二次検索条件に基づいて見つかった要素
- 要素のサムネイル - ステップで操作した要素の小さな画像
ⓘ [Passed with warning] が表示されているが、視覚的な変更/ネットワーク/自動修復がない場合
これは、mablがステップを完了するために別の操作方法 (例: javascript) を使用する必要があったことを意味します ([LOGS] の [mabl Activity] タブに表示)
2. スクリーンショット 📸
- 現在のスクリーンショット、ベースラインのスクリーンショット、それぞれを並べて比較
- スクリーンショットのズーム - スクリーンショットでズームしたい領域をクリック
- 強調表示 - スクリーンショット内の視覚的変化の強調表示を切り替え
うれしいポイント: 視覚的変化のミニレッスン
ピクセルベースの視覚的変化の検出には、2つの異なるタイプがあります。
1. 実行ごとの検出
現在の各スクリーンショットを最後に実行されたテストと比較します。
(テスト実行ごとに自動で比較)
2. 機械学習による検出
テストの直近の10～15回の実行を使用してベースラインを確立し、「静的」と見なされた領域がベースラインと異なるかどうかを強調表示します。ベースラインは、継続的に更新されます。
(プランの [Advanced Settings] で有効にし、テストを約10回実行する必要があります)
mablのビジュアルテストの詳細については、こちらをご覧ください
3. ログ 📋
- mabl Activity 📊 - ステップの成功または失敗におけるmablのプロセスの詳細が表示されます (また、[Passed with warning] の場合は行われた操作も表示されます)。
- Network 📡 - ステップ実行中にアプリケーションで行われたネットワーク呼び出しが表示されます。提供されたHARファイル内から特定のネットワーク呼び出しを検索します。
- DOM 📄 - ステップ実行中のDOMのスナップショットが表示されます。そのステップで特定の要素がDOMに現れたかどうかを検索します。
- Performance ⏳ - 特定のステップの記録されたすべての実行時間が表示されます。これは、ユーザーがアプリケーションUIの読み込み速度をどのように認識するかを示します。このスコアは低いほうが良好です。
ベストプラクティス
免責事項
ここで提示するヒントは、発生するテストの失敗の大半に対するガイドラインとして用意されていますが、すべての失敗を網羅するものではありません。
これらのプラクティスの中には、失敗のタイプによって異なるものもあります。
mablでテストを重ねていくうちに、自分やチームに合ったリズムや歩調が生まれてきます。 😎
ⓘテストに失敗したが、その理由がわからない場合は、サポートチームに連絡してください。mablアプリケーションの左下隅にあるボタン (以下の画像のようなボタン) をクリックすれば、いつでもチャットを開始できます。 👍
概要:
- 失敗から開始 ⛔️
- 逆方向に作業 ⏪
- 最後に成功したテストのコンテキストを確認 ⬅️ ✅
- 自分の手で失敗を再現 🔂
- mablサポートに連絡 🙂
それぞれ詳しく見ていきましょう。
ステップ1: 失敗したステップから開始 ⛔️
以下のステップ分析フレームワークを活用します。
- ステップの詳細を確認して、失敗に関する情報を収集します。
- スクリーンショットを確認して、アプリケーションの失敗時の状態を把握します。
- ステップに次のアイコンが表示されている場合:
- 視覚的変化 - 現在のスクリーンショットで強調表示されているピンクの視覚的変化に注目し、現在のスクリーンショットとベースラインを比較します。
- ネットワーク - [LOGS] の [Network] タブに移動し、ステータスコードを調べて (CMD+FまたはCTRL+Fを使用)、HARファイル内で特定のステータスコードを検索します。
- 自動修復 - [mabl Activity] タブに移動し、タイムラインを一番下まで表示すると、mablで見つけられなかった要素の詳細が表示されます。次に [DOM] に移動し、属性を検索します (CMD+FまたはCTRL+Fを使用)。
- ステップ上の要素のサムネイルを見て、それがスクリーンショット内でmablが操作したものと一致するかどうか、あるいはその要素がそもそもページに存在するかどうかを確認します。ここでは、ステップによって意図したことと、実行中に実際に起こったことを比較しています。
- mablアクティビティログを読み、mablがどのようにステップに失敗したか、プロセスを理解します
ステップ2: 逆方向に作業 ⏪
失敗する前のステップをクリックして、逆方向にたどっていき、各ステップでステップ分析フレームワークを使用して、何が起こって失敗に至ったのかを理解します。
ⓘスクリーンショット内の黄色の円を探し、そのステップの実行中にmablがどの要素を操作したのかを確認してください。
ステップ3: 最後に成功したテストのコンテキストを確認 ⬅️ ✅
結果ページ上部の [Time of run] の下にあるドロップダウンを使用して、同じテストの過去の実行を確認します。
スクリーンショットを表示して、動作を比較します。
簡単なヒント
仮想タブ
複数のテスト出力ページを表示する際は、仮想タブを使用することでテスト間を簡単に行き来できます。
ステップ4: 自分の手で失敗を再現 🔂
まず、テストを編集して、失敗を再現してみます。
次に、トレーナーを使用せずにアプリケーションにアクセスして、失敗を再現してみます。
ステップ5: mablサポートに連絡 🤗
mablアプリケーションの左下隅にあるチャットアイコンを使用します
次のステップ
概要
失敗を見つけた後のアプローチは、その失敗の性質によって異なります。
考えられる次のステップとしては、次のようなことを行うといいでしょう。
- 失敗の理由を追加する
- チームメイトにコメントを残す
- 結果やデータをチームで共有する
- Jiraチケットを作成する
それぞれ詳しく見ていきましょう。🤠
失敗の理由を追加する❗️
- ドロップダウンから、テストが失敗した理由として最も近いものを選択します。
探している理由がない場合は、[Other] を選択するか、ここから機能リクエストを送信してください。
ⓘワンポイントアドバイス
結果ページ (左側のナビゲーションバー) から、失敗の理由でフィルタリングできます。また、ダッシュボードから、過去30日間の各失敗の理由の割合を表示することもできます。
チームメイトにコメントを残す 💬
テスト出力ページにコメントを残すことで、チームメイトにコンテキストを伝えることができます。
コメント作成者の詳細と、コメントのタイムスタンプが表示されます。
結果またはデータのエクスポートによる伝達 📝
ダウンロードしてチーム内の必要な人と共有できるように、エクスポートする情報のタイプを選択します。
結果をPDFとしてエクスポートするには、[Edit] の横にある3つのドットをクリックします。
ⓘワンポイントアドバイス
失敗したステップに移動し、URLをコピーしてチームメイトと共有すると、チームメイトは失敗したステップに直接アクセスすることができます。
Jiraチケットを作成する 👾
Jiraインスタンスはそれぞれ微妙に異なるため、以下のヘルプドキュメントのリンクをクリックして、作成方法に関するさらに具体的な手順を確認してください。
Jiraサーバー統合 [ドキュメント]
まとめ
ここで学習した内容
mablのデバッグツールの概要、およびテスト結果のレビューと問題の切り分けに使用するデバッグツールの効果的な使い方。
次に必要な知識と技能
- チーム内で周知および理解されているテスト結果のレビューに関するプロセスを形成する
- これまでより迅速かつ効果的に厄介なバグを発見する 👾