angularJS权威教程自动化测试笔记（二）端到端的介绍

时间：2022-06-21 11:14:18

8. 端到端的介绍（黑盒test）

做端到端测试时，我们会使用Angular场景运行器。
测试应用时，我们会直接使用场景运行器的API来控制浏览器。利用这个API，我们能通过
不同的动作操作浏览器，包括在输入框中输入数据，选择元素，导航页面，控制浏览器的流，
等等。
我们要使用的核心基础API是browser()方法，这个方法返回一个对象，为了控制浏览器，
可以在这个对象上面串一些方法。

8.1 导航页面

要在测试浏览器frame里面加载一个URL，我们使用navigateTo函数，它带有一个参数：要
加载的URL。
browser().navigateTo(url)
调用一个方法取得一个URL:

browser().navigateTo(title, function() {
// 在这里返回动态url;
return '/';
});

8.2 刷新页面(reload())

8.3 操作window对象

browser().window().href();
browser().window().path();
browser().window().search();

8.4 位置 位置 位置

browser().location().url();
browser().location().path();
browser().location().search();
browser().location().hash();

8.5 建立预期

使用expect()，我们断言给定future对象是否与匹配器相符。场景API给出的任何返回值都是
一个场景运行器将要解析的future对象，我们会校验这个最终的值是不是我们所期望的结果。

expect(browser().location().path())
.toBe('/')
// 或者用not()来否定这个期望
expect(browser().location().path()).not().toBe('/home')

8.6 和内容交互

我们可以选择元素，在输入框中输入值，点击按钮，校验内容是否出现在该出现的地方，遍
历循环器，等等。
要选择页面上的元素，使用element()方法。这个API带两个参数：
 选择器—— jQuery HTML元素选择器[^selector]；
 标签——用于在浏览器或者终端输出的文本字符串。

匹配给定jQuery选择器的元素数目：

element(“input”, “input elements”).count()

点击一个元素（比如一个提交按钮）

element(“button”, “submit button”).click()

用query()方法在给定jQuery选择器上执行一个方法。
element("a", "all links").query(
// 所有这些链接
// 都会作为元素传给函数
function(elements, done) {
// 对每个元素做些想做的事
angular.forEach(elements, function(ele) {
expect(ele.attr('ng-click'))
.toBeDefined();
});
done(); // 告诉场景运行器我们做完了
});
还可以获取和设置元素值，文本，html,高度，innerheight，outerheight等等数据

8.7 选择页面上的元素（using()）

利用该函数，我们可以用
jQuery类型的元素选择符定位指定的元素。

it('does not test anything yet', function() {
// 定位指定元素
using('.input_email').binding('email');
});

8.8 与Angular的绑定进行交互

it('should update the name', function() {
using('.form').input('name').enter('Ari');
expect(
using('.form').binding('name')
).toBe('Ari');
});

binding()方法带有一个名称参数，该参数是字符串类型。
这个字符串是我们在查询中所关注的DOM元素上的绑定名称。

8.9 与输入元素交互

如果想要在一个文本框中输入文字，选中一个复选框，
或者选择一个option元素的值，可以使用input()方法。
input()方法自身返回一个对象，我们可以调用这个对象的方法来跟元素进行交互。它带有
一个名称参数，该参数是字符串类型。是相应的ng-model的名称。

enter()。 enter()方法向一个输入框输入值。
<input type="text" ng-model="name" />

input('name').enter('Ari');

check()
select()
val()

选项输入(select())

html:

<select ng-model="color"
ng-options="c.name for c in colors">
<option value="">Pick your favorite color"</option>
</select>

javascript:

select('color').option('red')
select('color').options('Ghostbusters','Titanic')

重复循环元素(repeater())

选择器+标签
html:

<table id="phonebook">
<tr ng-repeat="person in people">
<td>{{ person.name }}</td>
<td>{{ person.email }}</td>
</tr>
</table>

js:

repeater('#phonebook tr').count()
repeater('#phonebook tr').row(0)
repeater('#phonebook tr').column('person.name')
标签：

相关文章