ノーコードで無料でブラウザテストを自動化する方法を模索して、Selenium IDEでテストを自動実行してみました。

いろいろ苦戦するポイントがあったので解消法も書いていきます。

Selenium IDEについて

Selenium IDEはブラウザテストをGUIで設定できるツールでChromeの拡張機能で提供されています。（昔はFirefoxのプラグインでした）

Chromeウェブストアからインストールできます。Selenium IDE – Chrome ウェブストア (google.com)

インストールして起動するとSelenium IDEのウィンドウが開きます。 詳細は割愛しますが、ブラウザでWeb画面を操作して、その操作を記憶します。その後、下図のような画面でカスタマイズして実行すれば、ブラウザ操作を自動的に行ってくれます。

通常のSeleniumと違ってコードを書く必要がなく、画面からGUIで設定できるので大分楽です。

作成したテストシナリオをコマンドラインから実行する

Selenium IDEで作成したシナリオをコマンドから実行することができます。

公式サイトでも説明ページがあります。Command-line Runner · Selenium IDE

ただ、公式サイト通りにしてもうまくいかなかったので、セットアップ手順を記載します。 （Windowsでの手順です）

1. nodejsをインストール（最新バージョンでOK）ダウンロード | Node.js (nodejs.org)
2. npmでselenium-side-runnerをインストール

npm install -g selenium-side-runner

3. npmでchromedriverをインストール

npm install -g chromedriver

4. chromedriverのlibディレクトリを環境変数のPathに追加（★これが大事） 環境によって場所が違いますが、chromedriverのlib内のchromedriverにパスを通す 「C:\Program Files (x86)\Nodist\bin\node_modules\chromedriver\lib\chromedriver」

これで準備OKです。コマンドプロンプトやpowershellで以下のコマンドを実行するとブラウザが立ち上がりテストが実行されます。 .sideファイルは、selenium IDEで保存したファイルを指定します

> selenium-side-runner /path/to/your-project.side

苦戦していた時の備忘

公式サイトの手順ですと、chromedriverにパスが通っておらず、以下のようなChromeDriverが見つからないとエラーが出ます。

PS C:\Users\shint\Desktop\seleniumIDEtest> selenium-side-runner .\test.side
info:    Running ./test.side
 FAIL  ./DefaultSuite.test.js
  ● Test suite failed to run

    The ChromeDriver could not be found on the current PATH. Please download the latest version of the ChromeDriver from http://chromedriver.storage.googleapis.com/index.html and ensure it can be found on your PATH.

      at new ServiceBuilder (C:\Program Files (x86)../../../../../Nodist/bin/node_modules/selenium-side-runner/node_modules/selenium-webdriver/chrome.js:232:13)
      at getDefaultService (C:\Program Files (x86)../../../../../Nodist/bin/node_modules/selenium-side-runner/node_modules/selenium-webdriver/chrome.js:321:22)
      at Function.createSession (C:\Program Files (x86)../../../../../Nodist/bin/node_modules/selenium-side-runner/node_modules/selenium-webdriver/chrome.js:694:44)
      at createDriver (C:\Program Files (x86)../../../../../Nodist/bin/node_modules/selenium-side-runner/node_modules/selenium-webdriver/index.js:155:33)
      at Builder.build (C:\Program Files (x86)../../../../../Nodist/bin/node_modules/selenium-side-runner/node_modules/selenium-webdriver/index.js:662:16)
      at buildDriver (C:\Program Files (x86)../../../../../Nodist/bin/node_modules/selenium-side-runner/node_modules/jest-environment-selenium/dist/index.js:66:17)
      at WebdriverEnvironment.setup (C:\Program Files (x86)../../../../../Nodist/bin/node_modules/selenium-side-runner/node_modules/jest-environment-selenium/dist/index.js:37:32)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        2.931s
Ran all test suites.

chromedriverのbinフォルダに環境パスを加えても見つからないエラーは解消しませんでした。（結局、binではなくlib配下をパスに追加する必要がありましたので）

いろいろ調べてみると、chromedriverのあるフォルダでテストを実行すればよいとの記述があったので試してみるとテストが見つからない旨の別のエラーとなります。

PS C:\Users\shint\Desktop\seleniumIDEtest\node_modules\chromedriver\bin> selenium-side-runner .\test.side
info:    Running ./test.side
No tests found, exiting with code 1
Run with `--passWithNoTests` to exit with code 0
No files found in C:\Users\shint\Desktop\seleniumIDEtest\node_modules\chromedriver\bin\side-suite-test.
Make sure Jest's configuration does not exclude this directory.
To set up Jest, make sure a package.json file exists.
Jest Documentation: facebook.github.io/jest/docs/configuration.html
Pattern:  - 0 matches

テスト用のファイル自体は読み込まれていたのと、chromedriverのエラーでもなかったので、謎です。

その後、いろいろ調査していると、chromedriverのlib配下のchromedriverにexeファイルがあり、そちらに環境パスを追加する必要がありました。

テストを定期実行して失敗したらメールで通知する

ここまでで紹介したselenium IDEのcli実行を使ってブラウザテストを自動実行して、失敗した場合はメールで通知するなどを実装することができます。

以下のようなスクリプト（.batまたは.ps1ファイルなど）を作り、selenium-side-runnerの戻り値によって結果を判定します。テストに失敗した場合は戻り値がfalseとなります。

# 本スクリプトをwindowsスケジューラで定期実行
selenium-side-runner .\test.side

if($?) {
  echo "OK"
}else{
  echo "NG"
  # テスト失敗時はgmailなどで結果送信（cscriptでvbsのメール送信スクリプトを呼び出し）
}

gmailを使ってSMTPでメール送信するスクリプトは割愛しますが、VBScriptを使えば簡単に記述できるので、以下を参考にvbsファイルを作り、cscriptで呼び出せばOKです。【Excel/VBA】Gmailを利用したメール送信プログラム – (O+P)ut (mtioutput.com)

gmailの設定でセキュリティを弱めておく必要があるので事前に設定しましょう。

以上のスクリプトをWindowsのスケジューラから定期実行すればブラウザテストでのシステム監視が実現できます。