Afaik当前无法仅通过webdriverio和appium截取特定Web元素的屏幕截图（通过Web选择器）。尽管webdriverio提供了element.saveScreenshot功能，但它似乎不适用于带有appium的移动设备。

我要解决的方法是使用browser.saveScreenshot(filepath)截取整个页面的屏幕快照（确保为此切换到本机上下文），然后将其裁剪为图像库中的矩形元素（清晰） （以我为例）。

我的util函数如下所示：

import fs from 'fs';
import path from 'path';
import sharp from 'sharp';

export function takeScreenshot(element) {
  const timestamp = moment().format('YYYYMMDD-HHmmss.SSS');
  if (fs.existsSync('reports/screenshots/')) {
    const filePath = path.join('reports/screenshots/',timestamp + '.png');
    WebView.switchToContext(CONTEXT_REF.NATIVE);
    browser.saveScreenshot(filePath);
    WebView.switchToContext(CONTEXT_REF.WEBVIEW);

    if (element) {
      const size = getRealSize(element);
      const location = getRealLocation(element);
      const outputPath = path.join('reports/screenshots/',element.selector + timestamp + '.png');
      sharp(filePath).extract({ width: size.width,height: size.height,left: location.x,top: location.y }).toFile(outputPath)
        .then(function () {
          fs.unlinkSync(filePath);
          fs.renameSync(outputPath,filePath);
        })
        .catch(function (err) {
          console.log(err);
        });
    }
  }
}

export function getPixelRatio() {
  return browser.capabilities.pixelRatio ? browser.capabilities.pixelRatio : 1;
}

export function getRealLocation(element) {
  const location = element.getLocation();
  return {
    x: Math.round(location.x * getPixelRatio()),y: Math.round(location.y * getPixelRatio())
  }
}

export function getRealSize(element) {
  const size = element.getSize();
  return {
    width: Math.round(size.width * getPixelRatio()),height: Math.round(size.height * getPixelRatio())
  }
}