WebdriverIO ES6 PageObject 方法不是函数错误

Question

中定义的语法定义 PageObject

父页面

//page.js

export default class Page {
  constructor() {
    this.title = 'My Page';
  }

  open(path) {
    browser.url(path);
  }
}

子页面对象

// login.page.js

import Page from './page';

class LoginPage extends Page {

  open() {
    super.open('/login');
  }
}

export default new LoginPage();

然后调用登录页面的open方法时：

const LoginPage = require('../../pages/login.page');
LoginPage.open();

我得到一个TypeError:

TypeError: LoginPage.open is not a function
  [chrome #0-0]     at World.module.exports ...
  [chrome #0-0]     at Promise (<anonymous>)
  [chrome #0-0]     at F (/.../node_modules/core-js/library/modules/_export.js:35:28)

解决方法 我可以通过使用 Object.create 而不是 class 关键字（如上述链接文档中所述）重写我的 PageObjects 来解决这个问题。

我使用 class 关键字不是必需的，但我不想不知道为什么会失败。如果很明显为什么这不起作用，请原谅我我是 JS 的新手。

Answer 1

我认为您在这里混合了 ES6 和 CommonJS 语法。将测试更改为使用 ES6 语法，它应该会按预期开始工作。

import LoginPage from '../../pages/login.page';

describe('login tests', () => {
    beforeAll(() => {        
        LoginPage.open();
    });

    it('should do something', () => {
        //do something
    });
})

Answer 2

我发现这对我有用

http://gelionprime.ml/2017/10/page-object-pattern-webdriverio/

PARENT

//page.js

class Page {
  constructor() {
    this.title = 'My Page';
  }

  open(path) {
    browser.url(path);
  }
}
module.exports = Page;

CHILD

// login.page.js

import Page from './page';

class LoginPage extends Page {

  open() {
    super.open('/login');
  }
}

module.exports = new LoginPage();

使用页面 object

测试规范文件

const LoginPage = require('./login.page.js');
describe('test', () => {
    it('can open', () => {
        LoginPage.open();
    });
});

WebdriverIO ES6 PageObject 方法不是函数错误

WebdriverIO ES6 PageObject method is not a function error

javascript

pageobjects

webdriver-io