使用CasperJS实现页面对象模式

是否有人已经使用casperjs实现了着名的“页面对象模式”，对于长期的测试维护非常有用？使用CasperJS实现页面对象模式

当你必须分离机制和测试目的时，使用它非常酷。以这种方式编写测试变得更加愉快。

有红宝石和硒一些例子：
http://blog.josephwilk.net/cucumber/page-object-pattern.html
https://code.google.com/p/selenium/wiki/PageObjects

来源

2014-02-18 Brice LALU

使用在你的第二个链接的例子，你可以将此转换为Javascript类类对象和自身的模块中封装：

var LoginPage = function(casper) { 
    this.casper = casper; 
}; 

LoginPage.prototype.typeUsername = function(username) { 

    this.evaluate(function() { 
     __utils__.findOne('input.username').value = username; 
    }); 
}; 

exports = LoginPage;

，然后用它在你的测试：

var LoginPage = require("./LoginPage.js"); 
var login = new LoginPage(this); 
login.typeUsername("geoff");

来源

2014-02-20 23:33:58

当我试图实现上述解决方案，我得到的错误：“错误：类型错误：对象不是构造函数（评估“新LoginPage （这个）'）”。任何想法为什么？我完全按照它。 – user1523236

首先确保'LoginPage.js'位于正确的位置（在我的示例中与需要它的脚本位于相同的目录中）。但我认为你的问题可能与CasperJS中的“补丁需求”有关。看到这个链接http://docs.casperjs.org/en/latest/upgrading/1.1.html#require-in-custom-modules。让我知道它是否有效，我会更新答案。 –

嘿菲尔，不幸的是没有工作。我会玩弄它，看看我能否得到它的工作，如果没有，我会打开一个堆栈溢出的新问题，我可以发布我的测试和页面代码。 – user1523236

这里是页对象模式与CasperJS来测试登录功能的为例。页面对象是一个名为LoginPage.js：

function LoginPage() { 

    this.startOnLoginPage = function() { 
    casper.echo("base url is : " + casper.cli.options.baseUrl); 
    casper.start(casper.cli.options.baseUrl + '/login'); 
    }; 

    this.checkPage = function() { 
    casper.then(function() { 
     casper.test.assertUrlMatch('login', 'Is on login page'); 
     casper.test.assertExists('form[name="f"]', 'Login page form has been found'); 
    }); 
    }; 

    this.fillForm = function (username, password) { 
    casper.then(function() { 
     this.fill('form[name="f"]', { 
     'j_username': username, 
     'j_password': password 
     }, false); 
    }); 
    }; 

    this.submitForm = function() { 
    casper.then(function() { 
     this.click('form[name="f"] button[type="submit"]', 'Login submit button clicked'); 
    }); 
    }; 
}

然后你就可以进行各种测试使用此页面对象。例如：

phantom.page.injectJs('LoginPage.js'); 
var loginPage = new LoginPage(); 

casper.test.begin('Should login', function (test) { 
    loginPage.startOnLoginPage(); 
    loginPage.checkPage(); 
    loginPage.fillForm('scott', 'rochester'); 
    loginPage.submitForm(); 
});

有关详细信息和完整的例子：http://jsebfranck.blogspot.fr/2014/03/page-object-pattern-with-casperjs.html

来源

2015-01-24 18:59:06 jsebfranck

使用CasperJS实现页面对象模式

回答

相关问题