SlideShare uma empresa Scribd logo
1 de 30
Baixar para ler offline
Selenium入門
2021-02-12 社内勉強会
onozaty
Seleniumとは
• Webブラウザの操作を自動化するためのフレームワーク
• 主にWebアプリケーションのE2Eテストに利用
• ブラウザ操作をプログラムで行うことができる
• テスト以外の自動化ツールでも利用
• 単一のAPIで様々なブラウザを同じように操作可能
• 各ブラウザ×各OSの組み合わせで同じことを実行できる
Seleniumの公式サイト https://www.selenium.dev/
ドキュメントの日本語訳 https://www.selenium.dev/documentation/ja/
Seleniumの昔と今
Seleniumの昔と今 - Selenium RC
初期(10年以上前)のSelenium 1は、Selenium RC(Remote Control)とい
う仕組みを使っていた
• プロキシのような形で、テスト対象のサイトにJavaScriptを埋め込
んで操作するような仕組み
• ブラウザのセキュリティに起因する制約あり
• アーキテクチャ的に複雑→安定しない要因に
※ Selenium Core、Selenium RCといったキーワードが出てきたら、昔の情報なので要注意
Seleniumの昔と今 - Selenium WebDriver
Selenium 2からWebDriverを使うように
• WebDriverを使うことで、直接ブラウザを操作できるようになっ
た
• Selenium RCの時のようなセキュリティ制限を受けなくなった
• シンプルな構成となった→安定するように
• 現在ではW3Cで標準化されており、各ブラウザ毎にWebDriverの
実装が用意されている
• 主にブラウザベンダが提供している
Seleniumを構成する要素
• Selenium WebDriver
• Selenium IDE
• Selenium Grid
Selenium WebDriver
https://www.selenium.dev/documentation/ja/webdriver/
Selenium WebDriver
• WebDriverを使うことで、ブラウザ操作をプログラムで行うことが
できる
画像引用元: https://www.selenium.dev/documentation/ja/webdriver/understanding_the_components/
各プログラミング言語(Java、
Python、C#、Ruby、JavaScriptな
ど)のバインディングが提供されて
いる。
PHPのようにSelenium公式にはな
くて、他から提供されているもの
もあり。
各ブラウザ(Chrome、Firefox、
Edgeなど)に対応したDriverが提供
されている。
Web APIとして要求を受け付けて、
ブラウザを操作する。
Selenium WebDriver - 利用方法
• 実行する際には、各ブラウザ用のDriverを入手しパス等に設定する
• ブラウザ毎の入手元の情報は下記にて
• https://www.selenium.dev/documentation/en/webdriver/driver_requirements/#quick-
reference
Selenium WebDriver - 利用方法
System.setProperty("webdriver.chrome.driver", "C:¥¥selenium¥¥chromedriver.exe");
WebDriver driver = new ChromeDriver();
// サイトを開く
driver.get("https://selenium.dev");
// id=search-byの要素を選択し、abcといった文字を入力
driver.findElement(By.id("search-by")).click();
driver.findElement(By.id("search-by")).sendKeys("abc");
// id=search-buttonの要素を探してclick
driver.findElement(By.id("search-button")).click();
JavaだとシステムプロパティとしてダウンロードしたDriverのパスを設定
WebDriverのインスタンスを生成し、そのインスタンスを通して操作
※今後出てくるコードは全てJavaでのコード
Selenium WebDriver - ダウンロードの手間
• 各ブラウザのDriverをダウンロードしてきて、パス等に設定するの
は結構手間
• ブラウザのバージョンが上がる毎にDriverをダウンロードしてこなければな
らない
• 動かないと思ったら、インストールされているブラウザのバージョンと
Driverがアンマッチになっているといったことがよくある
Selenium WebDriver - WebDriverManager
• WebDriverManagerを使うと、インストールされているブラウザの
バージョンに応じたDriverをダウンロードして、システムプロパ
ティに設定してくれる
• https://github.com/bonigarcia/webdrivermanager
• 下記1行で終わり
WebDriverManager.chromedriver().setup();
Selenium WebDriverでのデモ
https://github.com/onozaty/selenium-sandbox/tree/main/selenium-junit
WebDriverを使いやすくしたもの
• Selenium WebDriver自体は、テスト用というより、ブラウザ操作の
ためのもの
• コードが冗長になりがち
• テストランナーやアサーションは別途用意する必要がある
WebDriverを使いやすくしたもの
• WebDriverを内部で使いながら、テストを書きやすくするためのラ
イブラリがいくつもある
• Selenide https://selenide.org/
• Java
• Geb https://gebish.org/
• Groovy
• WebdriverIO https://webdriver.io/
• Node.js
Selenide
System.setProperty("webdriver.chrome.driver", "C:¥¥selenium¥¥chromedriver.exe");
WebDriver driver = new ChromeDriver();
driver.get("http://192.168.33.10/");
driver.findElement(By.cssSelector("a[href=¥"/login¥"]")).click();
driver.findElement(By.id("username")).sendKeys("admin");
driver.findElement(By.id("password")).sendKeys("password");
driver.findElement(By.id("login-submit")).click();
assertThat(driver.findElement(By.cssSelector("h2")).getText())
.isEqualTo("title");
Configuration.browser = WebDriverRunner.CHROME;
open("http://192.168.33.10/");
$("a[href=¥"/login¥"]").click();
$("#username").sendKeys("admin");
$("#password").sendKeys("password");
$("#login-submit").click();
$("h2").shouldHave(exactText("title"));
上記をSelenideで書くと、下記のように簡潔になる
Selenium IDE
https://www.selenium.dev/selenium-ide/
Selenium IDE
• Selenium IDEはブラウザ操作の記録、実行が行えるブラウザの拡張
機能
• ChromeとFirefox版がある
Selenium IDE
• 昔のSelenium IDEはFirefox版のみで、FirefoxがXUL/XPCOMベースの
拡張機能を廃止したことで、一度死んだ
• 今のものは、まったく新しいものとして作られたもの
• 当初は旧IDEからかなり機能が落ちるものだったが、コマンドも揃ってきて、
今現在では十分使えるものとなった
• コマンド一覧 https://docs.seleniumhq.org/selenium-ide/docs/en/api/commands/
Selenium IDE - 操作方法
• Selenium IDEを起動し、ブラウザ操作をレコーディング
• Assertもブラウザ上で右クリックから追加することができる
• for each や if文などの制御構文も書くことができる
• コマンドとして直接入力することで複雑な動きも実現
• コマンド一覧 https://docs.seleniumhq.org/selenium-ide/docs/en/api/commands/
• 一連の操作を繰り返し実行できる
• ファイル(*.side)としても保存できるので、再度開いて実行ということも可
能
Selenium IDEでのデモ
Selenium IDE - selenium-side-runner
• 保存したファイル(*.side)は、selenium-side-runner というコマンド
ラインツールでも実行可能
• Node.js で書かれたツールになっている
• https://www.selenium.dev/selenium-ide/docs/en/introduction/command-
line-runner
Selenium IDE と WebDriver
• Selenium IDEとSelenium WebDriverは全く異なる仕組みとなるが、
Selenium IDEの内容を、WebDriverでのコードとしてエクスポート
することができる
• 最初のうちは、IDEからエクスポートした
コードを元にすると、WebDriverのコードが
書きやすいかも
Selenium Grid
https://www.selenium.dev/documentation/ja/grid/
Selenium Grid
• Selenium Gridを使うことで、複数のリモートマシン上でSeleniumを
実行することができる
• 異なるブラウザ、異なるOS上でのテストを一元管理しながら、複数のリ
モートマシン上で実行できる
• 並列で実行することで、テストの時間短縮を行える
Selenium Grid
画像引用元: https://www.selenium.dev/documentation/ja/grid/grid_4/components_of_a_grid/
Selenium以外のもの
Selenium以外のブラウザ自動化ツール
• Puppeteer https://github.com/puppeteer/puppeteer
• ChromeのDevTools Protocolを使って操作するNode.jsのライブラリ
• DevTools Protocolを使うので、WebDriverより高機能なことができる
• ChromeDriverも内部的にはDevTools Protocolを使っているが、WebDriverとして定義さ
れている部分しか現状は触れない
• 次のSelenium 4でDevToolsをネイティブサポートする予定
Selenium以外のブラウザ自動化ツール
• Cypress https://www.cypress.io/
• TestCafe https://devexpress.github.io/testcafe/
• どっちもテストに特化したフレームワーク
• オールインワン、準備が楽、学習コストが低い
• プロキシやブラウザの拡張機能使って、ページ上でJavaScriptを実行するよ
うな仕組み
おわり
ご清聴ありがとうございました

