ブラウザを自動で操作する例|Node.jsでSeleniumを利用する方法

Seleniumはブラウザ操作を自動できるライブラリ。
今回は、Seleniumを利用できるnpmのパッケージで、Google Chromeを操作する簡単な例となります。
また、npmはすでにインストールされている前提としています。npmのインストールやコマンドについては以下のリンク先を参考にしてみてください。
【npm】Seleniumでブラウザ操作を自動化する例
以下、Node.jsでSeleniumを利用し、ブラウザ操作を自動化する流れとなります。
package.jsonを作成
作業フォルダをプロジェクトとして作成します。
そして、プロジェクトの直下にcdコマンドで移動し、以下のコマンドでpackage.jsonを作成します。
npm init -y
selenium-webdriverをインストール
Seleniumを利用できるnpmパッケージ「selenium-webdriver」を、以下のコマンドでインストールします。
npm install selenium-webdriver -D
ブラウザドライバーをインストール
ブラウザを自動操作できるブラウザドライバー(バージョンは最新の安定版)をインストールします。
また、パソコンで利用しているブラウザも、ブラウザドライバーと同じバージョンに更新する必要があります。
Chromeのバージョンを確認する方法は、以下のリンク先を参考にしてみてください。
今回の例では、次のいずれかの方法でChromeのブラウザドライバーをインストールします。
手動でインストールする場合
手動でChromeのブラウザドライバーをインストール場合は、以下のリンク先から利用するブラウザドライバーのファイルをダウンロードします。
http://chromedriver.storage.googleapis.com/index.html
ダウンロードしたファイルを展開すると、chromedriverファイルが作成されます。例では、そのファイルをプロジェクトの直下に配置します。
npmでインストールする場合
npmでChromeのブラウザドライバーをインストールする場合は、以下のコマンドを実行します。
npm install chromedriver -D
ブラウザを自動操作するスクリプトを作成
ブラウザを自動操作するスクリプトを作成します。
例では、ファイル名をtest.jsとしてプロジェクトの直下に配置し、次のスクリプトを記述します。
const { Builder, By, Key, until } = require('selenium-webdriver')
const driver = new Builder().forBrowser('chrome').build()
const keyword = 'テスト'
driver
.get('https://www.google.com/search')
.then(() =>
driver.findElement(By.name('q')).sendKeys(keyword, Key.RETURN)
)
.then(() =>
driver.wait(until.titleContains(keyword), 1000)
)
.then(() => driver.quit())
上記の例では、次のようにブラウザの自動操作を行っています。
Chromeを起動しGoogle検索で「テスト」と検索します。そして、検索ページのページタイトルに「テスト」が含まれていれば、Chromeを終了します。
npm-scriptsを利用してファイルを実行
npmでは、コマンドをnpm-scriptsとして定義して実行できます。
例では、npm-scriptsを利用して作成したファイルを実行するため、次のようにpackage.jsonファイル内の"scripts"の値を追加します。
"scripts"の値はオブジェクトとなり、キーに任意のコマンド名を指定し、値に実行するコマンドを指定します。
"scripts": {
"selenium": "node test.js"
}
そして、定義したnpm-scriptsを、以下のコマンドで実行します。
npm run selenium
それにより、ブラウザの自動操作が実行されます。
VSCodeでnpm-scriptsを実行する場合
コードエディタのVSCodeでは、npm-scriptsをサイドバーのメニューから簡単に実行できます。詳しくは以下のリンク先を参考にしてみてください。