UIテスト自動化をやってみるで🤜🤛
もちろん俺らは抵抗するで? 自動化で
WEB画面を自動でテストするツールは世の中にいろいろ出ていますが、その中でもTestCafeと呼ばれるツールを使ってみました。
値段的には1開発者につき一年で499ドル(=5万円)ぐらい。
とりあえず以下をやっていきます。
- ブラウザ上で実行されるWEBシステムの動作テスト(工程的には結合試験レベル)
- Amazon Linux上でのTestCafe実行
- JenkinsによるTestCafe自動実行
TestCafe導入とテストケース作成
- TestCafeのクライアントを用意してインストールしておく
- テストを作成したらjavascriptで書かれたスクリプトができるのでGitに登録する
CI連携
- テストケースの版数管理を行う
- Gitなどに作成したTestCafeのソースを入れておく
Jenkinsへの設定作業は Integrating TestCafe with Jenkins CI System を見ればわかるので、そこで躓いたところだけ拾っていこうと思います。
TestCafe使用の前準備
npm / nodejs のインストール
$ sudo apt-get update
$ sudo apt-get upgrade
$ curl -sL https://deb.nodesource.com/setup_9.x | sudo -E bash -
$ sudo apt-get install -y nodejs node-gyp
// 古いライブラリは "node" コマンドで動こうとするのでエイリアスを作っておく
$ sudo ln -s /usr/bin/nodejs /usr/bin/node
// npm本体をアップデートしておく
$ sudo mkdir -p /usr/local/lib/node_modules/npm
$ sudo npm install npm -g
npmがインストールできたらchromeを入れる
$ wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb
$ sudo dpkg -i google-chrome-stable_current_amd64.deb
// 一発では入らないので依存モジュールを入れる
$ sudo apt update
$ sudo apt -f install -y
TestCafeの設定
- npm で testcafe 本体をインストールすること
$ npm install testcafe testcafe-reporter-xunit
- ブラウザとしてchromeが使えないと、テスト実行に失敗する、以下をチェック
$ node_modules/.bin/testcafe -b
chrome
- 実行!
$ node_modules/.bin/testcafe chrome test.js -r xunit:res.xml
トラブルシューティング
-
TypeError: Cannot read property 'Date' of undefined
- アスタリスクでテスト対象を指定すると、ライブラリを巻き込んでテスト実行されるので、きちんとテスト対象をディレクトリに分けること
- 参考:Implement builds of Docker images (closes #1141) #1197
-
ERROR Unable to establish one or more of the specified browser connections
- Xサーバが立ってないと画面表示がなくて正常に動作しない
- 参考:ERROR Unable to establish one or more of the specified browser connections #1133
結局以下のようなコマンドで、まずXを起動させて実行してみた
# サーバ内でXのサーバを起動させつつTestCafe起動
xvfb-run --server-num=99 --server-args='-ac -screen 0 1024x768x16' node_modules/.bin/testcafe chrome test.js -r xunit:res.xml