Mais conteúdo relacionado

Mais procurados

オブジェクト指向できていますか?
オブジェクト指向できていますか?オブジェクト指向できていますか?
オブジェクト指向できていますか?
Moriharu Ohzu
 
凡人の凡人による凡人のためのデザインパターン第一幕 Public
凡人の凡人による凡人のためのデザインパターン第一幕 Public凡人の凡人による凡人のためのデザインパターン第一幕 Public
凡人の凡人による凡人のためのデザインパターン第一幕 Public
bonjin6770 Kurosawa
 
日本語テストメソッドについて
日本語テストメソッドについて日本語テストメソッドについて
日本語テストメソッドについて
kumake
 

Mais procurados (20)

View customize1.2.0の紹介
View customize1.2.0の紹介View customize1.2.0の紹介
View customize1.2.0の紹介
 
オブジェクト指向できていますか?
オブジェクト指向できていますか?オブジェクト指向できていますか?
オブジェクト指向できていますか?
 
RedmineのFAQとアンチパターン集
RedmineのFAQとアンチパターン集RedmineのFAQとアンチパターン集
RedmineのFAQとアンチパターン集
 
コンテナイメージの脆弱性スキャンについて
コンテナイメージの脆弱性スキャンについてコンテナイメージの脆弱性スキャンについて
コンテナイメージの脆弱性スキャンについて
 
