Protractor小结

一、简介

         Protractor是一个Node.js程序,需要安装Node.js才可运行。Protractor默认使用Jasmine测试框架。Protractor是基于WebDriverJS作了封装。

·Selenium Server

         SeleniumServer介于测试脚本(用WebDriver API所写)和浏览器Driver(由WebDriver协议控制)之间,充当代理角色。

         Server端转发来自测试脚本的命令给driver,并返回来自driver端的应答给测试脚本。Server端可处理不同语言的测试脚本,也可启动并管理不同版本的多个浏览器。

         示意图如下:

         [Test Scripts] < ------------> [Selenium Server] < ------------ > [Browser Drivers]

         注:当测试Chrome浏览器时,SeleniumServer是可选的,通过配置chromeOnly:true or false来实现。

·浏览器支持

Protractor支持Chrome、FireFox、Safari和IE的最近两个版本,下表是其浏览器支持情况和已知BUG。

Driver

Support

Known Issues

ChromeDriver

Yes

FirefoxDriver

Yes

#480 clicking options doesn't update the model

SafariDriver

Yes

#481 minus key doesn't work, SafariDriver does not support modals, #1051 We see occasional page loading timeouts

IEDriver

Yes

#778, can be slow, #1052 often times out waiting for page load

OperaDriver

No

ios-Driver

No

Appium- iOS/Safari

Yes*

drag and drop not supported (session/:sessionid/buttondown unimplemented)

Appium- Android/Chrome

Yes*

Selendroid

Yes*

*These driversare not yet in the Protractor smoke tests.

·测试框架支持

         Protractor支持三种行为驱动开发(BDD)测试框架:Jasmine、Mocha和Cucumber。这些框架基于JavaScript和Node.js,提供语法、脚手架和报告工具便于你编写和管理你的测试脚本。Protractor默认使用Jasmine框架。

二、工作原理

         Protractor结合Selenium提供了一个自动化测试基础设施,用以模拟在浏览器或移动设备上运行的Angular应用中的用户交互。

         当使用Protractor时,注意这几点:

l  Protractor基于WebDriverJS作了封装,其中WebDriverJS是Selenium WebDriver API的JavaScript语言实现;

l  WebDriver命令是异步的。他们被安排在一个控制流中,返回promises,而非原始值;

l  测试脚本发送命令给SeleniumServer,按次序跟浏览器Driver通信。

         一个使用SeleniumWebDriver的测试涉及三块:测试脚本、Server端和浏览器,三者之间的通信过程如下图:

        

         SeleniumServer关注来自测试脚本的解释命令,将其转发给一个或多个浏览器。Server端和浏览器之间使用WebDriver Wire Protocol,一种JSON协议。转发命令再被浏览器Driver解释。

         对于Protractor,测试脚本使用Node.js运行。为确保被测的应用已经稳定,Protractor在浏览器响应操作之前会执行一个额外的命令。举例如下:

         element(by.css('button.myclass')).click();

         这句测试脚本将会产生三个命令,发送给浏览器Driver:

l  /session/:sessionId/execute_async:首先,Protractor告诉浏览器将执行一段JavaScript代码。这是个定制的命令,当应用处理完延时和异步请求,可继续执行测试时,该命令用于要求Angular对此作出应答。

l  /session/:sessionId/element:然后,发送定位元素的命令

l  /session/:sessionId/element/:id/click:最后发送执行点击操作的命令

 

三、特性简介

       ·测试脚本

         Protractor运行需要两个文件,测试脚本文件 (spec file)和配置文件

         简单的测试文件如下,其中describe函数和it函数是Jasmine框架中的语法,describe定义一个测试案例集,it为单个测试案例。

// spec.js
describe('angularjs homepage', function() {
  it('should add one and two', function() {
    browser.get('http://juliemr.github.io/protractor-demo/');
    element(by.model('first')).sendKeys(1);
    element(by.model('second')).sendKeys(2);
    element(by.id('gobutton')).click();
    expect(element(by.binding('latest')).getText()).
        toEqual('5');// This is wrong!
  });
});

         配置文件如下

// conf.js
exports.config = {
  seleniumAddress: 'http://localhost:4444/wd/hub',
  specs: ['spec.js'],
  multiCapabilities: [{
    browserName: 'firefox'
  }, {
    browserName: 'chrome'
  }]
}

 

       ·元素定位

         Protractor提供一个全局函数element,使用一个Locator作为参数,返回一个ElementFinder。通过element.all函数可以操作多个元素。其中,ElementFinder有一组action方法,例如click(),getText()和sendKeys()。在Protractor中,所有的action操作都是异步的。

         ·Locators

         一个定位器(locator)告诉Protractor如何找到一个特定的DOM元素,Protractor通过全局对象by来定位。例子如下:

// find an element using a css selector

by.css('.myclass')

 

// find an element with the given id

by.id('myid')

 

// find an element with a certain ng-model

by.model('name')

 

// find an element bound to the given variable

by.binding('bindingname')

locator再作为参数传给element函数,如下:

element(by.css('some-css'));

element(by.model('item.name'));

element(by.binding('item.name'));

·actions

         element()函数返回一个ElementFinder对象。ElementFinder对象知道如何使用locator定位DOM元素,但实际还未执行定位。只有等定位元素涉及action方法调用时才会执行。

注:WebElement上任何在WebDriverJS中可执行的action方法在ElementFinder上也可执行。

常用的action方法如下:

var el = element(locator);
// Click on the element
el.click();
// Send keys to the element (usually an input)
el.sendKeys('my text');
// Clear the text in an element (usually an input)
el.clear();
// Get the value of an attribute, for example, get the value of an input
el.getAttribute('value');

         既然所有的actions是异步的,所有action方法会返回一个promise。所以,如果要获取一个元素的文本并记录,可以这样实现:

var el = element(locator);
el.getText().then(function(text) {
  console.log(text);
});

·定位多个元素

处理多个DOM元素时,使用element.all函数。示例如下:

// Number of elements.
element.all(locator).count();
// Get my index (starting at 0).
element.all(locator).get(index);
// First and last.
element.all(locator).first();
element.all(locator).last();

 

 

 

 

 

reference:

https://github.com/angular/protractor/blob/master/docs/toc.md

http://ramonvictor.github.io/protractor/slides/#/

l  Protractor API:https://github.com/angular/protractor/blob/master/docs/api.md

 

 

 

没有更多推荐了,返回首页