selenium-pageobject v1.2.0-beta
selenium-pageobject
A lightweight pageobject library for use with webdriverjs.
Read about pageobjects at Martin Fowler's bliki and Selenium's wiki.
Installation
npm install selenium-pageobject
Getting started
The primary classes are:
PageNavigator
- everything in the elements directory
The PageNavigator
provides methods to visit pages etc. The Element
and its derived classes are wrappers to elements on the web page.
You can directly use the elements to access things on the page like this:
var wd = require('selenium-webdriver'),
elements = require('selenium-pageobject').elements;
var driver = new wd.Builder().withCapabilities(wd.Capabilities.chrome()).build(),
pageNavigator = new PageNavigator({ driver: driver });
pageNavigator.visit('http://www.example.com');
var cb = new elements.CheckBox(driver, By.id('checkboxId'));
cb.getChecked().then(function (isChecked) {
/* do something with isChecked */
});
PageObjects (WIP)
There's no actual class that represents a PageObject, since these are the things you write to drive your site. So let's run through a quick example of what one might look like.
Start with modelling your UI, so mypagemodel.js
:
var By = require('selenium-webdriver').By,
po = require('selenium-pageobject'), extend = po.extend, Element = po.elements.Element;
module.exports = (function (_super) {
extend(MyPageModel, _super);
function MyPageModel() {
_super.apply(this, arguments);
this.username = this.ef.textbox(By.id('username'));
this.password = this.ef.textbox(By.id('password'));
this.loginButton = this.ef.element(By.id('login'));
}
return MyPageModel;
})(Element);
Now create your PageObject in mypage.js
:
var By = require('selenium-webdriver').By,
MyPageModel = require('./mypagemodel.js');
function MyPage(driver) {
this._ui = new MyPageModel(driver, By.tagName('html'));
}
MyPage.prototype.login = function (username, password) {
this._ui.username.setValue(username);
this._ui.password.setValue(password);
return this._ui.loginButton.click();
};
module.exports = MyPage;
Now write your test in mypageTests.js
:
var chai = require('chai'), expect = chai.expect,
wd = require('selenium-webdriver'), By = wd.By,
PageNavigator = require('selenium-pageobject').PageNavigator,
MyPage = require('./mypage.js');
describe("MyPage", function() {
var driver;
var url = 'file://' + __dirname + '\\mypage.html';
before(function() {
driver = new wd.Builder().withCapabilities(wd.Capabilities.chrome()).build();
});
beforeEach(function() {
driver.get(url);
});
it("can login", function(done) {
var pageNavigator = new PageNavigator({ driver: driver });
var myPage = new MyPage(driver);
pageNavigator.visit(url).then(function () {
myPage.login('JohnSmith', 'password').then(function () {
// expect something
});
}).then(function () {
done();
}).then(null, function (err) {
done(err);
});
});
after(function(done) {
driver.quit().then(done);
});
});
Workflows
This is an experimental feature at the moment and may not make it into the final version
A Workflow
allows you to define a set of steps which it will then run through, you can define callbacks that occur on specific steps of the workflow.