WebDriver.io视觉自动化测试报错：TypeError: browser.saveScreen is not a function

saveScreen并非WebDriverIO核心API的方法，它来自wdio-image-comparison-service插件，出现这个错误的核心原因是插件未正确安装、配置，或者版本不兼容。以下是具体排查步骤：

1. 确认视觉测试插件是否安装 #

检查项目的package.json中是否存在wdio-image-comparison-service依赖。如果没有，执行安装命令：

npm install wdio-image-comparison-service --save-dev

2. 检查WDIO配置文件（wdio.conf.js） #

必须在配置文件的services数组中添加该服务，并配置必要参数，示例如下：

exports.config = {
    // 其他配置项...
    services: [
        ['image-comparison', {
            baselineFolder: './tests/screenshots/baseline/', // 基准截图存放路径
            screenshotPath: './tests/screenshots/', // 测试截图存放路径
            autoSaveBaseline: true, // 自动保存基准图
            savePerInstance: true
        }]
    ],
    // 其他配置项...
};

3. 验证版本兼容性 #

WebDriverIO与wdio-image-comparison-service存在版本匹配要求：

• WebDriverIO v8 → 对应插件v4.x版本
• WebDriverIO v7 → 对应插件v3.x版本

如果npm update后出现版本不兼容，可指定对应版本重新安装：

# 针对WDIO v8的安装命令
npm install wdio-image-comparison-service@4 --save-dev

4. 修复代码中的异步调用问题（非直接相关，但建议修正） #

你的afterEach钩子中的方法未使用await，可能导致后续测试出现异常，建议修改为：

afterEach(async () => {
    await browser.execute('window.localStorage.clear()');     
    await browser.deleteAllCookies()
    await browser.execute('sessionStorage.clear()')    
});

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