在Protractor中定义页面对象的规范方法

时间:2015-07-17 00:02:16

标签: javascript angularjs testing protractor pageobjects

我们已经使用Page Object pattern了很长一段时间。它绝对有助于组织端到端测试并使测试更具可读性和清洁性。

正如Using Page Objects to Organize Tests量角器文档页面向我们展示的那样,我们将每个页面对象定义为一个函数,并使用new来实现"实例化"它:

"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测试博客帖子中,我注意到页面对象被定义为对象:

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);
    }
};

这两种引入页面对象的方法有什么区别?我应该更喜欢另一个吗?

2 个答案:

答案 0 :(得分:3)

最终,我认为这是个人偏好的问题。

是的,您可以使用构造函数模式并在每个测试套件中实例化一个单例...是的,您可以使用上面的简单对象文字...是的,您可以使用工厂函数...

通过“类”(无论是伪语法还是ES2015语法)使用继承来构建代码与通过mixin扩展的对象相比,在应用程序开发中更广泛的争论,更不用说e2e测试了!

主要的是在整个测试套件中进行清晰,一致的练习,并尽可能提高代码的可重用性。

答案 1 :(得分:2)

Alecxe,我有同样的问题。对我来说,答案归结为扩展基于构造函数的页面对象的能力。对于我不需要扩展的东西(例如,使用basePage),我使用了一个对象文字。

这只是基于我所阅读和尝试过的事情......我很乐意了解更好/不同的模式。

我期待着阅读风格指南,Andres。