SlideShare a Scribd company logo
Selenium Web Driverを
使ってつまらない作業を
駆逐してやる!!
@joe_re
ある日のできごと
ぼく「一通り作業終わりましたー。」
PM「お疲れ!じゃあテストしなきゃなー。」
ぼく「テスト?ユニットテストなら書いてますが、
受け入れテストまでこちらでやるということですか?」
PM「いや、受け入れテストは別部隊でやるよ。
ただ今回は政治的な都合上、
全パターンテストをやっているっていう
エビデンスが欲しいんだよね。」
ぼく「エビデンス?(嫌な予感。。)」
※ 多少脚色してますが概ね実際の出来事です。
PM「全パターンの
スクショ撮りをしよう。」
ぼく「ファッ!?」
What is スクショ撮り
スクリーンショットを撮る作業のことです。
一切の知的労働性を排除された超絶力仕事なので、
エンジニアの体調を著しく損なってしまうことがあります。
スクショ撮り(英: take a Scsho!) とは
完成したシステムの画面上の表示のエビデンスを残すために行われる、画面のスクリーンショットを撮る
作業のこと。
理不尽な政治的事情によるエビデンスで要求されることが多い。
その性質上、作業によって得られる成果物も確実性があるとは言えず、達成感も得られない。
エンジニアからは嫌われる傾向にある。
一切の知的な喜びを得られないこの作業は、エンジニアを疲弊させ、鬱病、適応障害など様々な心の病を
引き起こしてしまう。
出典 wikipedia(ウソ)
駆逐してやる。
この世から1匹残らず!!
(ていうか仕様変わったらどうするの?1から撮り直すの?
勘弁してぇぇぇぇぇぇぇぇぇぇぇぇ!!!)
そこで救世主、
Selenium Web Driver!!
What is Selenium Web Driver
Webブラウザのテストを自動化するための

テストフレームワークです。
WebブラウザのAPIを利用して、

クリックやスクロール・文字入力などを始めとして、
あらかじめ定義されたテストを自動的に実行します。
Java、Ruby、Python、Nodejsなど、

様々な言語で記述することができます。
これを使って、
スクショ撮りを自動化します。
デモ
アプリケーションの機能
• サインアップ、ログイン、ログアウトできる
• 自分の自己紹介を登録し、閲覧できる
https://github.com/joe-re/selenium-snapshot-sample
自動化したい要件
1. 4人のテストユーザでログインする。
2. ログイン後にプロフィールページを表示する。
3. 表示される画面のスクリーンショットを撮る。
4. 撮ったスクリーンショットのファイル名は、

ユーザ名.pngにする。
解説
require ‘selenium-web-driver’
driver = Selenium::WebDriver.for :firefox
FileUtils.mkdir_p 'screenshots'
[
{ email: 'yui_hirasawa@test.co.jp', password: ‘yuihirasawa’ },
# ..中略.. #
].each do |user|
# ログイン
driver.navigate.to 'http://localhost:3000'
driver.find_element(:id, 'user_email').send_keys(user[:email])
driver.find_element(:id, 'user_password').send_keys(user[:password])
driver.find_element(:name, 'commit').submit
sleep(1) # デモで見やすいように1秒待機
# profileを表示する
driver.navigate.to 'http://localhost:3000/profile'
sleep(1) # デモで見やすいように1秒待機
# screenshotを撮る
username = driver.find_element(:id, 'username').text
driver.save_screenshot("screenshots/#{username}.png")
# ログアウト
driver.find_element(:id, 'logout').click
end
driver.quit # 終了
1人忘れてた!!
なんてクソなプロダクトだ!
画像は一番上にしてくれ!
仕様変更
でも、大丈夫!
そうSelenium Web Driver
ならね!!
Enjoy the life of engineers!
Thanks!

More Related Content

What's hot

はじめてのLWF for Open Hack Day
はじめてのLWF for Open Hack DayはじめてのLWF for Open Hack Day
はじめてのLWF for Open Hack Day
Daniel-Hiroyuki Haga
 
Looking glass + videoplayer
Looking glass + videoplayerLooking glass + videoplayer
Looking glass + videoplayer
優介 黒河
 