新たなgitのブランチモデル「Git Feature Flow」!Git Flow,Git Hub Flow,Git Lab Flowを超えれるか?
新たなgitのブランチモデル「Git Feature Flow」!Git Flow,Git Hub Flow,Git Lab Flowを超えれるか?新たなgitのブランチモデル「Git Feature Flow」!Git Flow,Git Hub Flow,Git Lab Flowを超えれるか?
新たなgitのブランチモデル「Git Feature Flow」!Git Flow,Git Hub Flow,Git Lab Flowを超えれるか?
 
View customize plugin for Redmineの紹介 (2019年版)
View customize plugin for Redmineの紹介 (2019年版)View customize plugin for Redmineの紹介 (2019年版)
View customize plugin for Redmineの紹介 (2019年版)
 
Serf / Consul 入門 ~仕事を楽しくしよう~
Serf / Consul 入門 ~仕事を楽しくしよう~Serf / Consul 入門 ~仕事を楽しくしよう~
Serf / Consul 入門 ~仕事を楽しくしよう~
 
凡人の凡人による凡人のためのデザインパターン第一幕 Public
凡人の凡人による凡人のためのデザインパターン第一幕 Public凡人の凡人による凡人のためのデザインパターン第一幕 Public
凡人の凡人による凡人のためのデザインパターン第一幕 Public
 
なぜOpenID Connectが必要となったのか、その歴史的背景
なぜOpenID Connectが必要となったのか、その歴史的背景なぜOpenID Connectが必要となったのか、その歴史的背景
なぜOpenID Connectが必要となったのか、その歴史的背景
 
Go入門
Go入門Go入門
Go入門
 
自動テストの誤解とアンチパターン in 楽天 Tech Talk
自動テストの誤解とアンチパターン in 楽天 Tech Talk自動テストの誤解とアンチパターン in 楽天 Tech Talk
自動テストの誤解とアンチパターン in 楽天 Tech Talk
 
C#や.NET Frameworkがやっていること
C#や.NET FrameworkがやっていることC#や.NET Frameworkがやっていること
C#や.NET Frameworkがやっていること
 
「プロジェクト管理」を超えた Redmine 活用の道のりとこれから
「プロジェクト管理」を超えた Redmine 活用の道のりとこれから「プロジェクト管理」を超えた Redmine 活用の道のりとこれから
「プロジェクト管理」を超えた Redmine 活用の道のりとこれから
 
チケット駆動開発現場の最前線.pdf
チケット駆動開発現場の最前線.pdfチケット駆動開発現場の最前線.pdf
チケット駆動開発現場の最前線.pdf
 
全文検索でRedmineをさらに活用!
全文検索でRedmineをさらに活用!全文検索でRedmineをさらに活用!
全文検索でRedmineをさらに活用!
 
