概要
Amazon LinuxでWebdriverIOによる自動E2Eテストの実験をしようとしていたのですが、 うまくGetting startedできませんでした。
Linux環境においてWebdriverIOのGet Startedはやや説明不足感があるため、今回の記事では、 Amazon LinuxでWebdriverIOを使ったChromeによるE2Eテスト環境構築の手順を書こうと思います。
前提
項目 | バージョン |
---|---|
Amazon Linux | 2017.9 |
Java | 1.8 |
selenium-server-standalone | 3.12.0 |
chromedriver | 2.40 |
WebdriverIO | 4.13.0 |
npm | 6.1.0 |
node | 10.5.0 |
手順
まずは作業用のフォルダを作成
mkdir webdriverio-test && cd webdriverio-test
Javaのアップデート
Selenium Server StandaloneをJavaを動かす際、Amazon Linux 2017.9にデフォルトでインストールされているJavaのバージョンが1.7であるため、アップデートが必要になります。
sudo yum update -y sudo yum install -y java-1.8.0-openjdk-devel.x86_64 sudo alternatives --config java
sudo alternatives --config java
を実行すると、1.7か1.8か選択するように聞かれるので1.8を選択。
ChromeDriverのインストール
ざっくりやることは下記の通りです。
- ChromeDriverをwgetで持ってきて展開
- Chromeのバイナリをインストール
- GConf2をインストール
という流れです。
ChromeDriverをwgetで持ってきて展開
wget https://chromedriver.storage.googleapis.com/2.40/chromedriver_linux64.zip unzip chromedriver_linux64.zip sudo ln -s /home/user_name/webdriverio-test/chromedriver /usr/local/bin/chromedriver
Chromeのバイナリをインストール
curl https://intoli.com/install-google-chrome.sh | bash
GConf2をインストール
yum install GConf2
で入れようとしても、No package GConf2 available.と怒られるので、リポジトリを追加します。
sudo vim /etc/yum.repos.d/centos.repo
で新規ファイルを作成し、下記を打ち込んで保存
[CentOS-base] name=CentOS-6 - Base mirrorlist=http://mirrorlist.centos.org/?release=6&arch=x86_64&repo=os gpgcheck=1 gpgkey=http://mirror.centos.org/centos/RPM-GPG-KEY-CentOS-6 #released updates [CentOS-updates] name=CentOS-6 - Updates mirrorlist=http://mirrorlist.centos.org/?release=6&arch=x86_64&repo=updates gpgcheck=1 gpgkey=http://mirror.centos.org/centos/RPM-GPG-KEY-CentOS-6 #additional packages that may be useful [CentOS-extras] name=CentOS-6 - Extras mirrorlist=http://mirrorlist.centos.org/?release=6&arch=x86_64&repo=extras gpgcheck=1 gpgkey=http://mirror.centos.org/centos/RPM-GPG-KEY-CentOS-6
sudo rpm --import http://mirror.centos.org/centos/RPM-GPG-KEY-CentOS-6 sudo yum -y install GConf2
WebdriverIO
nvmによるnodeのインストール
sudo yum install -y git curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.11/install.sh | bash source ~/.bashrc nvm install node
WebdriverIOのインストール
npm install webdriverio
Selenium Server Standaloneをインストールしバックグラウンド実行
curl -O http://selenium-release.storage.googleapis.com/3.12/selenium-server-standalone-3.12.0.jar java -jar selenium-server-standalone-3.12.0.jar &
実行
test.jsを作成
WebdriverIO公式のtest.jsをコピペして、'firofox'を'chrome'に変更すれば動くだろうと思いきや、 Chromeの場合は、明示的にheadlessモードを指定しなければ動作しませんでした。 そのため、下記の通りに書き換えます。
var webdriverio = require('webdriverio'); var options = { desiredCapabilities: { browserName: 'chrome', chromeOptions: { args: ['--headless', '--disable-gpu'], }, } }; webdriverio .remote(options) .init() .url('http://www.google.com') .getTitle().then(function(title) { console.log('Title was: ' + title); }) .end() .catch(function(err) { console.log(err); });
node test.js
Title was: Googleと表示されれば、うまくGetting startedができています!
まとめ
WebdriverIOのスタートガイドは、GUI環境上で動かす分には、Chromeが入っていれば、Seleniumが動かすChromeDriverをインストールするだけで動くのですが、CUI上では、Chromeをバイナリでインストールしたり、GConf2を使うためにリポジトリを追加したり、普段やらないようなことをするので骨が折れました。 また、起動時に--headlessを引数で渡さなければ謎のエラーで動作しないことにも地味にハマりました。