「現場のプロが教えるWebデザイン新・スタンダードテクニック37」に載っているテクニックでLP作ってみた話
「現場のプロが教えるWebデザイン新・スタンダードテクニック37」に載っているテクニックでLP作ってみた話「現場のプロが教えるWebデザイン新・スタンダードテクニック37」に載っているテクニックでLP作ってみた話
「現場のプロが教えるWebデザイン新・スタンダードテクニック37」に載っているテクニックでLP作ってみた話
Yuki Kuramochi
 
Webエンジニアのためのプロジェクションマッピング(とりあえず完結編)
Webエンジニアのためのプロジェクションマッピング(とりあえず完結編)Webエンジニアのためのプロジェクションマッピング(とりあえず完結編)
Webエンジニアのためのプロジェクションマッピング(とりあえず完結編)
KatsuyaENDOH
 
2013-09 テンプレートエンジンMixer2紹介 HTML5J&JJUG合同勉強会LT
2013-09 テンプレートエンジンMixer2紹介 HTML5J&JJUG合同勉強会LT2013-09 テンプレートエンジンMixer2紹介 HTML5J&JJUG合同勉強会LT
2013-09 テンプレートエンジンMixer2紹介 HTML5J&JJUG合同勉強会LTY Watanabe
 
2021 01-25 lt sho kato
2021 01-25 lt sho kato2021 01-25 lt sho kato
2021 01-25 lt sho kato
katosho1
 
JS と Canvas で作るシューティングゲーム
JS と Canvas で作るシューティングゲームJS と Canvas で作るシューティングゲーム
JS と Canvas で作るシューティングゲーム
sairoutine
 
20130511 jjug ccc講演 さらばjsp JAXBとmixer2
20130511 jjug ccc講演 さらばjsp JAXBとmixer220130511 jjug ccc講演 さらばjsp JAXBとmixer2
20130511 jjug ccc講演 さらばjsp JAXBとmixer2
Y Watanabe
 
THETA S でライブストリーミング(途中経過)
THETA S でライブストリーミング(途中経過)THETA S でライブストリーミング(途中経過)
THETA S でライブストリーミング(途中経過)
KatsuyaENDOH
 
201311 webデザイナとエンジニアのチームワークを加速させるテンプレートエンジンmixer2 devlove現場甲子園
201311 webデザイナとエンジニアのチームワークを加速させるテンプレートエンジンmixer2 devlove現場甲子園201311 webデザイナとエンジニアのチームワークを加速させるテンプレートエンジンmixer2 devlove現場甲子園
201311 webデザイナとエンジニアのチームワークを加速させるテンプレートエンジンmixer2 devlove現場甲子園Y Watanabe
 
20121019-jenkins-akiko_pusu.pdf
20121019-jenkins-akiko_pusu.pdf20121019-jenkins-akiko_pusu.pdf
20121019-jenkins-akiko_pusu.pdf
akiko_pusu
 
自動化テスト道への歩み - PM編
自動化テスト道への歩み - PM編自動化テスト道への歩み - PM編
自動化テスト道への歩み - PM編
Akira Jing
 
HTML5入門 for 頭がヤバい人向け
HTML5入門 for 頭がヤバい人向けHTML5入門 for 頭がヤバい人向け
HTML5入門 for 頭がヤバい人向け
Kenichi Kanai
 
Angular js meets cakephp at cloud on the beach 2014 前夜祭
Angular js meets cakephp at cloud on the beach 2014 前夜祭Angular js meets cakephp at cloud on the beach 2014 前夜祭
Angular js meets cakephp at cloud on the beach 2014 前夜祭
司 知花
 
うわ…私のEmacs力、低すぎ...?
うわ…私のEmacs力、低すぎ...?うわ…私のEmacs力、低すぎ...?
うわ…私のEmacs力、低すぎ...?Masahiro Sano
 

What's hot (16)

はじめてのLWF for Open Hack Day
はじめてのLWF for Open Hack DayはじめてのLWF for Open Hack Day
はじめてのLWF for Open Hack Day
 
Looking glass + videoplayer
Looking glass + videoplayerLooking glass + videoplayer
Looking glass + videoplayer
 
