[Web Testing]驗證 table 內的多筆資料

當碰到查詢的功能,需要驗證查出的多筆結果是否符合預期時,在撰寫 web testing 時,往往很麻煩。本文針對確定查詢結果順序的情況,寫一段 sample code 給各位參考。

這篇 sample code 使用了 specflow, page object 與 FluentAutomation,不清楚這些東西的朋友,可以自行搜尋本 blog 的文章。

功能與頁面描述

有一個查詢頁面,可以查出符合條件的 ISBN 與書名的資訊。而自動測試,需要驗證如下圖所示:

[Web Testing]驗證 table 內的多筆資料_第1张图片
查詢頁面與查詢結果

查詢結果的 HTML 如下所示:

ISBN Name
9789869094481 玩出好創意

ASP.NET View 的部分,如下所示:

    if (Model != null && Model.Books.Any())
    {
        
@foreach (var item in Model.Books) { }
@Html.DisplayNameFor(model => model.ISBN) @Html.DisplayNameFor(model => model.Name)
@Html.DisplayFor(modelItem => item.ISBN) @Html.DisplayFor(modelItem => item.Name)
}

查詢的 Scenario

[Web Testing]驗證 table 內的多筆資料_第2张图片
查詢書籍的 scenario

Step Definitions 如何使用 Page Object

[Web Testing]驗證 table 內的多筆資料_第3张图片
step definitions使用page object

Page object 美妙之處就在於,叫它做事就好,而不用管它是怎麼做的。(某種程度跟使用 interface 類似)

Page Object 的內容

[Web Testing]驗證 table 內的多筆資料_第4张图片
page object assertion 實作

CSS selector 使用 nth-child() 是重點

結論

在 web testing 做驗證時,其實是需要做些取捨的,因為驗證地越細,測試程式就越不穩定。只要達到驗證的目的,越輕量越好。例如幾種驗證方式:

  1. 從 UI 上取值,轉成物件跟 specflow 的 table 做 compare。
  2. 從 specflow 的 table 上取得資訊,做 UI 完整的驗證。
  3. 從 specflow 的 table 上取得資訊,做剛好的驗證。例如驗證筆數、驗證畫面上有出現關鍵字即可。類似 mock 的驗證,驗得越死越細,需求異動時壞掉的機率就越高。

你可能感兴趣的:([Web Testing]驗證 table 內的多筆資料)