在 Protractor 中定义页面对象的规范方法
Canonical way to define page objects in Protractor
我们使用 Page Object pattern 已经有一段时间了。它绝对有助于组织端到端测试并使测试更具可读性和清洁性。
正如 Using Page Objects to Organize Tests Protractor 文档页面向我们展示的那样,我们将每个页面对象定义为一个函数并使用 new
到 "instantiate" 它:
"use strict";
var HeaderPage = function () {
this.logo = element(by.css("div.navbar-header img"));
}
module.exports = HeaderPage;
用法:
"use strict";
var HeaderPage = require("./../po/header.po.js");
describe("Header Look and Feel", function () {
var header;
beforeEach(function () {
browser.get("/#login");
header = new HeaderPage();
});
it("should show logo", function () {
expect(header.logo.isDisplayed()).toBe(true);
});
});
但是,最近在 Protractor: Angular testing made easy Google 测试博客 post 中,我注意到页面对象被定义为一个对象:
var angularHomepage = {
nameInput : element(by.model('yourName')),
greeting : element(by.binding('yourName')),
get : function() {
browser.get('index.html');
},
setName : function(name) {
this.nameInput.sendKeys(name);
}
};
这两种引入页面对象的方式有什么区别?我应该更喜欢一个吗?
Alexe,我也有同样的问题。我的答案归结为扩展基于构造函数的页面对象的能力。对于不需要扩展的内容(例如,使用 basePage),我使用对象文字。
这只是基于我阅读和尝试过的内容...我很乐意了解 better/different 模式。
我期待着阅读风格指南,Andres。
归根结底,我觉得还是个人喜好问题。
是的,您可以使用构造函数模式并在每个测试套件中实例化一个单例...是的,您可以使用上面的简单对象文字...是的,您可以使用工厂函数...
通过 "classes"(无论是伪语法还是 ES2015 语法)使用继承来构建代码与通过 mixins 扩展的对象相比,在应用程序开发中通常存在更广泛的争论,更不用说 e2e 测试了!
主要是在测试套件中采用清晰、一致的做法,并尽可能提高代码的可重用性。
我们使用 Page Object pattern 已经有一段时间了。它绝对有助于组织端到端测试并使测试更具可读性和清洁性。
正如 Using Page Objects to Organize Tests Protractor 文档页面向我们展示的那样,我们将每个页面对象定义为一个函数并使用 new
到 "instantiate" 它:
"use strict";
var HeaderPage = function () {
this.logo = element(by.css("div.navbar-header img"));
}
module.exports = HeaderPage;
用法:
"use strict";
var HeaderPage = require("./../po/header.po.js");
describe("Header Look and Feel", function () {
var header;
beforeEach(function () {
browser.get("/#login");
header = new HeaderPage();
});
it("should show logo", function () {
expect(header.logo.isDisplayed()).toBe(true);
});
});
但是,最近在 Protractor: Angular testing made easy Google 测试博客 post 中,我注意到页面对象被定义为一个对象:
var angularHomepage = {
nameInput : element(by.model('yourName')),
greeting : element(by.binding('yourName')),
get : function() {
browser.get('index.html');
},
setName : function(name) {
this.nameInput.sendKeys(name);
}
};
这两种引入页面对象的方式有什么区别?我应该更喜欢一个吗?
Alexe,我也有同样的问题。我的答案归结为扩展基于构造函数的页面对象的能力。对于不需要扩展的内容(例如,使用 basePage),我使用对象文字。
这只是基于我阅读和尝试过的内容...我很乐意了解 better/different 模式。
我期待着阅读风格指南,Andres。
归根结底,我觉得还是个人喜好问题。
是的,您可以使用构造函数模式并在每个测试套件中实例化一个单例...是的,您可以使用上面的简单对象文字...是的,您可以使用工厂函数...
通过 "classes"(无论是伪语法还是 ES2015 语法)使用继承来构建代码与通过 mixins 扩展的对象相比,在应用程序开发中通常存在更广泛的争论,更不用说 e2e 测试了!
主要是在测试套件中采用清晰、一致的做法,并尽可能提高代码的可重用性。