自动化测试一个非常重要的特性就是校验,nightwatch提供Expect库和Assert库,接下来我们分别就这两个库进行介绍。
本文翻译自http://nightwatchjs.org/api/#expect-api 上一篇 nightwatch + selenium 基于浏览器的web自动化测试 教程(二)
目录
.equal(value)/.contain(value)/.match(regex)
Expect
expect库是基于Chai Expect 校验库进行扩展开发的,提供了链式语法( chainable language ),看下面的案例
this.demoTest = function (browser) {
// start with identifying the element
// and then assert the element is present
browser.expect.element('#main').to.be.present;
// or assert the element is visible
browser.expect.element('#main').to.be.visible;
};
语法链
下面的关键字是用来提取元素进行校验的提取器,本身不具备测试校验的能力。
- to
- be
- been
- is
- that
- which
- and
- has
- have
- with
- at
- does
- of
.equal(value)/.contain(value)/.match(regex)
以上三个方法是对当前元素的熟悉、value、css元素等进行校验,如下案例:
this.demoTest = function (browser) {
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
this.demoTest = function (browser) {
browser.expect.element('#main').text.to.not.equal('The Night Watch');
browser.expect.element('#main').text.to.not.contain('The Night Watch');
browser.expect.element('#main').to.have.css('display').which.does.not.equal('block');
};
.before(ms)/.after(ms)
before表示在指定的时间之前重新校验,after表示在指定的时间之后重新校验。
this.demoTest = function (browser) {
//1000ms以内,main元素会展示'The Night Watch'字符串
browser.expect.element('#main').text.to.contain('The Night Watch').before(1000);
//500ms之后,main元素会不会包含'The Night Watch'字符串
browser.expect.element('#main').text.to.not.contain('The Night Watch').after(500);
};
.a(type)
判断元素的类型
参数:
名称 | 类型 | 描述 |
---|---|---|
type | string | 期望的类型 |
| string | 可选参数,当校验失败时,这个消息将会在控制台或者日志里面打印 |
this.demoTest = function (browser) {
browser.expect.element('#q').to.be.an('input'); //判断目标元素为input类型
browser.expect.element('#q').to.be.an('input', 'Testing if #q is an input');
browser.expect.element('#w').to.be.a('span'); //判断目标元素为span类型
};
.attribute(name)
判断给定元素的指定属性是否存在,且与预期的值相等
参数:
名称 | 类型 | 描述 |
---|---|---|
attribute | string | 属性名称 |
| string | 可选参数,当校验失败时,这个消息将会在控制台或者日志里面打印 |
this.demoTest = function (browser) {
browser.expect.element('body').to.have.attribute('data-attr');
browser.expect.element('body').to.not.have.attribute('data-attr');
browser.expect.element('body').to.not.have.attribute('data-attr', 'Testing if body does not have data-attr');
browser.expect.element('body').to.have.attribute('data-attr').before(100);
browser.expect.element('body').to.have.attribute('data-attr')
.equals('some attribute');
browser.expect.element('body').to.have.attribute('data-attr')
.not.equals('other attribute');
browser.expect.element('body').to.have.attribute('data-attr')
.which.contains('something');
browser.expect.element('body').to.have.attribute('data-attr')
.which.matches(/^something\ else/);
};
.css(property)
判断给定元素的指定css样式是否存在,且与预期的值相等
参数:
名称 | 类型 | 描述 |
---|---|---|
property | string | css属性名称 |
| string | 可选参数,当校验失败时,这个消息将会在控制台或者日志里面打印 |
this.demoTest = function (browser) {
browser.expect.element('#main').to.have.css('display');
browser.expect.element('#main').to.have.css('display', 'Testing for display');
browser.expect.element('#main').to.not.have.css('display');
browser.expect.element('#main').to.have.css('display').before(100);
browser.expect.element('#main').to.have.css('display').which.equals('block');
browser.expect.element('#main').to.have.css('display').which.contains('some value');
browser.expect.element('#main').to.have.css('display').which.matches(/some\ value/);
};
.enabled
判断一个元素是否enable 可用
this.demoTest = function (browser) {
browser.expect.element('#weblogin').to.be.enabled;
browser.expect.element('#main').to.not.be.enabled;
browser.expect.element('#main').to.be.enabled.before(100);
};
.present
判断元素是否呈现在dom上
this.demoTest = function (browser) {
browser.expect.element('#main').to.be.present;
browser.expect.element('#main').to.not.be.present;
browser.expect.element('#main').to.be.present.before(100);
};
.selected
判断一个option元素是否被选中,或者checkbox、radio 是否被选中
this.demoTest = function (browser) {
browser.expect.element('#main').to.be.selected;
browser.expect.element('#main').to.not.be.selected;
browser.expect.element('#main').to.be.selected.before(100);
};
.text
获取一个元素的Text值,配合 contains/equals/matches 进行校验
this.demoTest = function (browser) {
browser.expect.element('#main').text.to.equal('The Night Watch');
browser.expect.element('#main').text.to.not.equal('The Night Watch');
browser.expect.element('#main').text.to.equal('The Night Watch').before(100);
browser.expect.element('#main').text.to.contain('The Night Watch');
browser.expect.element('#main').text.to.match(/The\ Night\ Watch/);
};
.value
获取元素的value属性, 配合 contains/equals/matches 进行校验
this.demoTest = function (browser) {
browser.expect.element('#q').to.have.value.that.equals('search');
browser.expect.element('#q').to.have.value.not.equals('search');
browser.expect.element('#q').to.have.value.which.contains('search');
browser.expect.element('#q').to.have.value.which.matches(/search/);
};
.visible
判断元素是否可见
this.demoTest = function (browser) {
browser.expect.element('#main').to.be.visible;
browser.expect.element('#main').to.not.be.visible;
browser.expect.element('#main').to.be.visible.before(100);
};