「現場のプロが教えるWebデザイン新・スタンダードテクニック37」に載っているテクニックでLP作ってみた話
「現場のプロが教えるWebデザイン新・スタンダードテクニック37」に載っているテクニックでLP作ってみた話「現場のプロが教えるWebデザイン新・スタンダードテクニック37」に載っているテクニックでLP作ってみた話
「現場のプロが教えるWebデザイン新・スタンダードテクニック37」に載っているテクニックでLP作ってみた話
 
Webエンジニアのためのプロジェクションマッピング(とりあえず完結編)
Webエンジニアのためのプロジェクションマッピング(とりあえず完結編)Webエンジニアのためのプロジェクションマッピング(とりあえず完結編)
Webエンジニアのためのプロジェクションマッピング(とりあえず完結編)
 
2013-09 テンプレートエンジンMixer2紹介 HTML5J&JJUG合同勉強会LT
2013-09 テンプレートエンジンMixer2紹介 HTML5J&JJUG合同勉強会LT2013-09 テンプレートエンジンMixer2紹介 HTML5J&JJUG合同勉強会LT
2013-09 テンプレートエンジンMixer2紹介 HTML5J&JJUG合同勉強会LT
 
2021 01-25 lt sho kato
2021 01-25 lt sho kato2021 01-25 lt sho kato
2021 01-25 lt sho kato
 
JS と Canvas で作るシューティングゲーム
JS と Canvas で作るシューティングゲームJS と Canvas で作るシューティングゲーム
JS と Canvas で作るシューティングゲーム
 
20130511 jjug ccc講演 さらばjsp JAXBとmixer2
20130511 jjug ccc講演 さらばjsp JAXBとmixer220130511 jjug ccc講演 さらばjsp JAXBとmixer2
20130511 jjug ccc講演 さらばjsp JAXBとmixer2
 
THETA S でライブストリーミング(途中経過)
THETA S でライブストリーミング(途中経過)THETA S でライブストリーミング(途中経過)
THETA S でライブストリーミング(途中経過)
 
201311 webデザイナとエンジニアのチームワークを加速させるテンプレートエンジンmixer2 devlove現場甲子園
201311 webデザイナとエンジニアのチームワークを加速させるテンプレートエンジンmixer2 devlove現場甲子園201311 webデザイナとエンジニアのチームワークを加速させるテンプレートエンジンmixer2 devlove現場甲子園
201311 webデザイナとエンジニアのチームワークを加速させるテンプレートエンジンmixer2 devlove現場甲子園
 
20121019-jenkins-akiko_pusu.pdf
20121019-jenkins-akiko_pusu.pdf20121019-jenkins-akiko_pusu.pdf
20121019-jenkins-akiko_pusu.pdf
 
自動化テスト道への歩み - PM編
自動化テスト道への歩み - PM編自動化テスト道への歩み - PM編
自動化テスト道への歩み - PM編
 
HTML5入門 for 頭がヤバい人向け
HTML5入門 for 頭がヤバい人向けHTML5入門 for 頭がヤバい人向け
HTML5入門 for 頭がヤバい人向け
 
Angular js meets cakephp at cloud on the beach 2014 前夜祭
Angular js meets cakephp at cloud on the beach 2014 前夜祭Angular js meets cakephp at cloud on the beach 2014 前夜祭
Angular js meets cakephp at cloud on the beach 2014 前夜祭
 
Rails勉強会資料
Rails勉強会資料Rails勉強会資料
Rails勉強会資料
 
うわ…私のEmacs力、低すぎ...?
うわ…私のEmacs力、低すぎ...?うわ…私のEmacs力、低すぎ...?
うわ…私のEmacs力、低すぎ...?
 

Viewers also liked

私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て
私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て
私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て
Osamu Shimoda
 
Awsで実現するseleniumテスト高速術
Awsで実現するseleniumテスト高速術Awsで実現するseleniumテスト高速術
Awsで実現するseleniumテスト高速術finoue
 
SeleniumIDEとSelenium WebDriver × Node.js Seleniumで業務効率化する15分
SeleniumIDEとSelenium WebDriver × Node.js Seleniumで業務効率化する15分SeleniumIDEとSelenium WebDriver × Node.js Seleniumで業務効率化する15分
SeleniumIDEとSelenium WebDriver × Node.js Seleniumで業務効率化する15分
松田 千尋
 