日本語テストメソッドについて
日本語テストメソッドについて日本語テストメソッドについて
日本語テストメソッドについて
 
JenkinsのAWS連携
JenkinsのAWS連携JenkinsのAWS連携
JenkinsのAWS連携
 
OpenID ConnectとAndroidアプリのログインサイクル
OpenID ConnectとAndroidアプリのログインサイクルOpenID ConnectとAndroidアプリのログインサイクル
OpenID ConnectとAndroidアプリのログインサイクル
 
今だからこそ知りたい Docker Compose/Swarm 入門
今だからこそ知りたい Docker Compose/Swarm 入門今だからこそ知りたい Docker Compose/Swarm 入門
今だからこそ知りたい Docker Compose/Swarm 入門
 
これからSpringを使う開発者が知っておくべきこと
これからSpringを使う開発者が知っておくべきことこれからSpringを使う開発者が知っておくべきこと
これからSpringを使う開発者が知っておくべきこと
 

Semelhante a Selenium入門

テスト自動化の様々な道具を使ってみた四方山話
テスト自動化の様々な道具を使ってみた四方山話テスト自動化の様々な道具を使ってみた四方山話
テスト自動化の様々な道具を使ってみた四方山話
haljik Seiji
 

Semelhante a Selenium入門 (20)

Selenium入門(2023年版)
Selenium入門(2023年版)Selenium入門(2023年版)
Selenium入門(2023年版)
 
サイボウズがWebアプリ自動テスト に活用しているossツールの紹介
サイボウズがWebアプリ自動テスト に活用しているossツールの紹介サイボウズがWebアプリ自動テスト に活用しているossツールの紹介
サイボウズがWebアプリ自動テスト に活用しているossツールの紹介
 
Selenium2(web driver)
Selenium2(web driver)Selenium2(web driver)
Selenium2(web driver)
 
Selenium IDE for primer
Selenium IDE for primerSelenium IDE for primer
Selenium IDE for primer
 
WEB開発動作テストの自動化 を行うSeleniumの紹介
WEB開発動作テストの自動化 を行うSeleniumの紹介WEB開発動作テストの自動化 を行うSeleniumの紹介
WEB開発動作テストの自動化 を行うSeleniumの紹介
 
Ja sst東北2013
Ja sst東北2013Ja sst東北2013
Ja sst東北2013
 
海外のSeleniumカンファレンスではどんな発表がされているのか2014
海外のSeleniumカンファレンスではどんな発表がされているのか2014海外のSeleniumカンファレンスではどんな発表がされているのか2014
海外のSeleniumカンファレンスではどんな発表がされているのか2014
 
JenkinsとSeleniumの活用事例
JenkinsとSeleniumの活用事例JenkinsとSeleniumの活用事例
JenkinsとSeleniumの活用事例
 
テスト自動化の様々な道具を使ってみた四方山話
テスト自動化の様々な道具を使ってみた四方山話テスト自動化の様々な道具を使ってみた四方山話
テスト自動化の様々な道具を使ってみた四方山話
 
Selenium
SeleniumSelenium
Selenium
 
Selenium2(web driver) ide編
Selenium2(web driver) ide編Selenium2(web driver) ide編
Selenium2(web driver) ide編
 
4時間で学ぶ、効率的な自動テストスクリプトのメンテナンス
4時間で学ぶ、効率的な自動テストスクリプトのメンテナンス4時間で学ぶ、効率的な自動テストスクリプトのメンテナンス
4時間で学ぶ、効率的な自動テストスクリプトのメンテナンス
 
ローカル環境のテスト自動化【勉強会資料】
ローカル環境のテスト自動化【勉強会資料】ローカル環境のテスト自動化【勉強会資料】
ローカル環境のテスト自動化【勉強会資料】
 
Win7 * appium * androidで実機自動テストやってみた。
Win7 * appium * androidで実機自動テストやってみた。Win7 * appium * androidで実機自動テストやってみた。
Win7 * appium * androidで実機自動テストやってみた。
 
5分で分かるselenium conference berlin 2017
5分で分かるselenium conference berlin 20175分で分かるselenium conference berlin 2017
5分で分かるselenium conference berlin 2017
 
