JavaScript の Selenium 実行環境 (Node.js (Mocha) から Selenium 実行)

JavaScript の Selenium 実行環境の構築する
Selenium のエクスポートでも選べる JavaScript のテストフレームワーク の Mocha を使ってやってみる
作った環境で使ったバージョンと手順の大枠はこんな感じ

• 環境、バージョン
  • Windows11
  • Node.js v18.15.0
  • npm v9.5.0
  • mocha v10.2.0
  • selenium-webdriver v4.11.1
  • chromedriver v116.0.0
• 手順
  1. Node.jsインストール
  2. Selenium実行環境構築
     2-1. Mocha, selenium-webdriver, chromedriver インストール
     2-2. 実行モジュール作成、実行

Node.jsインストール

1. Node.js インストーラー取得(LTSの方を選択)
   https://nodejs.org/
2. インストーラ実行
   画面に従い進める、許可などは確認して同意、はいを選択
   途中でコマンドプロンプト、PowerShell 上がってくるので画面に従いキー入力
   Warning とか出ても気にしないでOK
3. インストール確認
   コマンドプロンプト or Powrshell で以下を入力してバージョン確認

   # Node
   node --version
   # Node Package Manager
   npm --version
   

Selenium実行環境構築

Mocha, selenium-webdriver, chromedriver インストール

1. 適当なフォルダを作る
   C:\seleniumwork
2. コマンドプロンプト or Powrshell で作ったフォルダに移動

   cd C:\seleniumwork
   

3. Mocha をインストール（以下のコマンド実行）

   npm i mocha
   

4. selenium-webdriver をインストール（以下のコマンド実行）

   npm i selenium-webdriver
   

5. chromedriver を をインストール（以下のコマンド実行）

   npm i chromedriver
   

6. 作成された package.json の確認
   C:\seleniumwork\package.json

   {
     "dependencies": {
       "chromedriver": "^116.0.0",
       "mocha": "^10.2.0",
       "selenium-webdriver": "^4.11.1"
     }
   }
   

実行モジュール作成、実行

1. フォルダの中に JavaScript test.js を作る
   Selenium IDE を使ってエクスポートしたファイルでやってもOK
   サンプルとして Google検索して実行するまでの script は以下

   C:\seleniumwork\test.js

   const { Builder, By, Key, until } = require('selenium-webdriver')
   const assert = require('assert')
   
   describe('test', function () {
     let driver
     let vars
     beforeEach(async function () {
       driver = await new Builder().forBrowser('chrome').build()
       vars = {}
     })
     afterEach(async function () {
       await driver.quit(); // ここをコメントアウトでブラウザを閉じなくなる
     })
     it('test', async function () {
       await driver.get("https://www.google.com/")
       await driver.findElement(By.name("q")).sendKeys('test')
       await driver.findElement(By.name("q")).submit()
     })
   })
   

2. package.json に実行スクリプト追加

   C:\seleniumwork\package.json

   {
     "dependencies": {
       "chromedriver": "^116.0.0",
       "mocha": "^10.2.0",
       "selenium-webdriver": "^4.11.1"
     },
     "scripts": {
       "test": "mocha test.js --timeout 0"
     }
   }
   

3. コマンドプロンプト or Powrshell で作ったフォルダに移動

   cd C:\seleniumwork
   

4. テスト実行（以下のコマンド実行）

   npm run test
   

5. Chromeが上がってきて処理が動けばOK