Selenium (2) —— Selenium WebDriver + Grid2（101 Tutorial）

#encoding:utf-8
  require 'selenium-webdriver'
  # 向hub請求一個firefox的webdriver
  dr = Selenium::WebDriver.for(:remote,:url => 'http://localhost:4444/wd/hub', :desired_capabilities => :firefox)
  #將瀏覽器導航至cnblogs網站的登錄頁
  dr.navigate.to 'http://passport.cnblogs.com/user/signin'
  #輸入用戶名
  dr.find_element(:id,'input1').send_keys('weizhe_2008')        
  #輸入密碼
  dr.find_element(:id,'input2').send_keys(‘********’)        
  #點擊登陸
  dr.find_element(:id,'signin').click      
  sleep 10
  #關閉瀏覽器
  dr.close

保存後在當前目錄下，運行

$ ruby login_cnblogs.rb

查看firefox webdriver輸出

查看selenium hub輸出

若是一切正常，hub會自動運行一個firefox代理，而後執行咱們以上的腳本並自動登錄cnblogs

以上咱們只是完成了一個簡單的自動化登錄的腳本，還不是一個完整的測試，下面咱們引入rspec來將這個測試補充完整。

一個rspec測試腳本（示例二）

首先gem安裝rspec

$ sudo gem install rspec

執行結果：

Successfully installed rspec-3.4.0
  Parsing documentation for rspec-3.4.0
  1 gem installed

新建文件login_cnblogs_spec.rb

#encoding:utf-8
  # $ sudo gem install rspec
  require 'selenium-webdriver'
  require 'logger'

  RSpec.describe 'cnblogs main login page' do
      context 'input the wrong passwd' do
          it 'login failed,and return "用戶名或密碼錯誤"' do
              dr = Selenium::WebDriver.for(:remote,:url => 'http://localhost:4444/wd/hub',:desired_capabilities => :firefox)

              dr.navigate.to 'http://passport.cnblogs.com/user/signin'
              #輸入用戶名
              dr.find_element(:id,'input1').send_keys('weizhe_2008')        
              #輸入密碼
              dr.find_element(:id,'input2').send_keys('********')        
              #點擊登陸
              dr.find_element(:id,'signin').click  

              sleep 10

              #result = dr.find_element(:id,'tip_btn').text
              result = dr.find_element(:id,'tip_btn').attribute("innerHTML")
              logger = Logger.new(STDOUT) 
              logger.info(result)
              #rspec eq會自動爲換行符加上\
              expect = '用戶名或密碼錯誤<br><br>聯繫 contact@cnblogs.com'
              expect(result).to eq(expect)
              #關閉瀏覽器
              dr.close 
          end
      end
  end

以上測試爲一個登錄錯誤行爲提供驗證，若是登錄錯誤，頁面上會提示「用戶名或密碼錯誤

聯繫 contact@cnblogs.com」字樣，咱們須要作的就是獲取這段提示信息元素的內容，並查看指望的信息是否與之相同

命令行運行

$ rspec login_cnblogs_spec.rb --format doc

返回信息

