如何在 CodeceptJS 帮助器中访问 WebdriverIO 元素方法？答案

【问题标题】：How do I access WebdriverIO element methods in CodeceptJS helper?如何在 CodeceptJS 帮助器中访问 WebdriverIO 元素方法？
【发布时间】：2019-11-01 11:10:57
【问题描述】：

我正在使用 CodeceptJS 和 WebDriverIO 在我的 Angular 应用程序中编写 E2E 测试。

我的 Angular 应用有一些带有影子 DOM 的 Web 组件。我想要的是获取对阴影根内元素的引用并执行某些操作，例如单击、检查文本等。

但是，我不确定如何访问 WebDriverIO API，然后我可以使用它来访问影子根。据我了解，CodeceptJS 本身并没有提供抽象层来访问具有阴影根的元素，这就是我尝试使用 WebDriverIO 的原因。 WebDriverIO 有一个函数可以用来访问影子根中的元素 (https://webdriver.io/docs/api/element/shadow$.html)

这是我的设置：

codecept.conf.js

exports.config = {
  output: './report/e2e',
  helpers: {
    WebDriver : {
      smartWait: 5000,
      url: 'http://localhost:4200',
      browser: "chrome",
      restart: false,
      windowSize: "1920x1680",
      timeouts: {
        "script": 60000,
        "page load": 10000
      }
    }
    DomHelper:{
      require: './e2e/src/helpers/dom.helper.js'
    }
  },
  include: {
    I: './e2e/src/steps_file.js'
  },
  mocha: {},
  bootstrap: null,
  teardown: null,
  hooks: [],
  gherkin: {
    features: './e2e/src/features/**/*.feature',
    steps: ['./e2e/src/step_definitions/basic.steps.js']
  },
  plugins: {
    screenshotOnFail: {
      enabled: true
    },
    wdio: {
      enabled: true,
      services: ['selenium-standalone']
    }
  },
  tests: './e2e/src/**/*.test.js',
  name: 'test-app'
};

【问题讨论】：

标签： javascript webdriver e2e-testing webdriver-io codeceptjs

【解决方案1】：

您可以像这样在自定义 CodeceptJS 帮助器中访问 WebdriverIO 浏览器命令：

class MyHelper extends Helper {

  async accessWd() {
    const browser = this.helpers.WebDriver.browser;
  }
}

module.exports = MyHelper;

如果要访问 WebdriverIO 元素方法，则需要选择所需的元素。

结果/返回值将有可用的方法。

【讨论】：