Enviar búsqueda
Cargar
ブラウザ自動化ツール カオスマップ風 - STAC2018 LT
•
Descargar como PPTX, PDF
•
7 recomendaciones
•
13,726 vistas
H
hnisiji
Seguir
JavaScript のブラウザE2E系テストツールについてまとめました。
Leer menos
Leer más
Ingeniería
Denunciar
Compartir
Denunciar
Compartir
1 de 11
Descargar ahora
Recomendados
Elasticsearch の検索精度のチューニング 〜テストを作って高速かつ安全に〜
Elasticsearch の検索精度のチューニング 〜テストを作って高速かつ安全に〜
Takahiko Ito
世界一わかりやすいClean Architecture
世界一わかりやすいClean Architecture
Atsushi Nakamura
ソーシャルゲームのためのデータベース設計
ソーシャルゲームのためのデータベース設計
Yoshinori Matsunobu
hbstudy#88 5G+MEC時代のシステム設計
hbstudy#88 5G+MEC時代のシステム設計
VirtualTech Japan Inc.
人生がときめくAPIテスト自動化 with Karate
人生がときめくAPIテスト自動化 with Karate
Takanori Suzuki
backlogsでもCI/CDする夢を見る
backlogsでもCI/CDする夢を見る
Takeru Maehara
ネットストーカー御用達OSINTツールBlackBirdを触ってみた.pptx
ネットストーカー御用達OSINTツールBlackBirdを触ってみた.pptx
Shota Shinogi
JIRA / Confluence の必須プラグインはこれだ
JIRA / Confluence の必須プラグインはこれだ
Narichika Kajihara
Recomendados
Elasticsearch の検索精度のチューニング 〜テストを作って高速かつ安全に〜
Elasticsearch の検索精度のチューニング 〜テストを作って高速かつ安全に〜
Takahiko Ito
世界一わかりやすいClean Architecture
世界一わかりやすいClean Architecture
Atsushi Nakamura
ソーシャルゲームのためのデータベース設計
ソーシャルゲームのためのデータベース設計
Yoshinori Matsunobu
hbstudy#88 5G+MEC時代のシステム設計
hbstudy#88 5G+MEC時代のシステム設計
VirtualTech Japan Inc.
人生がときめくAPIテスト自動化 with Karate
人生がときめくAPIテスト自動化 with Karate
Takanori Suzuki
backlogsでもCI/CDする夢を見る
backlogsでもCI/CDする夢を見る
Takeru Maehara
ネットストーカー御用達OSINTツールBlackBirdを触ってみた.pptx
ネットストーカー御用達OSINTツールBlackBirdを触ってみた.pptx
Shota Shinogi
JIRA / Confluence の必須プラグインはこれだ
JIRA / Confluence の必須プラグインはこれだ
Narichika Kajihara
SQLアンチパターン 幻の第26章「とりあえず削除フラグ」
SQLアンチパターン 幻の第26章「とりあえず削除フラグ」
Takuto Wada
AWSとオンプレミスを繋ぐときに知っておきたいルーティングの基礎知識(CCSI監修!)
AWSとオンプレミスを繋ぐときに知っておきたいルーティングの基礎知識(CCSI監修!)
Trainocate Japan, Ltd.
MySQL・PostgreSQLだけで作る高速あいまい全文検索システム
MySQL・PostgreSQLだけで作る高速あいまい全文検索システム
Kouhei Sutou
FastAPIのテンプレートプロジェクトがいい感じだった話
FastAPIのテンプレートプロジェクトがいい感じだった話
NipponAlgorithm
Redisの特徴と活用方法について
Redisの特徴と活用方法について
Yuji Otani
Goのサーバサイド実装におけるレイヤ設計とレイヤ内実装について考える
Goのサーバサイド実装におけるレイヤ設計とレイヤ内実装について考える
pospome
CyberAgentのプライベートクラウド Cycloudの運用及びモニタリングについて #CODT2020 / Administration and M...
CyberAgentのプライベートクラウド Cycloudの運用及びモニタリングについて #CODT2020 / Administration and M...
whywaita
Fargate起動歴1日の男が語る運用の勘どころ
Fargate起動歴1日の男が語る運用の勘どころ
Yuto Komai
Protocol Buffers 入門
Protocol Buffers 入門
Yuichi Ito
Swaggerでのapi開発よもやま話
Swaggerでのapi開発よもやま話
KEISUKE KONISHI
SPAセキュリティ入門~PHP Conference Japan 2021
SPAセキュリティ入門~PHP Conference Japan 2021
Hiroshi Tokumaru
何となく勉強した気分になれるパーサ入門
何となく勉強した気分になれるパーサ入門
masayoshi takahashi
DockerとPodmanの比較
DockerとPodmanの比較
Akihiro Suda
Dockerの期待と現実~Docker都市伝説はなぜ生まれるのか~
Dockerの期待と現実~Docker都市伝説はなぜ生まれるのか~
Masahito Zembutsu
The Twelve-Factor Appで考えるAWSのサービス開発
The Twelve-Factor Appで考えるAWSのサービス開発
Amazon Web Services Japan
Dockerfile を書くためのベストプラクティス解説編
Dockerfile を書くためのベストプラクティス解説編
Masahito Zembutsu
マイクロサービスバックエンドAPIのためのRESTとgRPC
マイクロサービスバックエンドAPIのためのRESTとgRPC
disc99_
DXとかDevOpsとかのなんかいい感じのやつ 富士通TechLive
DXとかDevOpsとかのなんかいい感じのやつ 富士通TechLive
Tokoroten Nakayama
PlaySQLAlchemy: SQLAlchemy入門
PlaySQLAlchemy: SQLAlchemy入門
泰 増田
開発者の生産性向上を妨げる障壁とサイボウズの生産性向上チームの取り組み
開発者の生産性向上を妨げる障壁とサイボウズの生産性向上チームの取り組み
Jumpei Miyata
Twitter クライアント開発のすすめ #twtr_hack
Twitter クライアント開発のすすめ #twtr_hack
Mocel Mocelic
ゲームの自動テストを 作ってみた
ゲームの自動テストを 作ってみた
Yuusuke Takeuchi
Más contenido relacionado
La actualidad más candente
SQLアンチパターン 幻の第26章「とりあえず削除フラグ」
SQLアンチパターン 幻の第26章「とりあえず削除フラグ」
Takuto Wada
AWSとオンプレミスを繋ぐときに知っておきたいルーティングの基礎知識(CCSI監修!)
AWSとオンプレミスを繋ぐときに知っておきたいルーティングの基礎知識(CCSI監修!)
Trainocate Japan, Ltd.
MySQL・PostgreSQLだけで作る高速あいまい全文検索システム
MySQL・PostgreSQLだけで作る高速あいまい全文検索システム
Kouhei Sutou
FastAPIのテンプレートプロジェクトがいい感じだった話
FastAPIのテンプレートプロジェクトがいい感じだった話
NipponAlgorithm
Redisの特徴と活用方法について
Redisの特徴と活用方法について
Yuji Otani
Goのサーバサイド実装におけるレイヤ設計とレイヤ内実装について考える
Goのサーバサイド実装におけるレイヤ設計とレイヤ内実装について考える
pospome
CyberAgentのプライベートクラウド Cycloudの運用及びモニタリングについて #CODT2020 / Administration and M...
CyberAgentのプライベートクラウド Cycloudの運用及びモニタリングについて #CODT2020 / Administration and M...
whywaita
Fargate起動歴1日の男が語る運用の勘どころ
Fargate起動歴1日の男が語る運用の勘どころ
Yuto Komai
Protocol Buffers 入門
Protocol Buffers 入門
Yuichi Ito
Swaggerでのapi開発よもやま話
Swaggerでのapi開発よもやま話
KEISUKE KONISHI
SPAセキュリティ入門~PHP Conference Japan 2021
SPAセキュリティ入門~PHP Conference Japan 2021
Hiroshi Tokumaru
何となく勉強した気分になれるパーサ入門
何となく勉強した気分になれるパーサ入門
masayoshi takahashi
DockerとPodmanの比較
DockerとPodmanの比較
Akihiro Suda
Dockerの期待と現実~Docker都市伝説はなぜ生まれるのか~
Dockerの期待と現実~Docker都市伝説はなぜ生まれるのか~
Masahito Zembutsu
The Twelve-Factor Appで考えるAWSのサービス開発
The Twelve-Factor Appで考えるAWSのサービス開発
Amazon Web Services Japan
Dockerfile を書くためのベストプラクティス解説編
Dockerfile を書くためのベストプラクティス解説編
Masahito Zembutsu
マイクロサービスバックエンドAPIのためのRESTとgRPC
マイクロサービスバックエンドAPIのためのRESTとgRPC
disc99_
DXとかDevOpsとかのなんかいい感じのやつ 富士通TechLive
DXとかDevOpsとかのなんかいい感じのやつ 富士通TechLive
Tokoroten Nakayama
PlaySQLAlchemy: SQLAlchemy入門
PlaySQLAlchemy: SQLAlchemy入門
泰 増田
開発者の生産性向上を妨げる障壁とサイボウズの生産性向上チームの取り組み
開発者の生産性向上を妨げる障壁とサイボウズの生産性向上チームの取り組み
Jumpei Miyata
La actualidad más candente
(20)
SQLアンチパターン 幻の第26章「とりあえず削除フラグ」
SQLアンチパターン 幻の第26章「とりあえず削除フラグ」
AWSとオンプレミスを繋ぐときに知っておきたいルーティングの基礎知識(CCSI監修!)
AWSとオンプレミスを繋ぐときに知っておきたいルーティングの基礎知識(CCSI監修!)
MySQL・PostgreSQLだけで作る高速あいまい全文検索システム
MySQL・PostgreSQLだけで作る高速あいまい全文検索システム
FastAPIのテンプレートプロジェクトがいい感じだった話
FastAPIのテンプレートプロジェクトがいい感じだった話
Redisの特徴と活用方法について
Redisの特徴と活用方法について
Goのサーバサイド実装におけるレイヤ設計とレイヤ内実装について考える
Goのサーバサイド実装におけるレイヤ設計とレイヤ内実装について考える
CyberAgentのプライベートクラウド Cycloudの運用及びモニタリングについて #CODT2020 / Administration and M...
CyberAgentのプライベートクラウド Cycloudの運用及びモニタリングについて #CODT2020 / Administration and M...
Fargate起動歴1日の男が語る運用の勘どころ
Fargate起動歴1日の男が語る運用の勘どころ
Protocol Buffers 入門
Protocol Buffers 入門
Swaggerでのapi開発よもやま話
Swaggerでのapi開発よもやま話
SPAセキュリティ入門~PHP Conference Japan 2021
SPAセキュリティ入門~PHP Conference Japan 2021
何となく勉強した気分になれるパーサ入門
何となく勉強した気分になれるパーサ入門
DockerとPodmanの比較
DockerとPodmanの比較
Dockerの期待と現実~Docker都市伝説はなぜ生まれるのか~
Dockerの期待と現実~Docker都市伝説はなぜ生まれるのか~
The Twelve-Factor Appで考えるAWSのサービス開発
The Twelve-Factor Appで考えるAWSのサービス開発
Dockerfile を書くためのベストプラクティス解説編
Dockerfile を書くためのベストプラクティス解説編
マイクロサービスバックエンドAPIのためのRESTとgRPC
マイクロサービスバックエンドAPIのためのRESTとgRPC
DXとかDevOpsとかのなんかいい感じのやつ 富士通TechLive
DXとかDevOpsとかのなんかいい感じのやつ 富士通TechLive
PlaySQLAlchemy: SQLAlchemy入門
PlaySQLAlchemy: SQLAlchemy入門
開発者の生産性向上を妨げる障壁とサイボウズの生産性向上チームの取り組み
開発者の生産性向上を妨げる障壁とサイボウズの生産性向上チームの取り組み
Similar a ブラウザ自動化ツール カオスマップ風 - STAC2018 LT
Twitter クライアント開発のすすめ #twtr_hack
Twitter クライアント開発のすすめ #twtr_hack
Mocel Mocelic
ゲームの自動テストを 作ってみた
ゲームの自動テストを 作ってみた
Yuusuke Takeuchi
第3回 開発ツールチラ見せ♡ナイト オープニングプレゼン
第3回 開発ツールチラ見せ♡ナイト オープニングプレゼン
Tomoyuki Sugita
パワーユーザー必携の海外の拡張機能20選+α
パワーユーザー必携の海外の拡張機能20選+α
Akira Maruyama
a-blogcsm な寺子屋 2 in Okazaki
a-blogcsm な寺子屋 2 in Okazaki
Etsushi Ishii
sensuのちょっと進んだ使い方
sensuのちょっと進んだ使い方
正貴 小川
Dev tools introduction
Dev tools introduction
Ryu Shindo
ツールを使い倒せ!公開版 : (Use the tool to defeat it! : Public version)
ツールを使い倒せ!公開版 : (Use the tool to defeat it! : Public version)
Mr. Vengineer
Device Farm を使ったスマホアプリの自動テスト
Device Farm を使ったスマホアプリの自動テスト
健一 辰濱
Hachiojipm31
Hachiojipm31
Junichiro Suzuki
RustでWebSocketな自社APIを使う
RustでWebSocketな自社APIを使う
Satoshi Yoshikawa
Chrome-eject がこの先生きのこるには
Chrome-eject がこの先生きのこるには
Yosuke HASEGAWA
[SC13] ログ管理で向上させるセキュリティ
[SC13] ログ管理で向上させるセキュリティ
de:code 2017
継続的インテグレーション3分クッキング
継続的インテグレーション3分クッキング
Takayuki Kondou
気が狂わないサーバ増設x10
気が狂わないサーバ増設x10
Kiyotaka Kunihira
Firefoxの開発ツール
Firefoxの開発ツール
Noritada Shimizu
Azure VMを検証に使う - 便利なHyper-Vスナップショットを使う方法
Azure VMを検証に使う - 便利なHyper-Vスナップショットを使う方法
Study Group by SciencePark Corp.
Robotium を使った UI テスト
Robotium を使った UI テスト
健一 辰濱
Xamarin 概要 @ 2014/10/18 わんくま同盟 東京勉強会 #92
Xamarin 概要 @ 2014/10/18 わんくま同盟 東京勉強会 #92
Yoshito Tabuchi
速度改善のためにフロント:アプリ:インフラ エンジニアが使うツールについて
速度改善のためにフロント:アプリ:インフラ エンジニアが使うツールについて
Daisuke Tamada
Similar a ブラウザ自動化ツール カオスマップ風 - STAC2018 LT
(20)
Twitter クライアント開発のすすめ #twtr_hack
Twitter クライアント開発のすすめ #twtr_hack
ゲームの自動テストを 作ってみた
ゲームの自動テストを 作ってみた
第3回 開発ツールチラ見せ♡ナイト オープニングプレゼン
第3回 開発ツールチラ見せ♡ナイト オープニングプレゼン
パワーユーザー必携の海外の拡張機能20選+α
パワーユーザー必携の海外の拡張機能20選+α
a-blogcsm な寺子屋 2 in Okazaki
a-blogcsm な寺子屋 2 in Okazaki
sensuのちょっと進んだ使い方
sensuのちょっと進んだ使い方
Dev tools introduction
Dev tools introduction
ツールを使い倒せ!公開版 : (Use the tool to defeat it! : Public version)
ツールを使い倒せ!公開版 : (Use the tool to defeat it! : Public version)
Device Farm を使ったスマホアプリの自動テスト
Device Farm を使ったスマホアプリの自動テスト
Hachiojipm31
Hachiojipm31
RustでWebSocketな自社APIを使う
RustでWebSocketな自社APIを使う
Chrome-eject がこの先生きのこるには
Chrome-eject がこの先生きのこるには
[SC13] ログ管理で向上させるセキュリティ
[SC13] ログ管理で向上させるセキュリティ
継続的インテグレーション3分クッキング
継続的インテグレーション3分クッキング
気が狂わないサーバ増設x10
気が狂わないサーバ増設x10
Firefoxの開発ツール
Firefoxの開発ツール
Azure VMを検証に使う - 便利なHyper-Vスナップショットを使う方法
Azure VMを検証に使う - 便利なHyper-Vスナップショットを使う方法
Robotium を使った UI テスト
Robotium を使った UI テスト
Xamarin 概要 @ 2014/10/18 わんくま同盟 東京勉強会 #92
Xamarin 概要 @ 2014/10/18 わんくま同盟 東京勉強会 #92
速度改善のためにフロント:アプリ:インフラ エンジニアが使うツールについて
速度改善のためにフロント:アプリ:インフラ エンジニアが使うツールについて
ブラウザ自動化ツール カオスマップ風 - STAC2018 LT
1.
ブラウザ自動化ツール カオスマップ風 システムテスト自動化カンファレンス2018
2.
自己紹介 • Twitter アカウント:
@hnz • フロントエンドエンジニア • ここ数年テスト自動化ツールを開発
3.
発表の概要 • ブラウザ自動化ツール、たくさん • 自分のためにカオスマップ風に整理しました •
他にもおすすめのツールなどありましたらぜひおしえてください!
4.
5.
• JavaScript をページに流し込んでブラウザを操作する •
😃実行早め • 😃セットアップ簡単 • 😐マルチブラウザ対応はツールによりけり • Nightmare - https://github.com/segmentio/nightmare • Cypress - https://github.com/cypress-io/cypress • TestCafe - https://github.com/DevExpress/testcafe
6.
• Chrome や
Firefox の開発者ツールの API を 使ってブラウザを操作する • ☺️ セットアップがほぼ不要ですぐに使え る • ☺️ CI 環境で動かしやすい • 😐 多ブラウザ対応はできない • Puppeteer / Puppeteer for Firefox - https://github.com/GoogleChrome/puppeteer • Gauge - https://gauge.org/ • taiko.js - https://taiko.gauge.org/
7.
• ブラウザの動きを Node.js
で再現! • ☺️ ブラウザでしか動かない単体テストを CI上で気軽に実行できる • 😐 本物のブラウザではないので用途を選ぶ • Zombie.js - http://zombie.js.org/
8.
• ブラウザの拡張機能を作るための機能を使って、ブラウザを操作 • 😃他では自動化しにくいことが自動化できる •
😃Web 標準の機能を使っているのでマルチブラウザも期待できる • 😐まだ実用例が見当たらない • Remote Browser - https://github.com/intoli/remote-browser
9.
• ブラウザ自動操作のウェブ標準である Webdriver API
を利用 • 😃マルチブラウザ • 😃広く使われている • 😐セットアップが面倒(なのも多い) • 😐テスト実行のオーバーヘッド大きめ
10.
• 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/
11.
まとめ • 何がいいかは時と場合によるので、いろいろ知っておきたいですね
Notas del editor
少し自己紹介をさせてください。 名前は西島と言います。 このアイコンで Twitter をやっています。 JavaScript と CSS が得意なフロントエンジニアです。
それでは、本日のLTなのですが、ブラウザの自動化ツール、色々増えすぎていてわからん! ということで、カオスマップ風に整理してみました。 このLTでは、自分が整理してみたやつを紹介して、他にもこんなのあるよ、とか、そういうのをいただけると嬉しいな、と思っています。
というわけで、まとめてみました。 僕がJS系のエンジニアなので JS のやつです。 Github上でそこそこ星がついていて、今もメンテがされているやつをリストアップしたつもりです。 ツールの自動化のアーキテクチャと、ブラウザの互換性の観点で分類しています。 分類ごとに駆け足で紹介していきたいと思います。
まず、JavaScript Injection系。 これらのツールは、ブラウザについている自動化の機能を使うのではなく、JavaScript をページに流し込んで操作するアーキテクチャをとっています。実行が早く、セットアップが楽ですが、ブラウザの制約でできることが限られる場合もあり、思わぬところではまったりします。 マルチブラウザ対応はまちまちで、TestCafe はほとんどのブラウザに対応してますが、Nightmare は Electron の WebView 、Cypress はもろもろ対応予定はあるようですが現状 Chrome のみです。
次、devtool protocol 系。 これらのツールはChromeやFirefox の開発者ツールの機能を通してブラウザを操作する仕組みです。使いやすいですが、仕組み上マルチブラウザは期待できないです。 Puppeteer はよく使われているように思います。実験的ではありますが、 Firefox 実装もきのう公開されてかなり話題になっていました。 Gauge (ゲージ)は Thoughtworks が作っているテストフレームワークです。 中で使われている taiko.js が chromium と devtool protocol で動きます。個人的には結構イカすツールだと思っています。
次Headless Browser 系。 Phantom.js やSlimmer.js や Casper.js など、一時代を築いた Headless Browser はほとんどメンテが終了しているのですが、そんななか Zombie.js だけは元気です。 このツールはブラウザといっていいのかはわかりませんが、Headless browser を名乗っているのでリストアップしておきました。ちょっとスペース空いて見栄えも悪かったので。
次は、WebExtensions API を使っているやつ。 ブラウザの拡張機能を作るための Web 標準である、WebExtensions API を使ってブラウザを操作します。 複数のタブの同期的な処理など、他のツールでは難しいこともできるのではないかと思います。 ただ、まだ実用的かというと、そうでもないのが現状だと感じています。
最後、 Webdriver 系。Webdriver API というブラウザ操作のウェブ標準を使うやつです。 Yandex のビジュアルテスト用ツールのGemini 、Angular の Protractor、Paypal が作っている nemo は他の Webdriver 系ライブラリをもっと便利に使うためのツールなのでここに載せるかは迷いましたが、みっちり感を少しでも出したかったので入れました。 個人的なお気に入りは Intern とそのWebdriver クライアントの Leadfoot です。 TypeScriptでモダンな作りですし、セットアップ要らずで使えるのがすごく良いです。正直使われているのを見かけたことがないです。
Descargar ahora