Selenium IDE の代わりに Silk WebDriver を使ってみる

#はじめに
ご存知のとおり、Firefox の拡張機能が [Web Extensions](https://developer.mozilla.org/en-US/Add-ons/WebExtensions) へ移行するに伴い、この API と互換性のない Selenium IDE は [Firefox 55 から動作しなくなりました](https://seleniumhq.wordpress.com/2017/08/09/firefox-55-and-selenium-ide/)。現在、この問題に対処するため、各社、各団体によってさまざまなソフトウェアの開発が進められています。
[Silk WebDriver](https://www.microfocus.com/ja-jp/products/silk-portfolio/silk-webdriver/) は、このムーブメントに従い Micro Focus で開発が進められているソフトウェアです。Micro Focus では、[Silk Test](https://www.microfocus.co.jp/products/silk/silktest/) という商用のテスト自動化ソフトウェアの販売を長年続けてきました。Silk WebDriver は、この Silk Test の遺伝子を引き継ぎながら、Selenium IDE の代替として、テスト自動化エンジニアが Selenium スクリプトを効率よく作成、実行できるようにするために開発されたフリーのソフトウェアです。

#Silk WebDriver をダウンロードする
最初に書いたとおり、Silk WebDriver はフリーで使用できます (一部有料の機能もあります)。ダウンロードは、Micro Focus の [Silk WebDriver ページ](https://www.microfocus.com/ja-jp/products/silk-portfolio/silk-webdriver/)を開き、右上にある [Free Download] ボタンをクリックするだけで自動的に始まります。ユーザー登録なども (この時点では) 必要ありません。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/be146e68-936a-4850-4685-f525c8f5f1cc.png)

ダウンロードできたら、早速インストールしてみましょう。

#Silk WebDriver をインストールする
現在、Silk WebDriver がサポートしている OS は Windows のみです。ダウンロードしたセットアップ ファイルを Windows で実行します。Silk WebDriver は英語版のみとなっていますので、セットアップのメッセージもすべて英語ですが、聞かれることは使用許諾契約に同意するかどうかと、インストールのパスだけです。このセットアップによって、Selenium や WebDriver など必要なソフトウェアはすべて自動的にインストールされますので、面倒な設定等も不要です。インストールが終わったらすぐにスクリプトの記録、再生を試すことができます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/41fd4d2b-5067-270f-4246-d6a02a8000e4.png)

#Silk WebDriver を起動する
インストールが完了すると、デスクトップに Silk WebDriver というアイコンが作成されます。このアイコンをダブルクリックすると Silk WebDriver が起動して開始画面が開きます。最初に起動したときには、Welcome ダイアログも同時に開きます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/514407af-9934-2d04-6f6f-0ba10e278518.png)

Silk WebDriver には 3 つの実行モードがあります。

**1. 非ログイン モード**
Micro Focus Build Portal にログインせずに使用するモードです。スクリプトの記録と再生はできますが、保存することも、プログラム言語にエクスポートすることもできません。
**2. ログイン モード**
Micro Focus Build Portal にアカウントを作成し、ログインして使用するモードです。Silk WebDriver のすべての基本機能を使用できます。アカウントの作成は無料なので、このモードでの使用がお勧めです。
**3. Silk WebDriver Pro モード**
月額料金の発生する有料モードです。基本機能に加え、Edge、Mobile ブラウザー (Android) のテストがサポートされています。30日間の評価期間があります。

この記事では、記録と再生を行うだけなので、とりあえず「非ログイン モード」で進めます。[Not now, maybe later] をクリックしてダイアログを閉じます。そのほかの機能の紹介は別の記事で行いたいと思います。

開始画面には、[What's New]、[News & Community]、[Resources] のタブがあります。オンライン ヘルプは、[Resources] > [Help] から開くことが出来ます。同じく [Resources] タブにある [Community] から開くページは Silk WebDriver のコミュニティ サイトで、質問や要望など投稿することが出来ます (日本語での投稿も OK です)。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/f750d352-4f1a-e584-64cf-0c1b6878c06e.png)

#Silk WebDriver でスクリプトを記録する
それでは、記録を開始してみましょう。開始画面の [Start] グループに [Record new script] というリンクがあります。ここをクリックすると、[Select Browser] ダイアログが開きます。このダイアログには、そのマシンにインストールされているブラウザーが自動的に検出されて表示されるので、記録に使用するブラウザーを選択します。無料のモードでは Chorme と Firefox がサポートされていますので、どちらかを選択してください。また、[Navigate to URL] フィールドにはブラウザーの起動時に最初に開くページを指定します。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/c86f1f90-cd15-70c0-9941-ef36a82c7802.png)

[OK] ボタンをクリックすると、Silk WebDriver サイドバーとブラウザーが起動し、[Navigate to URL] で指定した URL が自動的に開きます。サイドバーの [Recorded Actions] には記録したブラウザー操作が表示されます。最初の状態では、指定した URL を開く操作が記録されています。サイドバー上部には、ブラウザーを選択するコンボボックスと、エクスポートするときに使用するプログラム言語とテスト フレームワークを選択するコンボボックスがあります。サイドバー下部には、5 つのボタンが配置されており、それぞれ次の機能に対応します。

- ヘルプを開く(![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/8e4380d5-1a08-b3d1-4156-e191d9cecc90.png))
- 記録を開始する(![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/65ed1c34-eec7-65b0-5dad-400df94c8566.png)
)
- 記録した操作を再生する(![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/6e6dc922-1a24-2333-0fd0-4c1bb8ccfd9c.png)
)
- 記録を一時停止する(![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/d8b0a869-b4d4-9500-c2fd-d8b0b82228cf.png)
)
- 記録を停止する(![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/5556b932-f508-5ca2-6cfd-2621acdded05.png)
)

記録の一時停止は、一時的にブラウザーに対する操作を記録させたくないときに使用します。記録の停止をクリックすると、記録したスクリプトの保存を確認するダイアログが開き (ログインしていないため現時点ではスクリプトの保存はできません)、サイドバーが閉じ、開始画面に戻ります。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/9d1b90aa-21eb-bf44-aff2-ff4557713ea0.png)

