T-DASHのデバッグ機能が便利だった件

# はじめに

テスト自動化は、現代のソフトウェア開発プロセスにおいて不可欠な要素となっています。自動化により、開発者とテストエンジニアは反復的なテスト作業から解放され、より創造的なタスクに集中できるようになります。しかし、この進歩の背後には、しばしば無視されがちな大きな課題が潜んでいます。それは、テストスクリプトの継続的なメンテナンスの必要性です。

テストスクリプトは、ソフトウェアのコードが変更されるたびに更新されなければなりません。これは、スクリプトの修正、再実行、結果の確認という繰り返しのプロセスを伴います。この反復的なプロセスは、予想以上に手間がかかり、時間を消費する作業です。さらに、この作業はテスト自動化の推進を遅らせ、開発サイクルの遅延を引き起こす原因となることがあります。

この記事では、T-DASHの「デバッグ実行」機能を使って、どのようにして効率的にスクリプトをメンテナンスしテスト自動化を進めることができるのか、その具体的な方法について解説します。

# TL;DL

* デバッグ機能で自動テストを終了せずにメンテナンスできる。
* 自動テストが失敗したら、自動で一時停止しメンテナスできる。
* ソースコードのデバッグと同様にステップイン、アウト、ブレークポイントが使える。
* できること
  * <font color="orange">操作の追加　〇できる（デバッグ中はできない）</font>
  * <font color="green">操作の修正　◎できる</font>
  * <font color="orange">操作の削除　〇できる（デバッグ中はできない）</font>
  * <font color="red">画面項目の追加　▲できない</font>
  * <font color="green">画面項目のパスの修正　◎できる</font>
  * <font color="red">画面項目の削除　▲できない</font>

![01-1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/82919dc9-3304-fa9a-e26a-1d97aa3f4c6e.png)

スクリプトの修正から再実行、結果の確認に至るプロセスは、しばしば効率の問題を抱えます。特に、多数のテストケースを実行した後でスクリプトの不具合が発覚した場合、修正後にすべてのテストケースを最初から再実行する必要があります。この繰り返しの過程で感じる失望、落胆、虚しさは計り知れないものがあります。それは、時間と労力が無駄になったかのような感覚を伴い、効率性とモチベーションに影響を及ぼすことがあります。

T-DASHは『デバッグ実行』機能を搭載しており、自動テストの操作や画面項目のパスの修正をテストを終了させることなく行えます。この機能により、テストを一時停止し、必要な修正を加えた後、その場で再開することが可能です。この柔軟性は、テストプロセスの効率を大幅に向上させ、先に述べたような失望や虚しさを感じることなく、スムーズなデバッグ作業を実現します。




# 準備するもの

* T-DASHをセットアップしたPC
  * Windows10 Pro
* 保守するテストの準備
  * https://service.valtes.co.jp/t-dash/function/tutorial/testexecution_vol_001
  * このチュートリアルと同じシナリオを作成しておきます。
:::note
最後のエラーメッセージ
・2023/12/2時点で「メールアドレスまたはパスワードが誤っています。」に変わっているようです。ちょうどいいので **この誤りをデバッグ機能で修正** します。
:::

![02-1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/1012a5ac-6cf8-898d-422c-4872ac2b85d4.png)


画面定義の「ログインページ」の内容です。以下をコピペで貼り付けます。
※以下の内容は2023/12/2時点のものです。

|要素名|値|要素画像のパス|
|---|---|---|
|url|https://mypage.quintee.io/login| |
|メールアドレス|//input[@id="username"]| |
|パスワード|//input[@id="password"]| |
|ログイン|//button[@id="login-button"]| |
|エラーメッセージ|//p[@class="text-danger"]| |



# 詳細

## デバッグの流れ

自動化テストの実行においては、対象システムの仕様変更や改良がしばしば挑戦をもたらします。この文書では、そのような変更によって生じる三つの一般的なテスト自動化の失敗パターンを取り上げ、それらに効果的に対処するためのデバッグ機能の活用方法を詳述します。

1. テスト手順を修正する方法
2. 画面要素のパスを修正する方法
3. テスト手順を追加・削除する方法

デバッグ画面の使い方について

![03-0.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/7c88c563-3434-d1df-5998-649b2ba8c77b.png)

* ブレークポイントやステップインなどの基本的なソースコードのデバッグ機能をもっています。
* 「失敗したら自動で止まる」はとても便利です。実行して失敗する前にブレークポイントを設定しての流れが不要です。

## 1. テスト手順を修正する方法

システムの改修や改良により、表示文言が変更されることがあります。準備したテストを実行すると、テストケースにあるエラーメッセージが変更されたことにより、自動テストが失敗となりますので、そちらをデバッグ機能で修正します。

![03-1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/36e0a712-3271-49bc-753a-a0062bd06726.png)

T-DASHのテストスイートの画面を開きます。

![03-2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/5f7b18ee-2e1d-0037-3ce7-d01fce49b351.png)

『虫のアイコン』をクリックすると、「テストデバッグ実行」画面を表示します。

![03-3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/fed8327c-c1ff-1a60-2620-8f4d7a859e1f.png)

デバッグ実行をクリックします。

![03-4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/d4c2c487-2cbd-ee8c-5127-1b643e4a8698.png)


「エラーで止まりました。OK」のアラートが表示されますので、「OK」をクリックします。

![03-5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/cda3dae3-5663-3279-8979-575a7f14e665.png)



