[AutomationTest] selenium + cucumber + ruby (4)

請先服用第一集第二集第三集

========= 前情提要 =========


在前三集中,我們寫了一個簡短的中文的 test case。
因為是中文的,所以方便溝通。
在實作部分,使用了 ruby 跟 selenium-cucumber 。


========= 大師提點 =========


假如有看我的臉書的,就會發現有大師來留言了:

如果是自动化测试,那么Gherkin中通常较少出现操作页面的细节,更多的是这个业务的描述。点击之类的操作通常在是step中,或者更好一点放入page object。最后,关闭浏览器用cucumber的after hook,确保每个scenario执行完后,不管结果如何都会关闭浏览器

留言的大師是Jackson Zhang,是 odd-e 上海的顧問群之一,非常厲害,是技術牛人啊!

也剛好我這篇原本想講的就是 Page 的寫法,所以就合在一起來做看看~~
1. 业务的描述
Gherkin 就是 Given-When-Then 那些,所以我們來放業務的描述,讓他更平易近人一點。
但因為這個 scenario 實在太簡單,我只好硬著頭皮寫了 ...

程式碼在這裡:
Feature: 用yahoo查到台積電的股價


Scenario: 從首頁進去 然後去查詢台積電股價
Given 從yahoo首頁進到yahoo的股市首頁
When 查詢台積電
Then 我會看到台積電的股價在 "50" 到 "500" 之間


為什麼是 50 ~ 500? 因為假設 PO 說台積電的股價超過了這個範圍就一定有問題,一定是我們系統有錯。 (假設的麻)

2. 执行完后关闭浏览器
這個很簡單,在 support/hooks.rb 裡面,加一行 $driver.quit 即可。


3. 操作通常在是step中,或者放入page object
3-1 $driver 哪來的
有這個錢字號啊,在 ruby 裡面,就是 global 變數,他是在 support/env.rb 裡面被 assign 的。
有興趣的可以去深究,這邊我就先不追了。

3-2 拉出一個 StockPage 的類別

因為這只是個很簡單的範例,所以對這個類別的操作只是去找到他頁面上的幾個元件而已,所以就使用find_element 這個方法就可以了。
程式碼如下:
require 'selenium-cucumber'

class StockPage

def query_input_box
    element = $driver.find_element(:xpath, ".//*[@id='stock_id']")
  end

def tsmc_2330_link
    element = $driver.find_element(:"link" => "2330台積電")
  end

def tsmc_stock_price
    element = $driver.find_element(:"css" => "table>tbody>tr>td>table>tbody>tr>td>b")
  end

end

3-3 修改 custom_steps.rb

就三個 method,程式碼如下:
Given(/^從yahoo首頁進到yahoo的股市首頁$/) do
navigate_to("http://tw.yahoo.com")
click('link', "股市")
end



When(/^查詢台積電$/) do
@stock_page_for_2330 = StockPage.new
@stock_page_for_2330.query_input_box.send_keys 2330
@stock_page_for_2330.query_input_box.send_keys [:control, :enter]
end



Then(/^我會看到台積電的股價在 "([^"]*)" 到 "([^"]*)" 之間$/) do |low, high|
tsmc_price = @stock_page_for_2330.tsmc_stock_price.text.to_f
fail if tsmc_price < low.to_f
fail if tsmc_price > high.to_f
end

3-4 一樣跑一下,就綠綠的了


========= Retrospective =========


1. 為什麼要寫一個 StockPage 類別?
因為如果有某些 test case 一直去看 (assert) 網頁上某個元件的狀態,寫一個類別可以避免一直寫重複的 code。
另外是,如果有一天,programmer 跟設計師聯手改了 UI,甚至只是改了 id,如果不把這個 page 拉出來成為自己的 class,那就有得改了。
把這個 class 拉出來,可以改動小一點,也就是去改那個 class 就好,不用去改整個 test case 的 steps,甚至是 scenario。
2. 下一篇再來講怎麼執行某個 feature 或是某個 scenario,以及其他小小技巧。
3. 這個 test case 太簡單,根本看不出 page object 的好處...XD 其實寫到這邊,應該大家要能寫出很多自己專案的 test case 了,把各個 page 拉出來,定義其一致的操作,就可以感受到好處了。然後,每天或是每次 Release 或是每次 programmer 的 commit,你都可以在自己的專案上做回歸測試,確定沒有改壞任何東西~更好的做法是,把這些 test code 放到 CI 上,讓 CI 來幫妳做這些事情,多好~多現代~


有問題或任何建議也可以在下面留言區提出~~~~

留言