ブラウザーには、上部に Welcome メッセージが表示されます（最初のみ）。 [OK, GOT IT] ボタンをクリックして閉じましょう。右下には、記録中であることを表すブラウザー アイコンとカーソルの座標が表示されます。ブラウザー アイコンをクリックすると、[Choose Action] ダイアログが開き、戻る、進むなどのブラウザー操作を記録することができます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/4c8a5b10-233b-43e4-afd2-c6635f2a36e8.png)

操作の記録は、ブラウザーに対して行った操作が自動的に記録されます。マウス カーソルを移動させると、現在記録の対象となる
 HTML 要素が緑色の矩形領域でハイライトされます。基本的にマウスの左クリックを使用し、デフォルトの操作を記録していきます（リンクをクリック、チェックボックスの切り替えなど）。マウスの右クリックを使用すると、[Choose Action] ダイアログが開き、その HTML 要素に対して実行できる操作を選択したり、パラメータを指定できます。 テキスト フィールドをクリックした場合は、入力するテキストをパラメータで指定する必要があるため、デフォルトで [Choose Action] ダイアログが開きます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/2ca2518f-f200-5e1c-9f16-d5f1beca3763.png)

##記録するシナリオ
[日本Seleniumユーザーコミュニティ](http://www.selenium.jp/)で作成されたテスト サイトをお借りしてテストの記録・再生を行います。以下のような予約情報で予約を取り、料金が正しく表示されていることを確認します。

- 宿泊日: 2018 年 1 月 27 日（土）から 1 泊（7000 + 土日 25% 増し）
- 人数: 2 人
- 朝食バイキングあり (一人につき 1000 円増し)
- 昼からチェックイン プラン (一人につき 1000 円増し)
- 名前: 日本 太郎さん
- 料金 (7000 * 1.25 + 1000 + 1000) * 2 = 21500 円

##記録したスクリプト
予約フォームに上記の内容を入力し、[次へ] ボタンを押すまでの操作を行った結果が以下のスクリーンショットになります。既存の値があるテキストの入力では、内容を消去するために Clear も記録しています。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/a9ca38ab-ba12-802b-ef87-4859db06ba17.png)

では、続いて検証の記録を追加します。検証したいところにマウス カーソルを移動して Ctrl + Alt キーを押すと、[Verify Properties] ダイアログが開きます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/3fc726f0-e9f3-c6ff-b58f-77242910312e.png)

ハイライトした要素のプロパティが一覧表示されているので、検証したいプロパティに対応するチェックボックスをオンにします。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/9124aa5a-1151-a141-c621-f378e637093d.png)

[OK] ボタンをクリックすると、サイドバーに次のような検証操作が追加されます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/eec28818-5a9b-0eb9-b07e-07b5b20093e1.png)

#記録したスクリプトを再生する
記録したスクリプトの再生も簡単です。記録したすべての操作を再生する場合は、サイドバーの [Recorded Actions] を選択した状態で [再生] ボタンをクリックします。また、個々の操作を選択して再生することもできます。たとえば、宿泊日の Clear 操作だけを選択して、[再生] ボタンをクリックすると、Clear 操作だけが実行され、次のように各フィールドが空になっていることが分かります。 このとき、サイドバーでは、選択して再生した操作の次の操作が選択された状態になっています。つまり、[再生] ボタンをクリックすれば、その選択された操作が実行されるため、ステップ実行を行うことが出来ます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/7994347c-ccf3-247b-a3b5-a073e9631e32.png)

さらに、クロスブラウザー テストも簡単に行えます。記録したテストを Firefox で再生する場合は、サイドバー上部のブラウザー コンボボックスから Firefox を選択し、[Recorded Actions] を選択した状態で、[再生] ボタンをクリックするだけです。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/197245/1bdf312c-78a1-5b83-d91e-e08665240624.png)

#おわりに
記録したスクリプトの保存するには、Silk WebDriver をログイン モードで使用する必要がありますが、記録・再生を試してみるだけなら、非ログイン モードでも十分感じがつかめると思います。時間が取れれば、次回はログイン モードを使用して、プログラム言語にエクスポートして使用する手順とかを紹介したいと思います。

**2017 年 12 月 4 日追記**
記事の続きを書きました：『[Silk WebDriver を使用して Selenium Java binding コードを作成する](https://qiita.com/masayukii/items/a7550772a3372f281765)』