I am new to writing tests with Intern JS and have been following their documentation to use the Object interface and Page objects, particularly. According to the docs, the idea behind page objects is to encapsulate the DOM for a particular page, in case of the markup changing.
In attempting to follow the page object pattern, my goal is to have a method on myPage
which uses Promise.all()
to find several DOM elements, and then return these to an actual test function.
I'm roughly basing this on the Promise.all()
example near the top of the documentation for leadfood/Command. I'm suspecting I'm getting the chaining wrong to return what I want to go back to the test 1
function when it calls testOneStuff()
... but since I don't see a way to include the Promise.all()
in the chain, I'm finding myself at a loss.
When I try running this test, it seems to work up to starting the function (unitWrapper)
(I have a console.log in there), then after several seconds it fails with CancelError: Timeout reached...
.
Is this idea even possible? I also realize I might be approaching this in an unusual way since I am not familiarized with typical patterns in Intern JS beyond a few basic examples in their docs.
Here are the relevant parts of what I'm doing:
In file defining the tests:
define([
'intern!object',
'intern/chai!assert',
'../support/pages/MyPage'
], function (registerSuite, assert, MyPage) {
registerSuite(function () {
var myPage;
return {
name: 'my_test',
setup: function () {
myPage = new MyPage(this.remote);
},
'test 1': function () {
return myPage
.testOneStuff()
.then(function (elements) {
// here I would like 'elements' to be the object I'm
// returning in function passed into Promise.all().then().
});
}
};
});
});
In file defining MyPage:
define(function (require) {
// Constructor to exec at runtime
function MyPage(remote) {
this.remote = remote;
}
MyPage.prototype = {
constructor: MyPage,
testOneStuff: function () {
return this.remote
.findByCssSelector('.unit-question')
.then(function (unitWrapper) {
// Note that 'this' is the command object.
return Promise.all([
// Note we've left the 'find' context with .unit-question as parent
this.findByCssSelector('ul.question-numbers li.current').getVisibleText(),
this.findAllByCssSelector('ul.answers li a.answer'),
this.findByCssSelector('a.action-submit-answer'),
this.findByCssSelector('a.action-advance-assessment')
]).then(function (results) {
return {
currentQuestionNumber: results[0],
answerLinks: results[1],
btnSubmit: results[2],
btnNext: results[3]
};
});
});
}
};
return MyPage;
});