share facebook facebook2 twitter menu hatena pocket slack

2014.11.07 FRI

朝の 3 分ハッキング(3)Selenium IDE と Rspec で Web アプリケーションのテストをする(という程では無いけど)

川原 洋平

WRITTEN BY川原 洋平

どうも、もうすぐ 40 歳、アラフォーのかっぱ@inokara)です。

はじめに

今までその存在すら知らなかった Selenium IDE を触ってみたのでメモです。自分の中で 2014 年の産業革命の一つにノミネート間違いナシのツールでございます…。


Selenium IDE の準備

準備はとても簡単です。

  • Firefox をインストール(入っていない環境を見ることが少ないですね)
  • Selenium IDE のインストール(Firefox のアドオンなのでインストールも簡単です)

ちなみに…Selenium IDE とは Selenium と呼ばれる Web UI テストツールの Firefox アドオンです。Selenium はブラウザに表示されるボタンやプルダウン等の要素を取得して自動で操作するツール(という認識)です。


実演

ブラウザでの操作を録画

Selenium を使って、ブラウザでの操作を記録する

録画したものを書き出す(テストケースをエクスポートしましょう)

Selenium を使って、記録した操作をテストケースとして書き出す

書きだされた spec ファイル

以下のような spec ファイルが書き出されます。(著作権等の関係で対象のページは公開しません…)

require "json"
require "selenium-webdriver"
require "rspec"
include RSpec::Expectations

describe "Test" do

  before(:each) do
    @driver = Selenium::WebDriver.for :firefox
    @base_url = "http://www.yahoo.co.jp/"
    @accept_next_alert = true
    @driver.manage.timeouts.implicit_wait = 30
    @verification_errors = []
  end

  after(:each) do
    @driver.quit
    @verification_errors.should == []
  end

  it "test_" do
    @driver.get(@base_url + "/")
    @driver.find_element(:id, "srchtxt").clear
    @driver.find_element(:id, "srchtxt").send_keys "ようへいの日々精進"
    @driver.find_element(:id, "srchbtn").click
    @driver.find_element(:css, "b").click
    @driver.find_element(:name, "q").click
    @driver.find_element(:name, "q").clear
    @driver.find_element(:name, "q").send_keys "sensu"
    @driver.find_element(:css, "input.search-module-button").click
    @driver.find_element(:link, "Sensu と Graphite についてあらためて調べた").click
    @driver.find_element(:link, "Sensu / Graphite 調査メモ").click
  end

  def element_present?(how, what)
    ${receiver}.find_element(how, what)
    true
  rescue Selenium::WebDriver::Error::NoSuchElementError
    false
  end

  def alert_present?()
    ${receiver}.switch_to.alert
    true
  rescue Selenium::WebDriver::Error::NoAlertPresentError
    false
  end

  def verify(&blk)
    yield
  rescue ExpectationNotMetError => ex
    @verification_errors << ex
  end

  def close_alert_and_get_its_text(how, what)
    alert = ${receiver}.switch_to().alert()
    alert_text = alert.text
    if (@accept_next_alert) then
      alert.accept()
    else
      alert.dismiss()
    end
    alert_text
  ensure
    @accept_next_alert = true
  end
end

rspec 実行!の前に…

早速、書き出した spec ファイルを実行してみましょう!

rspec test_selenium.rb

どや!

/Library/Ruby/Gems/2.0.0/gems/rspec-core-2.99.0/lib/rspec/core/configuration.rb:1065:in `load': /Users/kappa/Documents/test_selenium.rb:33: `${' is not allowed as a global variable name (SyntaxError)
/path/to/test_selenium.rb:33: syntax error, unexpected end-of-input
    ${receiver}.find_element(how, what)
     ^
        from /Library/Ruby/Gems/2.0.0/gems/rspec-core-2.99.0/lib/rspec/core/configuration.rb:1065:in `block in load_spec_files'
        from /Library/Ruby/Gems/2.0.0/gems/rspec-core-2.99.0/lib/rspec/core/configuration.rb:1065:in `each'
        from /Library/Ruby/Gems/2.0.0/gems/rspec-core-2.99.0/lib/rspec/core/configuration.rb:1065:in `load_spec_files'
        from /Library/Ruby/Gems/2.0.0/gems/rspec-core-2.99.0/lib/rspec/core/command_line.rb:18:in `run'
        from /Library/Ruby/Gems/2.0.0/gems/rspec-core-2.99.0/lib/rspec/core/runner.rb:89:in `run'
        from /Library/Ruby/Gems/2.0.0/gems/rspec-core-2.99.0/lib/rspec/core/runner.rb:17:in `block in autorun'

あら…シンタックスエラーや。${ はグローバル変数として許可されてませんと…。むむ。そういう時には Google 先生に。

有難うございます。

以下のように修正しました。

-- test_selenium.rb    2014-10-21 19:22:52.000000000 +0900
+++ test_selenium_modified.rb   2014-10-21 19:27:25.000000000 +0900
@@ -33,14 +33,14 @@
   end

   def element_present?(how, what)
-    ${receiver}.find_element(how, what)
+    @driver.find_element(how, what)
     true
   rescue Selenium::WebDriver::Error::NoSuchElementError
     false
   end

   def alert_present?()
-    ${receiver}.switch_to.alert
+    @driver.switch_to.alert
     true
   rescue Selenium::WebDriver::Error::NoAlertPresentError
     false
@@ -53,7 +53,7 @@
   end

   def close_alert_and_get_its_text(how, what)
-    alert = ${receiver}.switch_to().alert()
+    alert = @driver.switch_to().alert()
     alert_text = alert.text
     if (@accept_next_alert) then
       alert.accept()

気を取り直して

rspec test_selenium_modified.rb -fd --color

実行結果は以下の動画で…。

いやー、コマンドラインで Firefox が起動するし、検索文字列が自動で挿入されるし、検索結果のリンクを勝手にクリックしてくれるし、何度再生しても飽きないですね。


最後に

初めて Selenium IDE を使ってみましたよ。ブラウザの操作を各種テストツールで利用出来るようなスクリプトへの書き出し機能があったりするのが非常に魅力的です。これを利用すれば sensu のような監視ツールで Web サーバーだけではなく Web アプリケーションの動作も監視することが出来そうなのでちょっと試してみたいと思っています!

元記事はこちらです。
朝の 3 分ハッキング(3)Selenium IDE と Rspec で Web アプリケーションのテストをする(という程では無いけど)