Expect
NightWatch在0.7版本 新推出一種BDD-style界面 來執行斷言,叫做Expect.它以Chai Expect斷言庫為參考,比傳統的asset界面更靈活更高效.
Language Chains
以下命令僅作輔助，提高斷言可讀性。本身不具有測試能力
- to
- be
- been
- is
- that
- which
- and
- has
- have
- with
- at
- does
- of
.equal(value)/.contain(value)/.match(regex)
判斷組件是否
- 值是否與指定值相等
browser.expect.element('#main').text.to.equal('The Night Watch'); - 值是否包含指定值
browser.expect.element('#main').text.to.contain('The Night Watch'); - 是否有指定樣式
browser.expect.element('#main').to.have.css('display').which.equals('block');
.not
取反 寫在equal,contain，match前面 text.to.not.equal()
.before(ms)/.after(ms)
在指定的時間再執行一次斷言，可與任何斷言配合使用，使其可以再執行
-
browser.expect.element('#main').text.to.contain('The Night Watch').before(1000);
-
browser.expect.element('#main').text.to.not.contain('The Night Watch').after(500);
.a(type) /an
檢查指定組件的類型是否與預期相符。參數與：type,message(optional)
- browser.expect.element('#q').to.be.an('input');
- browser.expect.element('#q').to.be.an('input', 'Testing if #q is an input');
- browser.expect.element('#w').to.be.a('span');
.attribute(name)
檢查元素的某個屬性是否存在，是否有預期的值（optional）
- browser.expect.element('body').to.have.attribute('data-attr');
.css
同attribute
- browser.expect.element('#main').to.have.css('display').which.matches(/some\ value/);
.enabled
檢查元素現在是否可用
- browser.expect.element('#weblogin').to.be.enabled;
- browser.expect.element('#main').to.not.be.enabled;
.present
檢測元素是否在dom中出現
- browser.expect.element('#main').to.be.present;
.select
檢測下拉框，單選框，復選框當前是否被選中
.text
檢測組件是否有指定文本/表達式,可與contains,equals,matches配合使用
- .text.to.match(/The\ Night\ Watch/)
.value
同text
- .to.have.value.which.contains/.not.equals/.that.equals
.visible
是否可見
assert
經典的assert&verify斷言庫在NightWatch仍然可用.它們作用相同,不同之處在於當前斷言失敗后assert會跳過之后的斷言,結束測試(相當於break);verify會跳過當前斷言,輸出錯誤報告,繼續執行其他斷言(相當於continue).
.attributeContains()
檢查某元素給定的屬性是否有預期的值
參數:
- selector,用來定位元素
- attribute,屬性名
- expected,期望包含的值
- message (optional),測試結果中的信息說明
eg. browser.assert.attributeContains('#someElement', 'href', 'google.com');
.attributeEquals()
同上(attributeContains)
.containsText()
參數:
- cssSelector
- expectedText
- msg(Optional)
eg. browser.assert.containsText("#main", "The Night Watch");
.cssClassPresent()
檢查元素是否有指定的CSS類名
參數:
- cssSelector,用來定位元素
- className,期望有的類名
- message (optional),測試結果中的信息說明
eg. browser.assert.cssClassPresent("#main", "container");
.cssClassNotPresent()
樓上(.cssClassPresent)取反
.cssProperty()
檢查元素的指定屬性是否是期望的狀態
參數:
- cssSelector,用來定位元素
- cssProperty,屬性
- expected,
- message (optional),測試結果中的信息說明
eg. browser.assert.cssProperty("#main", "display", "block");
.elementPresent()
dom中是否含有指定元素
- browser.assert.elementPresent("#main");
.elementNotPresent()
樓上取反
.hidden()
檢查指定元素是否在頁面不可見
- browser.assert.hidden(".should_not_be_visible");
.title()
檢查頁面標題是否是指定標題
- browser.assert.title("Nightwatch.js");
.urlContains()
檢查當前的URL是否包含指定值
- browser.assert.urlContains('google');
.urlEquals()
- browser.assert.urlEquals('http://www.google.com');
.value()
檢查指定的表單元素的值 是否與指定值相等
- browser.assert.value("form.login input[type=text]", "username");
.valueContains()
- browser.assert.valueContains("form.login input[type=text]", "username");
.visible()
- browser.assert.visible(".should_be_visible");
Commands
Commands可在頁面上執行不同的操作,通常包含兩個及以上的頁面驅動協議行為.
回調函數
以下的方法均支持回調函數.回調函數將在command完成之后執行
.clearValue()
可清理文本域或文本輸入框里的內容
- client.clearValue('input[type=text]');
.click()
模仿點擊事件
- client.click("#main ul li a.first");
感覺更適合與回調函數配合使用
browser.click("#main ul li a.first", function(response) {
this.assert.ok(browser === this, "Check if the context is right.");
this.assert.ok(typeof response == "object", "We got a response object.");
});
.closeWindow()
關閉當前窗口,當你使用多個窗口時適用
.deleteCookie()
刪除cookie