WebDriverで遊ぼう

1,850 views

Published on

Selenium WebDriverを各言語(Java, Ruby, node.js, Python, C#)で使ってみた時の概要
元はオープンソースカンファレンス2014 Kansai@Kyoto 用に企画したものだが、ローカルを優先するという理由により落選したのでTechOyajiで発表。

Published in: Software
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,850
On SlideShare
0
From Embeds
0
Number of Embeds
33
Actions
Shares
0
Downloads
7
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

WebDriverで遊ぼう

  1. 1. WebDriverで 遊ぼう 東平洋史
  2. 2. 自己紹介 • 名前 東平洋史(とうへいひろふみ) • 職業 ある会社のテスト設計者 • Selenium使用歴 2014/3/4(月)~ • 前歴 NTT 武蔵野通研→NTTコミュニケーショ ンズ→某社→CTCシステムオペレーショ ンズ
  3. 3. Seleniumとは? • 原子番号34の元素 • 元素記号はSe • 第16族元素 – 酸素と同族 – ハロゲンの隣 • 灰色セレン – 金属セレン – 六方晶系 – 融点は217.4℃ • 赤色セレン –単斜晶系
  4. 4. では なくて
  5. 5. Seleniumとは? http://docs.seleniumhq.org/ • Webベースアプリケーション用テスト 自働化ツール • ライセンスはApache 2.0 License
  6. 6. Seleniumで出来ること • ユーザが行なった操作の記録・スク リプト化 –クリック、ダブルクリック –文字入力 など • ユーザが行なった操作の再現実行 ⇒ブラウザのテスト、自動実行
  7. 7. Selenium IDE(1) • Seleniumのテストケース開発用ツー ル • Mozilla Firefox の add-on http://docs.seleniumhq.org/downloa d/
  8. 8. Selenium IDE(2) ツールバー テストケースペイン ログ/リファレンス/UI-Element/Rollupペイン メニューバー
  9. 9. Selenium IDE(3) • ツールバー 1. Speed Control 実行速度調節 2. Run All スクリプトをすべて 実行 3. Run 選択されているス クリプトを実行 4. Pause/Resume 一時停止/再開 5. Step コマンドをステップ (一つずつ)実行 6. Record ブラウザの操作を 記録 1 2 3 4 5 6
  10. 10. Selenium IDE使用例
  11. 11. ここで 実習
  12. 12. 実習内容 次のテストを行なうスクリプトの作成 1. Googleで「小江戸らぐ」を検索 2. 次のページを表示 OSS支える!コミュニティー訪問~小江戸らぐ - 川越を中心にゆるく活動するLinuxユー ザー会 3. 写真をクリックして拡大表示
  13. 13. Selenium IDEでの自動実行の手順 コマンド 対象 値 open / type id=lst-ib 小江戸らぐ click name=btnK waitForElementPr esent //a[@href='http://itpro.nikkei bp.co.jp/article/COLUMN/201 31003/508665/'] clickAndWait //a[@href='http://itpro.nikkei bp.co.jp/article/COLUMN/201 31003/508665/'] click css=img[alt="小江戸らぐ "]
  14. 14. 機能は 貧弱
  15. 15. Selenium IDEの貧弱さ • 大域変数しかない – テストケースすべてで同じ変数しか使えない • 編集機能は貧弱 • Webブラウザしか操作できない – Mozilla Firefoxのadd-onだから • Mozilla Firefoxでしか使えない – Mozilla Firefoxのadd-onだから
  16. 16. という わけで
  17. 17. Selenium WebDriver http://docs.seleniumhq.org/projects/webdriver/ • プログラムからWebブラウザ制御 • 制御可能ブラウザ – Internet Explorer、Mozilla Firefox、Google Chrome、 Opera、Android標準Webブラウザ、Safari(iOS) • 使用可能言語 – Java、C#、Ruby、Python、Javascript(Node)
  18. 18. Selenium WebDriverは高機能 • 局所変数使用可能 • 強力なIDEで編集可能 – Eclipse, IntelliJ IDEA, … • Webブラウザ以外も操作可能 – プログラムだから • Mozilla Firefox以外のブラウザも操作可能 – プログラムだから
  19. 19. Selenium WebDriver の仕組 プログラム Firefox Driver Chrome Driver Internet Explorer Driver driver server Mozilla Firefox Google Chrome Internet Explorer Web Browser
  20. 20. ここで 実習
  21. 21. 実習内容 次のテストを行なうプログラムの作成 1. Google Chrome 起動 2. Googleで「小江戸らぐ」を検索 3. 次のページを表示 OSS支える!コミュニティー訪問~小江戸らぐ - 川越を中心にゆるく活動するLinuxユー ザー会 4. 写真をクリックして拡大表示
  22. 22. 次の組み合わせで作りました Java Ruby node.js Python C# Google Chrome Mozilla Firefox Internet Explorer
  23. 23. どうやって 作るの?
  24. 24. 導入方法 1. 言語の処理系インストール 2. プログラミングの環境インストール 3. Selenium WebDriver のライブラリインス トール 4. 各ドライバのインストール 5. Selenium Server のインストール 6. プログラミング
  25. 25. 各言語の処理系(1) • Java SE Development Kit(JDK) 8 http://www.oracle.com/technetwork/java/javase/d ownloads/jdk8-downloads-2133151.html • Ruby – https://www.ruby-lang.org/ja/downloads/ – http://rubyinstaller.org/ (Windows用)
  26. 26. 各言語の処理系(2) • node.js – http://nodejs.org/download/ • Python – https://www.python.org/ Python versions are 2.7, 3.2, 3.3 and 3.4 • C# – Microsoft Visual Studio Express 2013 for Windows Desktop http://www.visualstudio.com/ja-jp/products/visual- studio-express-vs.aspx
  27. 27. プログラミングの環境 • eclipse(Java) https://www.eclipse.org/ • IntelliJ IDEA(Java) http://www.jetbrains.com/idea/ • GNU Emacs(Ruby, node.js, Python) http://sourceforge.jp/projects/gnupa ck/releases/
  28. 28. 各言語用ライブラリ(1) • Java –http://docs.seleniumhq.org/docs/03_ webdriver.jsp • Ruby –https://code.google.com/p/selenium/ wiki/RubyBindings
  29. 29. 各言語用ライブラリ(2) • WebDriverJS(node.js) –https://code.google.com/p/selenium/ wiki/WebDriverJs#WebDriverJS_User’s _Guide • Python –http://selenium- python.readthedocs.org/en/latest/ind ex.html
  30. 30. Selenium WebDriver(Java) • http://docs.seleniumhq.org/d ownload/ から selenium-java- 2.42.2.zip を取得し、 CLASSPATHに追加
  31. 31. Selenium WebDriver (Ruby) • 次のコマンドを実行 gem install selenium- webdriver
  32. 32. Selenium WebDriver (Python) • 次のコマンドを実行 pip install selenium http://selenium- python.readthedocs.org/en /latest/index.html
  33. 33. Selenium WebDriver(C#) • NuGet Install-Packageで次のパッケージ をインストール –Install-Package Selenium.RC –Install-Package Selenium.WebDriver –Install-Package Selenium.WebDriverBackedSelenium –Install-Package Selenium.Support http://docs.seleniumhq.org/download/
  34. 34. Selenium WebDriver (node.js) WebDriver.js を使う場合は次のコマンドを 実行 npm install selenium-webdriver
  35. 35. node.jsのライブラリ • WebDriverJS(公式) • jwebdriver • webdriver.js • wurnout • wd http://www.slideshare.net/ssuser3eb8 d69/javascriptwebdriver より
  36. 36. Selenium Server/Driver 各ドライバ/Selenium Server のインストール 1. ダウンロードする http://docs.seleniumhq.org/download/ 2. パスの通ったところに実行形式(exeなど)や jar ファイルを置く – Selenium Server – Internet Explorer Driver – Chrome Driver
  37. 37. まとめ • Selenium – Webブラウザ自動実行用テストツール – Apacheライセンス • Selenium IDE – Seleniumスクリプト作成用統合環境 – Mozilla Firefoxのアドオン • Selenium WebDriver – Webブラウザの自動実行制御
  38. 38. おしまい (^.^)/~~~

×