angularJS权威教程自动化测试笔记(二)端到端的介绍
2015-12-17 09:29
615 查看
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];
标签——用于在浏览器或者终端输出的文本字符串。
[b]匹配给定jQuery选择器的元素数目:[/b]
element(“input”, “input elements”).count()
[b]点击一个元素(比如一个提交按钮)[/b]
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')
相关文章推荐
- AngularJS Best Practices: resource
- AngularJs ui-router 路由的简单介绍
- Angular2组件开发—调用服务(二)
- (笔记)angular 的根据后台StateCode本地显示指定文案
- Angular2组件开发—调用服务(一)
- Angular2组件开发—表单输入(五)
- AngularJS学习笔记
- 关于angularjs中,数据模型被改变,页面不刷新的解决办法
- Angular2组件开发—表单输入(四)
- Angular2组件开发—表单输入(三)
- angularjs
- Angular2组件开发—表单输入(二)
- 日常总结之angularjs的双向绑定全透析
- angularJS权威教程自动化测试笔记(一)
- Angular2组件开发—表单输入(一)
- Angular2组件开发—属性与事件(二)
- Angular2组件开发—属性与事件(一)
- 在 Angular 中实现搜索关键字高亮
- AngularJS进阶(二十一)Angularjs中scope与rootscope区别及联系
- AngularJS进阶(二十一)Angularjs中scope与rootscope区别及联系