Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

ブラウザ自動化ツール カオスマップ風 - STAC2018 LT

367 views

Published on

JavaScript のブラウザE2E系テストツールについてまとめました。

Published in: Engineering
  • Be the first to comment

ブラウザ自動化ツール カオスマップ風 - STAC2018 LT

  1. 1. ブラウザ自動化ツール カオスマップ風 システムテスト自動化カンファレンス2018
  2. 2. 自己紹介 • Twitter アカウント: @hnz • フロントエンドエンジニア • ここ数年テスト自動化ツールを開発
  3. 3. 発表の概要 • ブラウザ自動化ツール、たくさん • 自分のためにカオスマップ風に整理しました • 他にもおすすめのツールなどありましたらぜひおしえてください!
  4. 4. • JavaScript をページに流し込んでブラウザを操作する • 😃実行早め • 😃セットアップ簡単 • 😐マルチブラウザ対応はツールによりけり • Nightmare - https://github.com/segmentio/nightmare • Cypress - https://github.com/cypress-io/cypress • TestCafe - https://github.com/DevExpress/testcafe
  5. 5. • Chrome や Firefox の開発者ツールの API を 使ってブラウザを操作する • ☺️ セットアップがほぼ不要ですぐに使え る • ☺️ CI 環境で動かしやすい • 😐 多ブラウザ対応はできない • Puppeteer / Puppeteer for Firefox - https://github.com/GoogleChrome/puppeteer • Gauge - https://gauge.org/ • taiko.js - https://taiko.gauge.org/
  6. 6. • ブラウザの動きを Node.js で再現! • ☺️ ブラウザでしか動かない単体テストを CI上で気軽に実行できる • 😐 本物のブラウザではないので用途を選ぶ • Zombie.js - http://zombie.js.org/
  7. 7. • ブラウザの拡張機能を作るための機能を使って、ブラウザを操作 • 😃他では自動化しにくいことが自動化できる • 😃Web 標準の機能を使っているのでマルチブラウザも期待できる • 😐まだ実用例が見当たらない • Remote Browser - https://github.com/intoli/remote-browser
  8. 8. • ブラウザ自動操作のウェブ標準である Webdriver API を利用 • 😃マルチブラウザ • 😃広く使われている • 😐セットアップが面倒(なのも多い) • 😐テスト実行のオーバーヘッド大きめ
  9. 9. • selenium-webdriver - https://seleniumhq.github.io/selenium/docs/api/javascript/index.html • Nightwatch.js - http://nightwatchjs.org/ • WebdriverIO - http://webdriver.io/ • Intern - https://github.com/theintern/intern • Leadfoot - https://github.com/theintern/leadfoot • Protractor - https://www.protractortest.org/ • WD.js - http://admc.io/wd/ • Gemini - https://github.com/gemini-testing/gemini • Nemo - http://nemo.js.org/
  10. 10. まとめ • 何がいいかは時と場合によるので、いろいろ知っておきたいですね

×