Testablish を使って自動テスト

# Testablish とは
Testablish は[株式会社SRA](https://www.sra.co.jp/)で開発を行っているWebアプリの自動テスト支援ツールです。2018/10/10に[発売を開始](https://www.sra.co.jp/topics/topics2018/20181010.html)しました。
![testablish_color_01_trim.jpg](https://qiita-image-store.s3.amazonaws.com/0/309571/7fc3cc99-6d62-d2d4-7e61-cecffdbeb0d1.jpeg)

　Webアプリの自動テストといえばSeleniumを使って行うのがメジャーですが、Seleniumのテストコードをプログラミングする必要があります。このプログラミングをマスターしなければ様々なテストを記述することができません。また、作成したプログラムはアプリケーションの仕様変更が入ると動かなくなったり、プログラムの修正を行う際に処理内容が分かりづらく結構な工数をメンテナンスで必要とすることになります。
この課題を解決するツールがいくつかありますが、それぞれに得手不得手があり、現場の運用で機能的な不足を補っているのが現状では無いでしょうか。

# Testablishの特徴

 Testablishも上記のような課題を解決するために開発されたツールですが以下のような特徴があります。

- :point_up:**Webブラウザで利用可能**
　TestablishはNode.jsで作成されており、Webブラウザで利用することが可能です。共用サーバーにインストールすれば複数人で利用することが可能です。これによりテスト作成者のPCはそれほど高スペックのマシンは必要ありません。
![ログイン画面.png](https://qiita-image-store.s3.amazonaws.com/0/309571/0bab3391-46a2-daad-0936-6e4ae83459bc.png)

- :point_up:**操作キャプチャ**
    - "キャプチャ"とはブラウザ上の操作を記録することです。記録した操作内容を呼び出して再生することにより自動テストを行います。
    - この機能はいろいろなツールでサポートされておりますが、Testablishでは実行時の入力内容を変更してテストバリエーションを増やしたりしてテストケースを増やせるようにパラメータのパターンを外部ファイルから与える方法も提供しています。

- :point_up:**画面遷移グラフの自動生成**
    - キャプチャしたデータから画面遷移図(フローグラフ)を作成します。
    - キャプチャした操作でどの画面への遷移が行われたかがひと目で分かります。ページのスクリーンショットも記録されます。
![フロー図.PNG](https://qiita-image-store.s3.amazonaws.com/0/309571/0be44fe0-8fb0-d902-074d-d334312885ac.png)

- :point_up:**ページリポジトリ**
    - ページ内に配置されているオブジェクトを登録します。
    - この情報をもとにテストを組み立てることができます。これにより**アプリケーションが動いていなくてもテストを作成することができ**、ソフトウェア結合の段階ですぐに自動テストが行えるようになります。
![ページ情報.png](https://qiita-image-store.s3.amazonaws.com/0/309571/311eabd2-b2bd-f3d3-1470-7f9638a861c6.png)

- :point_up:**わかりやすいテスト編集画面**
    - GUIでテストの編集が行なえます。画面遷移を確認しながらどの画面でどの操作を行ってどのようなアサーションを実行するかをマウスの操作で編集できます。
![テスト編集画面.png](https://qiita-image-store.s3.amazonaws.com/0/309571/366d3497-0595-63fc-c32f-3a079a89e529.png)

- :point_up:**テストプログラムからの外部連携**
テスト編集での処理ステップの一つに**外部コマンドを呼び出す機能**があり、DBを初期化するためのコマンドなどを登録しておくことにより、繰り返しテストを実行できます。また、**Javascriptを呼び出すこともでき**、ページ内のエレメントに介入して、画面上の操作では実行できないようなパラメータを送出するテストも実施することができます。

# Testablish紹介動画
　Testablishの操作感を理解していただくために機能紹介の動画を作成しました。その一部を御覧ください。(音声は入っていません)

<blockquote class="twitter-tweet" data-lang="ja"><p lang="und" dir="ltr"><a href="https://t.co/uxTLNEQo7f">https://t.co/uxTLNEQo7f</a><a href="https://twitter.com/hashtag/selenium?src=hash&amp;ref_src=twsrc%5Etfw">#selenium</a> <a href="https://twitter.com/hashtag/testablish?src=hash&amp;ref_src=twsrc%5Etfw">#testablish</a></p>&mdash; Testablish (@Testablish1) <a href="https://twitter.com/Testablish1/status/1070251071035990019?ref_src=twsrc%5Etfw">2018年12月5日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

<blockquote class="twitter-tweet" data-lang="ja"><p lang="und" dir="ltr"><a href="https://t.co/Za3t1cT2oK">https://t.co/Za3t1cT2oK</a><a href="https://twitter.com/hashtag/selenium?src=hash&amp;ref_src=twsrc%5Etfw">#selenium</a> <a href="https://twitter.com/hashtag/testablish?src=hash&amp;ref_src=twsrc%5Etfw">#testablish</a></p>&mdash; Testablish (@Testablish1) <a href="https://twitter.com/Testablish1/status/1070251679570784256?ref_src=twsrc%5Etfw">2018年12月5日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

<blockquote class="twitter-tweet" data-lang="ja"><p lang="und" dir="ltr"><a href="https://t.co/o1L3gt6NX6">https://t.co/o1L3gt6NX6</a><a href="https://twitter.com/hashtag/selenium?src=hash&amp;ref_src=twsrc%5Etfw">#selenium</a> <a href="https://twitter.com/hashtag/testablish?src=hash&amp;ref_src=twsrc%5Etfw">#testablish</a></p>&mdash; Testablish (@Testablish1) <a href="https://twitter.com/Testablish1/status/1070251967094509568?ref_src=twsrc%5Etfw">2018年12月5日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

<blockquote class="twitter-tweet" data-lang="ja"><p lang="und" dir="ltr"><a href="https://t.co/MXrDcfbnG1">https://t.co/MXrDcfbnG1</a><a href="https://twitter.com/hashtag/selenium?src=hash&amp;ref_src=twsrc%5Etfw">#selenium</a> <a href="https://twitter.com/hashtag/testablish?src=hash&amp;ref_src=twsrc%5Etfw">#testablish</a></p>&mdash; Testablish (@Testablish1) <a href="https://twitter.com/Testablish1/status/1070252117313474562?ref_src=twsrc%5Etfw">2018年12月5日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

<blockquote class="twitter-tweet" data-lang="ja"><p lang="und" dir="ltr"><a href="https://t.co/Z8vykXpoYZ">https://t.co/Z8vykXpoYZ</a><a href="https://twitter.com/hashtag/selenium?src=hash&amp;ref_src=twsrc%5Etfw">#selenium</a> <a href="https://twitter.com/hashtag/testablish?src=hash&amp;ref_src=twsrc%5Etfw">#testablish</a></p>&mdash; Testablish (@Testablish1) <a href="https://twitter.com/Testablish1/status/1070252263795388416?ref_src=twsrc%5Etfw">2018年12月5日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

<blockquote class="twitter-tweet" data-lang="ja"><p lang="und" dir="ltr"><a href="https://t.co/Xk3q8sGgJF">https://t.co/Xk3q8sGgJF</a><a href="https://twitter.com/hashtag/selenium?src=hash&amp;ref_src=twsrc%5Etfw">#selenium</a> <a href="https://twitter.com/hashtag/testablish?src=hash&amp;ref_src=twsrc%5Etfw">#testablish</a></p>&mdash; Testablish (@Testablish1) <a href="https://twitter.com/Testablish1/status/1070252429604601856?ref_src=twsrc%5Etfw">2018年12月5日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

# Testablishのシステム構成
 Testablishを利用するための環境は以下の図の様になります。
![システム概要.png](https://qiita-image-store.s3.amazonaws.com/0/309571/6fc6b1ff-8b23-a59d-4d20-19794d213ccd.png)

- 動作環境
    - ブラウザ拡張(キャプチャプログラム)
        - CPU: Corei5 2.0GHz相当以上
        - メモリ: 4GB以上推奨
        - HDD: 512MB以上の空容量
        - OS: Windows10
        - プラウザ: Chrome33以降, IE11
    - サーバ
        - CPU: Xeon(2GHz以上)相当以上
        - メモリ: 8GB以上推奨
        - HDD: 15GB以上(ログの蓄積量に依存します)
        - Docker が動作する環境

サーバのスペックは蓄積するログやテストケースの量に依存します。
開発では 第4世代 Corei5 の 8GB HDD 500GB の程度のPCで十分に動作しています。

# Testablishの今後

- オープンソース
    - 基本機能に関してはオープンソースで配布する予定です。
- ページ情報(リポジトリ)を自動で登録する機能の追加
    - 各オブジェクトにIDを降ってわかりやすい日本語名を登録するなどページリポジトリ情報の定義をしっかりしておくと後々のテストケースのメンテナンスに役に立ちます。
    - しかしこの定義情報の登録は結構な労力を必要とします。
    - これをキャプチャしたログデータや画面モックからスクレイピングや自動判別するなどの機能で諸力できれば更に良いツールになります。
- テストケースを自動で生成する機能
    - ページの構成がわかればモンキーテストなどある程度のテストは自動で判別が可能です。
    - テストケースの自動生成が可能になればブク雑なビジネスロジックのテスト設計に集中することができます。
- アサーションを自動的に登録する機能
    - 上記同様検査内容をAIで作成できれば一定の品質の担保が自動的に行われることになり、省力化に繋がります。
- 英語版
    - 海外のユーザにも使ってもらえるように英語の対応を行います。
    - 日本の開発風土に合った機能実装を行っているのでどこまで受け入れられるかはわかりませんが。。

# 最後に
　Testablishを利用すればSeleniumによりテスト自動化は実現できますが、そのテストケース作成にいたるまでにはまだまだ相応の工数を掛ける必要があります。
　しかし、テスト自動化の実施に関しては無人で実施という計り知れないメリットがあります。
　現在、利用してもらっている企業様ではテスト設計作業の工数は2～3倍の工数がかかったが、テスト実施はほぼ0という実績が報告されています。
　みなさんも一度Testablishを使って自動テストを検討してみてください!