モバイルウェブテストの実行

シミュレートされたモバイルデバイスブラウザでテストを実行する方法は以下です。

  • 特定のモバイルデバイスを指定し、mablクラウド上でアドホック実行(Ad-hoc run)する
  • Planでモバイルウェブテストの設定を行う

シミュレートされたモバイルデバイスブラウザでテストを実行する方法は以下です。

  • 特定のモバイルデバイスを指定し、mablクラウド上でアドホック実行(Ad-hoc run)する
  • Planでモバイルウェブテストの設定を行う

📘

モバイルウェブテストはベータ提供中です

モバイルウェブテストはベータ版として提供中の機能になります。

アドホックで実行する方法

テストの詳細画面でRunボタンをクリックします。クラウド実行を選択し、指定したいモバイルデバイスの設定を行います。現状、このデバイス設定は、mablデスクトップアプリのローカル実行では利用できません。ご注意ください。

1724

mablデスクトップアプリで新しいテストを作成するときに、シミュレートするデバイスを指定できます。

自動実行

デプロイごとやスケジュールで設定されたタイミングで、モバイルウェブテストの自動実行も可能です。そのためにはPlanを作成し、モバイルデバイスの設定を行う必要があります。時間を節約するために、既存のPlanをコピーし、モバイルデバイス部分だけ修正する方法も有効でしょう。Planを設定するときに、テストをPCのウェブブラウザで実行するか、Chromeブラウザでシミュレートされたモバイルデバイスで実行するかを選択できます。Planには複数のモバイルデバイスを選択でき、mablは選択したデバイスごとにテストを実施します。

2584

Planでモバイルデバイス設定を行う。

テストが実行されると、mablはそれぞれのシミュレートされたモバイルデバイスのビューポートを自動的に設定してテストを実行します。その際に、テスト内ですでにビューポートが設定されている場合は無視します。

たとえば、テスト実行時のデバイス設定がiPhone 12になっている場合、テストのデフォルトのデバイス設定として、 1280 x 980 ビューポート(デスクトップブラウザ)に設定されているとしても、その設定は無視され、390 x844のビューポートを使用してテストが実行されます。mablは、ページ上のターゲット要素に自動スクロールしようとするため、ビューポートサイズごとに手動でスクロールを調整する必要はありません。PC用ブラウザとモバイル用ブラウザのナビゲーションやホバーアクションの違いに対応する場合はモバイルウェブテストの作成を参照ください。

モバイルウェブテストの結果確認

シミュレートされたモバイルデバイス設定を利用してテストを実行すると、通常のテストと同じく、テストのResultページに結果が表示されます。モバイルウェブテストの結果には、モバイルブラウザアイコンが表示され、そのアイコンにカーソルを合わせると、正確なデバイス構成を確認できます。

1994

シミュレートされたモバイルデバイスの実行結果の例。

特定のテスト実行結果をクリックすると、ヘッダーパネル内にモバイルデバイス情報も表示されます。

🚧

ベータ版における既存課題

  • ビューポートを設定するステップの表示が、実際に利用されている値と異なる場合があります
  • 通常は、テスト実行時のスクリーンショット内に、そのステップで対象となる要素が強調表示されますが、モバイルウェブテストの場合、現状強調表示されません