Page 305 - AngularJS权威教程

19.24 页面对象 285

好。让我们继续吧，把测试移动到describe块： 19

describe('page navigation', function() {
var link;
beforeEach(function() { 20
link = element(by.css('.header ul li:nth-child(2)'));
link.click();
}); 21

it('should navigate to the /about page when clicking', function() {
expect(ptor.getCurrentUrl()).toMatch(/\/about/);
}); 22

it('should add the active class when at /about', function() {
// 应当有active样式类 23
});
});
最后一个测试验证了class列表中是否包含字符串active： 24

expect(link.getAttribute('class')).toMatch(/active/);
25

19.24 页面对象
26
为了让我们的测试更加可读，可以使用webdriver的页面对象概念。页面对象基本上就是类，
能让我们把特定的页面功能包装成一个干净的交互。
27
例如，可以把一个页面包装成这样：
var AngularHomepage = function() { 28
this.nameInput = element(by.model('yourName'));
this.greeting = element(by.binding('yourName'));
29
this.get = function() {
browser.get('http://www.angularjs.org');
};
30
this.setName = function(name) {
this.nameInput.sendKeys(name);
}; 31
};
现在可以把测试整理成这样：
32
describe('angularjs homepage', function() {
it('should greet the named user', function() {
var angularHomepage = new AngularHomepage(); 33
angularHomepage.get();

angularHomepage.setName('Julie'); 34

expect(angularHomepage.greeting.getText()).toEqual('Hello Julie!');
});
}); 35

页面对象允许我们创建对象，可以用在编写了很多测试的页面上。例如，可以创建一个
LoginPage页面对象，把username和password字段包装成一个方法。我们可以简单地使用这个页 36