masalibの日記

システム開発、運用と猫の写真ブログです

E2Eテストツールはpuppeteerがいいと思う

会社にはいって7年目(社会人だと11年)の人が
毎日、画面キャプチャをとるという簡単なお仕事をしているのですが
そちらをなんとか効率よくしたいと思ってE2Eテストツールについて
調べていました

E2Eテストツールとは

エンドツーエンドテストのことで
システムテストみたいなもので
これをサポートしてくれるツールです
周回遅れのうちの会社はもちろんツールなんか使っていません

過去の苦い思い出

seleniumIDEがない、waitの所でいつもハマる
・TestCafeはIDEが有償でエミュレートモードで起動できない
・protractorはseleniumのWEBドライバーandroidでハマる

puppeteerの長所

1・本家ChromeのDevTool開発チームが作成・メンテナンスしている
qiita.com
で書いてある事なのですが
 → これは本当にでかい
 google先生が開発している事は本当にうれしい
 わけがわからない所が作っていて、開発しませんとか言われた
 使っているこっちは泣きがはいります

2・非同期処理(待ち)がデフォルトで記載できる
 → これができるのでSPAのページのテストもできる!!
 qiita.com
 
 うまくいけばアナリティクスとかも自動化できるかも
 (APIが提供されていない系もデータ収集できる)

3・インストールが簡単
 → 感激です

4・起動も簡単
 WEBドライバー起動して・・・とかいらない

5・コードがjavascript!!
 学習コストがかからないかと

puppeteerの短所

バージョンアップが頻繁におこなっているので
 APIが使えなくなる可能性がある
 → google先生なのでバッサリいきます

・node.jsのバージョンが6では動かない
 → 2017/09/12時点で
    awsのlambdaは6.10
    Cloud Functionsは6.10

IDEがない?
 → 見つけられなかった
 2018/08/23追記
masalib.hatenablog.com
 レコーダーのツールがありました
 若干不安定なのでタグの要素を調べる時に便利です 

インストール

node.jsのインストール

 https://nodejs.org/ja/
 node.js7.6以上をインストールする
 安定版だと動かない
 最新版をいれる

 テストしていて
 SyntaxError: Unexpected token
 のエラーがでたnode.jsのバージョンが古い可能性があります

 
stackoverflow.com

puppeteerのインストール
npm install -g puppeteer

起動

node test.js

test.jsの内容

const puppeteer = require('puppeteer');
const devices = require('puppeteer/DeviceDescriptors');

(async() => {

const browser = await puppeteer.launch();
const page = await browser.newPage();

//iPhone6でエミュレートする
await page.emulate(devices['iPhone 6']);

//ページ遷移する
await page.goto('http://masalib.hatenablog.com/entry/2017/09/12/025019');
//画面キャプチャする。パラメータにページ全体
await page.screenshot({path: 'full.png', fullPage: true});
browser.close();

})();

まだ調べきれていないこと

ファイルアップするページがあったらどうやって自動化するのか
base64でかくの?

おまけ

awaitという記述があるのですが
7秒で理解できる動画がありました


ソフトウェアテスト技法ドリル―テスト設計の考え方と実際

ソフトウェアテスト技法ドリル―テスト設計の考え方と実際