2016年9月9日 星期五

[AutomationTest] selenium + cucumber + ruby (3)

請先服用第一集第二集


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


我們用中文寫了一個可以自動執行的 test case,這樣的 test case 讓不懂程式的人有一個共同的平台與溝通方式可以溝通,然後我們就寫了 ruby 的程式來執行測試。

這一篇,我們要來仔細看看那個 ruby 程式。


========= 手把手教學? =========


1. 開啟yahoo首頁


這邊就是在第 8 行加入 navigate_to 的敘述,那我是怎麼知道要加這個呢?
就是去這個連結

然後看到第一行,就覺得用用看,就中了。


2. 到 "股市" 首頁去



也是一樣,click 一個 link 以後,等待 3 秒。
其實這邊有一個 predefined step,在這個連結的第 21 ~ 23 行:

所以我就把它的 click 的部分拿出來用了。

後面那個 arg1 是一個參數,這裡是 ruby 的標準寫法,我就跳過不介紹了。


3. When 輸入 "台積電" 在輸入框裡面



這邊的寫法應該有很多種,你也可以像前面一樣,去找 predefined steps的實作方法,然後填入。我的寫法是,用 xpath 找到一個網頁上的 element,然後用 send_keys 這個 api,把字串傳過去,然後傳一個 enter 過去。

那這些資料是哪裡找到的呢?
find_element 在這裡
找到的 element 在這裡,你也會在這裡找到這個 class 的 send_keys 方法

那傳一個 enter 出去呢?在這裡你可以找到。


4. 我會看到 "2330台積電" 的股價在 "50" 到 "500" 之間

首先,這邊會有三個字串參數傳進來:"2330台積電”、”50"與"500" 。
我分別叫他是 tsmc, low, high,來看看 code:



line 23:check_element_presence 這個 method ,我也是先去找 predefined steps,然後去找他的實作,最後在這裡找到,在第 39 ~ 42 行,這些參數需要摸索一下XDDD。


line 25 ~ 最後面:幹,我摸索超久。

是這樣的,我用 firefox 的 firepath 跟 firebug 去找 xpath,原本以為 xpath 一定找得到,但沒想到 yahoo 這個網頁長得很奇怪,找不到;我就用 css 去找,於是發現,他在股價的地方,前面有一串變數,所以要取 css 後面的部分,我就用上面那一串 css 的 string ,就找到了。

說得雲淡風輕,但其實很卡... 不過,寫程式就是這樣吧。

然後我用 get_element_text 拿到字串 (get_element_text 在這裡可以找到,他的實作方法在這裡,其實看到這裡,你應該已經知道這些 selenium-cucumber 的東西的階層實作關係了),然後用 ruby 的語言,把字串轉成 float 去做比較,不對的話就呼叫 fail。

line 28: 是一個註釋,但裡面的 expect api 我覺得很好用。


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


1. feature 的 step 可以在這一層找到,而這些實作是在往下的這一層實作,所以這第二層的東西,會直接碰到 selenium-cucumber 的 API。目前覺得大概是這個關係。另外這個連結,也可以提供一些線索。

2. 這就是寫程式。

3. 先學會基礎的 ruby 吧~~~


好的,一樣,如果有任何問題或是建議,或是覺得我寫錯了,歡迎在下面留言跟我說~~~~

沒有留言:

張貼留言