JenkinsとSeleniumの活用事例
JenkinsとSeleniumの活用事例JenkinsとSeleniumの活用事例
JenkinsとSeleniumの活用事例
Takeshi Kondo
 
Win7 * appium * androidで実機自動テストやってみた。
Win7 * appium * androidで実機自動テストやってみた。Win7 * appium * androidで実機自動テストやってみた。
Win7 * appium * androidで実機自動テストやってみた。
Naoto Kishino
 
大人の事情が自販機に超自然現象を起こした その2
大人の事情が自販機に超自然現象を起こした その2大人の事情が自販機に超自然現象を起こした その2
大人の事情が自販機に超自然現象を起こした その2
洋史 東平
 
デブサミ関西2012 B-3
デブサミ関西2012 B-3デブサミ関西2012 B-3
デブサミ関西2012 B-3
Koichi Sakata
 
20151201 私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て
20151201 私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て20151201 私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て
20151201 私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て
Osamu Shimoda
 
React+TypeScriptもいいぞ
React+TypeScriptもいいぞReact+TypeScriptもいいぞ
React+TypeScriptもいいぞ
Mitsuru Ogawa
 
CROSS 2014 - 言語CROSS:Delphi のご紹介
CROSS 2014 - 言語CROSS:Delphi のご紹介CROSS 2014 - 言語CROSS:Delphi のご紹介
CROSS 2014 - 言語CROSS:Delphi のご紹介
Jun Hosokawa
 
Appiumのテスト結果レポートをsahaginで作ってみる
Appiumのテスト結果レポートをsahaginで作ってみるAppiumのテスト結果レポートをsahaginで作ってみる
Appiumのテスト結果レポートをsahaginで作ってみる
Nozomi Ito
 
bashでWebブラウザ(Selenium WebDriver)を動かした話
bashでWebブラウザ(Selenium WebDriver)を動かした話bashでWebブラウザ(Selenium WebDriver)を動かした話
bashでWebブラウザ(Selenium WebDriver)を動かした話
洋史 東平
 
HTML5時代のUIテスト自動化
HTML5時代のUIテスト自動化HTML5時代のUIテスト自動化
HTML5時代のUIテスト自動化
Osamu Shimoda
 
「Delphiのマイグレーションを行うのであれば、これだけは知っておこう!」
「Delphiのマイグレーションを行うのであれば、これだけは知っておこう!」「Delphiのマイグレーションを行うのであれば、これだけは知っておこう!」
「Delphiのマイグレーションを行うのであれば、これだけは知っておこう!」
Embarcadero Technologies
 
Delphi ideを使わない開発スタイルの紹介
Delphi ideを使わない開発スタイルの紹介Delphi ideを使わない開発スタイルの紹介
Delphi ideを使わない開発スタイルの紹介Shinya Okano
 
なれる!IL
なれる!ILなれる!IL
なれる!IL
Hiroshi Maekawa
 
Delphi 言語に見る顕在化する言語のリスクとは?(2013/08/24)
Delphi 言語に見る顕在化する言語のリスクとは?(2013/08/24)Delphi 言語に見る顕在化する言語のリスクとは?(2013/08/24)
Delphi 言語に見る顕在化する言語のリスクとは?(2013/08/24)
Jun Hosokawa
 
2016 Seleniumゆく年くる年 @ 第4回 日本Seleniumユーザーコミュニティ勉強会
2016 Seleniumゆく年くる年 @ 第4回 日本Seleniumユーザーコミュニティ勉強会2016 Seleniumゆく年くる年 @ 第4回 日本Seleniumユーザーコミュニティ勉強会
2016 Seleniumゆく年くる年 @ 第4回 日本Seleniumユーザーコミュニティ勉強会
Hiroshi Toda
 
Delphi のダメな所
Delphi のダメな所Delphi のダメな所
Delphi のダメな所
Jun Hosokawa
 
Using Selenium 3 0
Using Selenium 3 0Using Selenium 3 0
Using Selenium 3 0
TEST Huddle
 

Viewers also liked (20)

私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て
私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て
私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て
 
Awsで実現するseleniumテスト高速術
Awsで実現するseleniumテスト高速術Awsで実現するseleniumテスト高速術
Awsで実現するseleniumテスト高速術
 
