
- Watir 教程
- Watir - 主頁
- Watir - 概覽
- Watir - 簡介
- Watir - 環境設定
- Watir - 安裝瀏覽器驅動程式
- Watir - 使用瀏覽器
- Watir - 網頁元素
- Watir - 定位網頁元素
- Watir - 使用 Iframe
- Watir - 自動等待
- Watir - 無介面測試
- Watir - 移動測試
- Watir - 捕獲螢幕截圖
- Watir - 網頁物件
- Watir - 網頁效能
- Watir - Cookie
- Watir - 代理
- Watir - 警告
- Watir - 下載
- Watir - 瀏覽器視窗
- Watir 有用資源
- Watir - 快速指南
- Watir - 有用資源
- Watir - 討論
Watir - 無介面測試
在本章中,我們將學習如何使用 Watir webdriver 的無介面選項來測試網頁 URL。
語法
Browser = Watir::Browser.new :chrome, headless: true
我們即將測試的測試網頁如下所示 -
<html> <head> <title>Testing UI using Watir</title> </head> <body> <script type = "text/javascript"> function wsentered() { console.log("inside wsentered"); var firstname = document.getElementById("firstname"); if (firstname.value != "") { document.getElementById("displayfirstname").innerHTML = "The name entered is : " + firstname.value; document.getElementById("displayfirstname").style.display = ""; } } </script> <div id = "divfirstname"> Enter First Name : <input type = "text" id = "firstname" name = "firstname" onchange = "wsentered()" /> </div> <br/> <br/> <div style = "display:none;" id = "displayfirstname"></div> </body> </html>
輸出

Watir 程式碼
require 'watir' b = Watir::Browser.new :chrome, headless: true b.goto('https:///uitesting/textbox.html') t = b.text_field(name: 'firstname') t.exists? t.set 'Riya Kapoor' t.value t.fire_event('onchange') b.screenshot.save 'headless.png'
我們已將選項 headless : true 新增到 Watir Chrome 瀏覽器中。執行 Ruby 程式時,它不會開啟瀏覽器,所有內容都會在命令列中執行 -
DevTools listening on ws://127.0.0.1:53973/devtools/browser/b4127866-afb8-4c74-b967-5bacb3354b19 [0505/144843.905:INFO:CONSOLE(8)] "inside wsentered", source: https:///uitesting/textbox.html (8)
我們已新增 console.log 訊息,並在命令列中打印出相同的訊息。
headless.png 的螢幕截圖如下所示 -

在 Firefox 中
適用於 Firefox 的 Watir 程式碼如下所示 -
require 'watir' b = Watir::Browser.new :firefox, headless: true b.goto('https:///uitesting/textbox.html') t = b.text_field(name: 'firstname') t.exists? t.set 'Riya Kapoor' t.value t.fire_event('onchange') b.screenshot.save 'headlessfirefox.png'
headlessfirefox.png 的螢幕截圖如下所示 -

廣告