エンタープライズ開発でのSelenium活用事例
エンタープライズ開発でのSelenium活用事例エンタープライズ開発でのSelenium活用事例
エンタープライズ開発でのSelenium活用事例
 
Selenium勉強会
Selenium勉強会Selenium勉強会
Selenium勉強会
 
20161218 selenium study4
20161218 selenium study420161218 selenium study4
20161218 selenium study4
 
WebDriverで始めるUIスモークテスティング入門
WebDriverで始めるUIスモークテスティング入門WebDriverで始めるUIスモークテスティング入門
WebDriverで始めるUIスモークテスティング入門
 
Seleniumまとめ
SeleniumまとめSeleniumまとめ
Seleniumまとめ
 

Mais de onozaty

Redmineの画面をあなた好みにカスタマイズ - View customize pluginの紹介 - Redmine Japan 2020
Redmineの画面をあなた好みにカスタマイズ - View customize pluginの紹介 - Redmine Japan 2020Redmineの画面をあなた好みにカスタマイズ - View customize pluginの紹介 - Redmine Japan 2020
Redmineの画面をあなた好みにカスタマイズ - View customize pluginの紹介 - Redmine Japan 2020
onozaty
 
業務で使うIRC
業務で使うIRC業務で使うIRC
業務で使うIRC
onozaty
 

Mais de onozaty (17)

チームで開発するための環境を整える
チームで開発するための環境を整えるチームで開発するための環境を整える
チームで開発するための環境を整える
 
Java8から17へ
Java8から17へJava8から17へ
Java8から17へ
 
今からでも遅くないDBマイグレーション - Flyway と SchemaSpy の紹介 -
今からでも遅くないDBマイグレーション - Flyway と SchemaSpy の紹介 -今からでも遅くないDBマイグレーション - Flyway と SchemaSpy の紹介 -
今からでも遅くないDBマイグレーション - Flyway と SchemaSpy の紹介 -
 
Redmine issue assign notice plugin の紹介
Redmine issue assign notice plugin の紹介Redmine issue assign notice plugin の紹介
Redmine issue assign notice plugin の紹介
 
最近作ったもの
最近作ったもの最近作ったもの
最近作ったもの
 
Redmineの画面をあなた好みにカスタマイズ - View customize pluginの紹介 - Redmine Japan 2020
Redmineの画面をあなた好みにカスタマイズ - View customize pluginの紹介 - Redmine Japan 2020Redmineの画面をあなた好みにカスタマイズ - View customize pluginの紹介 - Redmine Japan 2020
Redmineの画面をあなた好みにカスタマイズ - View customize pluginの紹介 - Redmine Japan 2020
 
「伝わるチケット」の書き方
「伝わるチケット」の書き方「伝わるチケット」の書き方
「伝わるチケット」の書き方
 
WebSocketでカメラの映像を共有してみた
WebSocketでカメラの映像を共有してみたWebSocketでカメラの映像を共有してみた
WebSocketでカメラの映像を共有してみた
 
Lombokの紹介
Lombokの紹介Lombokの紹介
Lombokの紹介
 
Spring Bootを触ってみた
Spring Bootを触ってみたSpring Bootを触ってみた
Spring Bootを触ってみた
 
30歳過ぎてもエンジニアでいるためにやったこと
30歳過ぎてもエンジニアでいるためにやったこと30歳過ぎてもエンジニアでいるためにやったこと
30歳過ぎてもエンジニアでいるためにやったこと
 
View customize pluginを使いこなす
View customize pluginを使いこなすView customize pluginを使いこなす
View customize pluginを使いこなす
 
View Customize Pluginで出来ること
View Customize Pluginで出来ることView Customize Pluginで出来ること
View Customize Pluginで出来ること
 
技術書のススメ
技術書のススメ技術書のススメ
技術書のススメ
 
課題管理と情報共有のためのツール群
課題管理と情報共有のためのツール群課題管理と情報共有のためのツール群
課題管理と情報共有のためのツール群
 
お試し用のLinux環境を作る
お試し用のLinux環境を作るお試し用のLinux環境を作る
お試し用のLinux環境を作る
 
業務で使うIRC
業務で使うIRC業務で使うIRC
業務で使うIRC
 

Último

Último (10)

