如何在WebdriverIO中获取元素底层JS对象以执行原生JS函数？

要在WebdriverIO中执行getBoundingClientRect这类原生JS方法，核心是通过execute方法运行原生JS代码直接操作DOM元素，具体有两种常用方式：

• 使用全局的browser.execute方法
  先获取WebdriverIO元素对象，再将其作为参数传入execute的回调函数，回调内即可拿到原生DOM元素并调用对应方法：

  const elem = $('li#wmd-help-button');
  const rect = browser.execute((element) => {
    return element.getBoundingClientRect();
  }, elem);
  

• 使用元素对象自身的execute方法
  如果你的WebdriverIO版本支持，也可以直接调用元素对象的execute方法，回调内的参数就是当前元素的原生DOM对象：

  const elem = $('li#wmd-help-button');
  const rect = elem.execute((element) => {
    return element.getBoundingClientRect();
  });
  

这种方式适用于所有WebdriverIO未直接封装的原生元素方法，只要在回调函数里对原生DOM元素调用对应的方法即可。

内容的提问来源于stack exchange，提问作者George Pligoropoulos