I have a test broken into 3 components. The main page object Page, the page in question HomePage and the test itself.
I want HomePage to extend the Page object. However what I found is - if in the Page class I use:
module.exports = new Page()
I get the error ERROR: Class extends value #<Page> is not a function or null
however if i use
module.exports = Page
it works perfectly.
Could someone please explain why this is so? Is it because the Page object itself is only constructed with each of the pages its the parent of, e.g. HomePage or LoginPage or whatever other page?
class Page {
constructor() {
this.title = 'My Page';
}
open(path) {
browser.url('/' + path);
}
}
module.exports = Page;
==
var Page = require('../page-models/Page');
class HomePage extends Page {
get username() { return browser.element('#username'); }
open() {
super.open('');
}
}
module.exports = new HomePage();
== The test itself
var HomePage = require('../page-models/home.page');
describe('Something great', function(){
it('tests this', function(){
HomePage.open();
...
Any help appreciated. p.s. using nodejs, webdriverio, mocha and chai.