論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
 
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
 
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー  DS20L  カタログ  LiDARデバイスLoRaWANスマート距離検出センサー  DS20L  カタログ  LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
 
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
 
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
 
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
 
Utilizing Ballerina for Cloud Native Integrations
Utilizing Ballerina for Cloud Native IntegrationsUtilizing Ballerina for Cloud Native Integrations
Utilizing Ballerina for Cloud Native Integrations
 
新人研修 後半 2024/04/26の勉強会で発表されたものです。
新人研修 後半        2024/04/26の勉強会で発表されたものです。新人研修 後半        2024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
 
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
 
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアルLoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
 

Selenium入門

  • 2. Seleniumとは • Webブラウザの操作を自動化するためのフレームワーク • 主にWebアプリケーションのE2Eテストに利用 • ブラウザ操作をプログラムで行うことができる • テスト以外の自動化ツールでも利用 • 単一のAPIで様々なブラウザを同じように操作可能 • 各ブラウザ×各OSの組み合わせで同じことを実行できる Seleniumの公式サイト https://www.selenium.dev/ ドキュメントの日本語訳 https://www.selenium.dev/documentation/ja/
  • 4. Seleniumの昔と今 - Selenium RC 初期(10年以上前)のSelenium 1は、Selenium RC(Remote Control)とい う仕組みを使っていた • プロキシのような形で、テスト対象のサイトにJavaScriptを埋め込 んで操作するような仕組み • ブラウザのセキュリティに起因する制約あり • アーキテクチャ的に複雑→安定しない要因に ※ Selenium Core、Selenium RCといったキーワードが出てきたら、昔の情報なので要注意
  • 5. Seleniumの昔と今 - Selenium WebDriver Selenium 2からWebDriverを使うように • WebDriverを使うことで、直接ブラウザを操作できるようになっ た • Selenium RCの時のようなセキュリティ制限を受けなくなった • シンプルな構成となった→安定するように • 現在ではW3Cで標準化されており、各ブラウザ毎にWebDriverの 実装が用意されている • 主にブラウザベンダが提供している
  • 8. Selenium WebDriver • WebDriverを使うことで、ブラウザ操作をプログラムで行うことが できる 画像引用元: https://www.selenium.dev/documentation/ja/webdriver/understanding_the_components/ 各プログラミング言語(Java、 Python、C#、Ruby、JavaScriptな ど)のバインディングが提供されて いる。 PHPのようにSelenium公式にはな くて、他から提供されているもの もあり。 各ブラウザ(Chrome、Firefox、 Edgeなど)に対応したDriverが提供 されている。 Web APIとして要求を受け付けて、 ブラウザを操作する。
  • 9. Selenium WebDriver - 利用方法 • 実行する際には、各ブラウザ用のDriverを入手しパス等に設定する • ブラウザ毎の入手元の情報は下記にて • https://www.selenium.dev/documentation/en/webdriver/driver_requirements/#quick- reference
  • 10. Selenium WebDriver - 利用方法 System.setProperty("webdriver.chrome.driver", "C:¥¥selenium¥¥chromedriver.exe"); WebDriver driver = new ChromeDriver(); // サイトを開く driver.get("https://selenium.dev"); // id=search-byの要素を選択し、abcといった文字を入力 driver.findElement(By.id("search-by")).click(); driver.findElement(By.id("search-by")).sendKeys("abc"); // id=search-buttonの要素を探してclick driver.findElement(By.id("search-button")).click(); JavaだとシステムプロパティとしてダウンロードしたDriverのパスを設定 WebDriverのインスタンスを生成し、そのインスタンスを通して操作 ※今後出てくるコードは全てJavaでのコード
  • 11. Selenium WebDriver - ダウンロードの手間 • 各ブラウザのDriverをダウンロードしてきて、パス等に設定するの は結構手間 • ブラウザのバージョンが上がる毎にDriverをダウンロードしてこなければな らない • 動かないと思ったら、インストールされているブラウザのバージョンと Driverがアンマッチになっているといったことがよくある
  • 12. Selenium WebDriver - WebDriverManager • WebDriverManagerを使うと、インストールされているブラウザの バージョンに応じたDriverをダウンロードして、システムプロパ ティに設定してくれる • https://github.com/bonigarcia/webdrivermanager • 下記1行で終わり WebDriverManager.chromedriver().setup();
  • 14. WebDriverを使いやすくしたもの • Selenium WebDriver自体は、テスト用というより、ブラウザ操作の ためのもの • コードが冗長になりがち • テストランナーやアサーションは別途用意する必要がある
  • 15. WebDriverを使いやすくしたもの • WebDriverを内部で使いながら、テストを書きやすくするためのラ イブラリがいくつもある • Selenide https://selenide.org/ • Java • Geb https://gebish.org/ • Groovy • WebdriverIO https://webdriver.io/ • Node.js
  • 16. Selenide System.setProperty("webdriver.chrome.driver", "C:¥¥selenium¥¥chromedriver.exe"); WebDriver driver = new ChromeDriver(); driver.get("http://192.168.33.10/"); driver.findElement(By.cssSelector("a[href=¥"/login¥"]")).click(); driver.findElement(By.id("username")).sendKeys("admin"); driver.findElement(By.id("password")).sendKeys("password"); driver.findElement(By.id("login-submit")).click(); assertThat(driver.findElement(By.cssSelector("h2")).getText()) .isEqualTo("title"); Configuration.browser = WebDriverRunner.CHROME; open("http://192.168.33.10/"); $("a[href=¥"/login¥"]").click(); $("#username").sendKeys("admin"); $("#password").sendKeys("password"); $("#login-submit").click(); $("h2").shouldHave(exactText("title")); 上記をSelenideで書くと、下記のように簡潔になる
  • 18. Selenium IDE • Selenium IDEはブラウザ操作の記録、実行が行えるブラウザの拡張 機能 • ChromeとFirefox版がある
  • 19. Selenium IDE • 昔のSelenium IDEはFirefox版のみで、FirefoxがXUL/XPCOMベースの 拡張機能を廃止したことで、一度死んだ • 今のものは、まったく新しいものとして作られたもの • 当初は旧IDEからかなり機能が落ちるものだったが、コマンドも揃ってきて、 今現在では十分使えるものとなった • コマンド一覧 https://docs.seleniumhq.org/selenium-ide/docs/en/api/commands/
  • 20. Selenium IDE - 操作方法 • Selenium IDEを起動し、ブラウザ操作をレコーディング • Assertもブラウザ上で右クリックから追加することができる • for each や if文などの制御構文も書くことができる • コマンドとして直接入力することで複雑な動きも実現 • コマンド一覧 https://docs.seleniumhq.org/selenium-ide/docs/en/api/commands/ • 一連の操作を繰り返し実行できる • ファイル(*.side)としても保存できるので、再度開いて実行ということも可 能
  • 22. Selenium IDE - selenium-side-runner • 保存したファイル(*.side)は、selenium-side-runner というコマンド ラインツールでも実行可能 • Node.js で書かれたツールになっている • https://www.selenium.dev/selenium-ide/docs/en/introduction/command- line-runner
  • 23. Selenium IDE と WebDriver • Selenium IDEとSelenium WebDriverは全く異なる仕組みとなるが、 Selenium IDEの内容を、WebDriverでのコードとしてエクスポート することができる • 最初のうちは、IDEからエクスポートした コードを元にすると、WebDriverのコードが 書きやすいかも
  • 25. Selenium Grid • Selenium Gridを使うことで、複数のリモートマシン上でSeleniumを 実行することができる • 異なるブラウザ、異なるOS上でのテストを一元管理しながら、複数のリ モートマシン上で実行できる • 並列で実行することで、テストの時間短縮を行える
  • 28. Selenium以外のブラウザ自動化ツール • Puppeteer https://github.com/puppeteer/puppeteer • ChromeのDevTools Protocolを使って操作するNode.jsのライブラリ • DevTools Protocolを使うので、WebDriverより高機能なことができる • ChromeDriverも内部的にはDevTools Protocolを使っているが、WebDriverとして定義さ れている部分しか現状は触れない • 次のSelenium 4でDevToolsをネイティブサポートする予定
  • 29. Selenium以外のブラウザ自動化ツール • Cypress https://www.cypress.io/ • TestCafe https://devexpress.github.io/testcafe/ • どっちもテストに特化したフレームワーク • オールインワン、準備が楽、学習コストが低い • プロキシやブラウザの拡張機能使って、ページ上でJavaScriptを実行するよ うな仕組み