SeleniumIDEとSelenium WebDriver × Node.js Seleniumで業務効率化する15分
SeleniumIDEとSelenium WebDriver × Node.js Seleniumで業務効率化する15分SeleniumIDEとSelenium WebDriver × Node.js Seleniumで業務効率化する15分
SeleniumIDEとSelenium WebDriver × Node.js Seleniumで業務効率化する15分
 
JenkinsとSeleniumの活用事例
JenkinsとSeleniumの活用事例JenkinsとSeleniumの活用事例
JenkinsとSeleniumの活用事例
 
Win7 * appium * androidで実機自動テストやってみた。
Win7 * appium * androidで実機自動テストやってみた。Win7 * appium * androidで実機自動テストやってみた。
Win7 * appium * androidで実機自動テストやってみた。
 
大人の事情が自販機に超自然現象を起こした その2
大人の事情が自販機に超自然現象を起こした その2大人の事情が自販機に超自然現象を起こした その2
大人の事情が自販機に超自然現象を起こした その2
 
デブサミ関西2012 B-3
デブサミ関西2012 B-3デブサミ関西2012 B-3
デブサミ関西2012 B-3
 
20151201 私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て
20151201 私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て20151201 私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て
20151201 私がSeleniumを使ってスクリーンショットを撮るまでに出会った闇の全て
 
React+TypeScriptもいいぞ
React+TypeScriptもいいぞReact+TypeScriptもいいぞ
React+TypeScriptもいいぞ
 
CROSS 2014 - 言語CROSS:Delphi のご紹介
CROSS 2014 - 言語CROSS:Delphi のご紹介CROSS 2014 - 言語CROSS:Delphi のご紹介
CROSS 2014 - 言語CROSS:Delphi のご紹介
 
Appiumのテスト結果レポートをsahaginで作ってみる
Appiumのテスト結果レポートをsahaginで作ってみるAppiumのテスト結果レポートをsahaginで作ってみる
Appiumのテスト結果レポートをsahaginで作ってみる
 
bashでWebブラウザ(Selenium WebDriver)を動かした話
bashでWebブラウザ(Selenium WebDriver)を動かした話bashでWebブラウザ(Selenium WebDriver)を動かした話
bashでWebブラウザ(Selenium WebDriver)を動かした話
 
HTML5時代のUIテスト自動化
HTML5時代のUIテスト自動化HTML5時代のUIテスト自動化
HTML5時代のUIテスト自動化
 
「Delphiのマイグレーションを行うのであれば、これだけは知っておこう!」
「Delphiのマイグレーションを行うのであれば、これだけは知っておこう!」「Delphiのマイグレーションを行うのであれば、これだけは知っておこう!」
「Delphiのマイグレーションを行うのであれば、これだけは知っておこう!」
 
Delphi ideを使わない開発スタイルの紹介
Delphi ideを使わない開発スタイルの紹介Delphi ideを使わない開発スタイルの紹介
Delphi ideを使わない開発スタイルの紹介
 
なれる!IL
なれる!ILなれる!IL
なれる!IL
 
Delphi 言語に見る顕在化する言語のリスクとは?(2013/08/24)
Delphi 言語に見る顕在化する言語のリスクとは?(2013/08/24)Delphi 言語に見る顕在化する言語のリスクとは?(2013/08/24)
Delphi 言語に見る顕在化する言語のリスクとは?(2013/08/24)
 
2016 Seleniumゆく年くる年 @ 第4回 日本Seleniumユーザーコミュニティ勉強会
2016 Seleniumゆく年くる年 @ 第4回 日本Seleniumユーザーコミュニティ勉強会2016 Seleniumゆく年くる年 @ 第4回 日本Seleniumユーザーコミュニティ勉強会
2016 Seleniumゆく年くる年 @ 第4回 日本Seleniumユーザーコミュニティ勉強会
 
Delphi のダメな所
Delphi のダメな所Delphi のダメな所
Delphi のダメな所
 
Using Selenium 3 0
Using Selenium 3 0Using Selenium 3 0
Using Selenium 3 0
 

SeleniumWebDriverを使ってつまらない作業を駆逐してやる!!