WebdriverIO ES6 PageObject 方法不是函数错误答案

【问题标题】：WebdriverIO ES6 PageObject method is not a function errorWebdriverIO ES6 PageObject 方法不是函数错误
【发布时间】：2017-12-14 15:31:58
【问题描述】：

我正在尝试使用WebdriverIO Docs 中定义的语法定义一个 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 很陌生。

【问题讨论】：

标签： javascript pageobjects webdriver-io

【解决方案1】：

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

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

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

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

【讨论】：

【解决方案2】：

我发现这对我有用

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

家长

//page.js

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

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

儿童

// login.page.js

import Page from './page';

class LoginPage extends Page {

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

module.exports = new LoginPage();

使用页面对象测试 Spec 文件

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

【讨论】：