ローコードテスト自動化ツール T-DASH

手動で画面定義を作成しよう

はじめに

T-DASHでは、カンタンに「画面定義」を作成できるように、キャプチャツール「t-dash-capture-tool」を提供してます。
キャプチャツールの使い方はコチラ
しかし、キャプチャツールではXPathを取得できない場合もあります。
こうしたケースでは、手動でXPathを取得し「画面定義」を作成します。

本ページでは、手動によるXPathの取得および設定方法について説明します。

ゴール

・Chromeのデベロッパーツールを使用してXPathを取得できる
・取得したXPathを使用して「画面定義」を設定できる

前提

・テスト対象WebページのURLが存在する
・画面構成が大まかにFixしている
・画面名とURLが登録されている

詳細

  1. 画面定義 > 登録済みの画面名をクリックする
  2. スプレッドシートに定義したい画面の要素を手動で入力する
  3. 入力した要素のXPathを手動で取得し、値に入力する
    (XPathの取得方法は、下記「Chromeのデベロッパーツールを使用してXPathを取得する方法」を参照)
  4. 「保存する」ボタンを押下する

Chromeのデベロッパーツールを使用してXPathを取得する方法

  1. XPathを取得したい画面を表示する
  2. 開発ツールを表示する (Windowsでは「F12」もしくはCtrl + shift + I、Macでは「option」 + 「command」 + 「i」を押下する)
  3. 開発ツールにて矢印アイコンをクリックする
  4. 左側のページから、XPathを取得したい要素をクリックする(要素の背景色が変わる)
  5. 要素をクリックすると、右側の開発ツールで該当するHTMLが選択される
  6. 選択されたHTML上で、右クリックし、コンテキストメニューから「コピー > XPathをコピー」をクリックする

    ※ 要素のXPathが取得できたため、T-DASHのスプレッドシートの該当箇所へコピー&ペーストで貼り付けします

正しくXPathが取得できているか確認しよう

ChromeのデベロッパーツールでXPathを取得後、正しいXPathが取得できているか確認しましょう。

(前提)
・「Chromeのデベロッパーツールを使用してXPathを取得する方法」でXPathを取得していること

(手順)

  1. デベロッパーツールを表示させ、赤枠上で「Ctrl+F」キーをする
  2. 検索ボックスに、取得したXPathをコピー&ペーストする
    ※ 必要に応じて、取得したパスの先頭に「/」を追加する


  3. HTMLの該当箇所が黄色でハイライトされることを確認する(正常に取得できている)
  4. 検索ボックスに貼り付けた内容がユニーク(1/1)になっていることを確認する
    (ユニークになっていない場合は、指定する属性を増やすか、他の親属性などを追加してユニークにする)