* 設定値のメッセージをクリックして、編集モーダルを表示します。
* 編集モーダルのテキストエリアに正しいメッセージ「メールアドレスまたはパスワードが誤っています。」を入力します。（※この修正が想定した期待結果になっていることが前提です。**バグを見逃すための修正にならないように注意してください。**）
* 「変更」ボタンをクリックします。

![03-6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/f0cb8685-e60b-adc0-c997-13811ec7e532.png)


「再開アイコン（▶）」をクリックします。

![03-7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/a4ca2b9b-9ab5-41bc-3f04-d51f4d3ffd33.png)

デバッグ終了ましたの「OK」をクリックし、右上の「×閉じる」をクリックします。


![03-8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/4b7c0090-e4d6-6fc4-5f8e-03b90182c816.png)


確認メッセージの「T-DASHへ反映する」をクリックします。

![03-9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/8ced223e-7ab3-e786-e502-60431b864a8b.png)



最後の検証するメッセージが書き換わっていることが確認できます。メンテナンスはこれで終了です。


## 2. 画面要素のパスを修正する方法

システムの改修や改良により、画面要素のパスが変更されることがあります。パスの変更により、自動テストが失敗となりますので、そちらをデバッグ機能で修正します。

### 前準備

システムが改修されたとして、画面定義の画面を開き、ログインページのメールアドレスの値を `//input[@id="username"]` から `//input[@id="email"]` に変更します。

![04-1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/0dc1d759-b20d-5a64-4c68-2b70a599e898.png)

### デバッグ実行
T-DASHのテストスイートの画面を開きます。

![03-2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/5c19e3bd-1160-b9d0-d26a-a1ad41b2ab45.png)

『虫のアイコン』をクリックすると、「テストデバッグ実行」画面を表示します。

![03-3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/8c16efb6-35ce-d6f9-bda5-4c802875b431.png)

デバッグ実行をクリックします。

![04-4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/38da3d77-8b43-715d-f9c7-a15ca4b495fc.png)

「エラーで止まりました。OK」のアラートが表示されますので、「OK」をクリックします。

![04-5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/3ab26882-4ba5-a04a-a814-f503cbc09a01.png)


* 画面・要素の「ログインページ / メールアドレス」をクリックして、編集モーダルを表示します。
* 編集モーダルのテキストエリアに正しいパス「//input[@id="username"]」を入力します。（パスはChrome DevToolsを使って自力で取得します。キャプチャは使えないようです。）
* 「保存」ボタンをクリックします。
* 「変更」ボタンをクリックします。

![04-6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/b6de6c09-8a37-d9e4-4b50-66c304eb8615.png)

「再開アイコン（▶）」をクリックします。

![04-7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/2608140d-5b89-8f81-39ee-c173fd2207d8.png)

デバッグ終了ましたの「OK」をクリックし、右上の「×閉じる」をクリックします。

![04-8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/91fdcdb3-bee7-e2ef-aefb-a8d992acf4db.png)

確認メッセージの「T-DASHへ反映する」をクリックします。

![04-9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/1226b981-a4f0-3f8c-ea44-75e25b411336.png)

画面定義のログインページのメールアドレスの値が書き換わっていることが確認できます。メンテナンスはこれで終了です。


## 3. テスト手順を追加・削除する方法

:::note warn
このメンテナンスは、自動テスト実行中にできません。できるように機能を追加してほしいです。
:::

デバッグ中に修正ができませんので、これからのアップデートによりできるようになると信じて、細かい操作は割愛します。

![05-1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3641304/8ca5d574-e4e6-020b-ac59-09d8d1c7ad63.png)

デバッグ実行中ではないのであれば、テストスイート画面で編集することと変わりありません。

# ふりかえり

この価格帯のツールで、デバッグ機能を持っていることには驚きでした。惜しむらくは、テスト手順の追加や削除がデバッグ中にできないことです。これができれば、自動テストのメンテナンスが劇的に楽になります。いまの機能でも多少は楽なのですが、ある程度メンテナンスしてからの動作確認で微修正といった使い方に限られます。

また、この記事では、各ケースを一つずつメンテナンスしていますが、多数のケースを一度に処理し、メンテナンスすることが可能な点を考慮すると、この機能は非常に強力であると感じます。

## フィードバック

機能追加を期待してフィードバックを書きます。

* デバッグ中にテスト手順を追加できるようにしてほしい
* デバッグ中に不要なテスト手順を削除できるようにしてほしい
* デバッグ中にテスト手順を移動・入れ替えできるようにしてほしい
* デバッグ中に画面要素を追加できるようにしてほしい
* デバッグ中に画面要素を削除できるようにしてほしい（これはできなくても）
* 画面要素の値を変更するときに、画面キャプチャの機能を使いたい（私はxpathをDevToolを使って、自身でとってくるので無くても問題ないですが、他のメンバーに使ってもらうときには、あると良いなと思いました）

# さいごに

T-DASHは『デバッグ実行』機能を搭載しており、自動テストの操作や画面項目のパスの修正をテストを終了させることなく行えます。この機能により、テストを一時停止し、必要な修正を加えた後、その場で再開することが可能です。この柔軟性は、テストプロセスの効率を大幅に向上させ、先に述べたような失望や虚しさを感じることなく、スムーズなデバッグ作業を実現します。

本当にこの通りだと思います。これからの機能アップデートに期待しています。

# 参考資料

* https://service.valtes.co.jp/t-dash/function/tutorial/testexecution_vol_001
* https://service.valtes.co.jp/t-dash/function/tutorial/test_debug_vol_001