cnblogs main login page
    input the wrong passwd
  I, [2016-01-04T10:00:07.578980 #12150]  INFO -- : 用戶名或密碼錯誤<br><br>聯繫 contact@cnblogs.com
      login failed,and return "用戶名或密碼錯誤"

  Finished in 12.21 seconds (files took 0.1758 seconds to load)
  1 example, 0 failures

查看firefox代理下的輸出

重構（示例三）

以上只是一個簡單的測試，全部的信息都雜糅在一個文件中，要讓測試用例變得健壯，易閱讀，易維護。那就是經過面向對象的方式，再加上邏輯和數據分離的方式來處理，這個纔是自動化測試的核心思想。
- 設計思路
  
  設想對登陸進行手工測試，會想到一些測試用例（驗證錯誤的用戶名正確的密碼；用戶名和密碼爲空直接點擊登錄按鈕。等等），若是每一個用例都要寫一套代碼的話，會發現有些地方出現代碼重複，不利於測試代碼的維護。進一步研究發現，有些測試對象也是能夠複用的，好比在登錄的時候咱們會用到密碼輸入框、點擊登陸按鈕等，能夠把這些「基本動做」封裝到一個類中，這樣代碼的靈活性和適用性將會更強。即，面向對象編程。
- 所以對測試目錄結構作了一些調整：
  
  新建一個文件夾tool，用來定義一些獲取控件的方法
  
  新建一個文件夾action，用來定義一下頁面操做的方法
  
  新建一個文件夾spec，用來存放測試用例
  
  新建一個文件夾config，用來存放測試用例所涉及到的測試數據
- 對於測試數據的管理，採用yaml來管理
  1. 在咱們的工做目錄下建立文件夾Login_Page (表示這個是一個登陸頁面的測試)
  2. 在Login_Page下分別建立文件夾tool，action，spec，config
  3. action文件夾中新建文件login_page.rb
  4. config文件夾中新建文件login_data.yml
  5. spec文件夾中新建文件login_cnblogs_spec.rb
  6. tool文件夾中新建文件login_dialog.rb

../login/action/login_page.rb

#encoding:utf-8
  require 'selenium-webdriver'
  require File.dirname(__FILE__)+'/../tool/login_dialog'
  class Login_Page
      include Login_Dialog
      def initialize(dr)
          @dr ||= dr
      end
      def login(username,passwd)
          get_username.send_keys(username)
          get_passwd.send_keys(passwd)
          get_submit.click
      end
      def message
          get_message.attribute("innerHTML")
      end
  end

../login/config/login_data.yml

data:
  mainpage:
  huburl: http://localhost:4444/wd/hub
  url: http://passport.cnblogs.com/login.aspx
  title: 用戶登陸 - 博客園用戶中心
  logindata:
  wrong:
  username: weizhe_2008
  password: 12345678
  message: '用戶名或密碼錯誤<br><br>聯繫 contact@cnblogs.com'

../login/spec/login_cnblogs_spec.rb

#encoding:utf-8
  require 'selenium-webdriver'
  require 'rspec'
  require 'yaml'
  require File.dirname(__FILE__)+'/../tool/login_dialog'
  require File.dirname(__FILE__)+'/../action/login_page'
  describe 'cnblogs main login page' do
      include Login_Dialog
      before (:all) do
          @data = YAML.load (File.open(File.dirname(__FILE__)+'/../config/login_data.yml'))
      end
      before (:each) do
          @dr = Selenium::WebDriver.for(:remote,:url => @data["huburl"],:desired_capabilities => :firefox)
          @dr.navigate.to @data["url"]
          @dr.manage.window.maximize()
          @driver = Login_Page.new(@dr)
      end
      after (:each) do
          @dr.quit
      end
      context 'input the wrong passwd' do
          it 'login failed,and return "用戶名或密碼錯誤"' do
              @driver.login(@data["username"], @data["password"])
              sleep 10

              expect(@driver.message).to eql (@data["message"])
          end
      end
  end

../login/tool/login_dialog.rb

#encoding:utf-8

  require 'selenium-webdriver'
  module Login_Dialog
      def get_username
          @dr.find_element(:id,'input1')
      end
      def get_passwd
          @dr.find_element(:id,'input2')
      end
      def get_submit
          @dr.find_element(:id,'signin')
      end
      def get_message
          @dr.find_element(:id,'tip_btn')
      end
  end

在../login/spec下運行

:ruby Richard$ cd login
:login Richard$ ls
action  config  spec    tool
:login Richard$ cd spec/
:spec Richard$ ls
login_cnblogs_spec.rb
:spec Richard$ rspec login_cnblogs_spec.rb --format doc

能夠獲得示例二中相同的結果