如何在NightWatch.js测试中获取完整的Chrome浏览器控制台日志？

以下是针对你遇到的“仅能获取8条日志，实际控制台有300+条”问题的解决方案：

1. 修正NightWatch配置中的日志权限设置 #

W3C模式下，Chrome的日志偏好设置需要使用goog:loggingPrefs而非原有的loggingPrefs键名，同时确保配置层级正确。修改你的nightwatch.conf.js：

module.exports = {
  src_folders: ["tests"],
  
  webdriver: {
    start_process: true,
    port: 4444,
    server_path: require('chromedriver').path,
    cli_args: ['--log-level=ALL'] // 确保ChromeDriver输出完整日志
  },
  
  test_settings: {
    default: {
      launch_url: 'https://nightwatchjs.org',
      desiredCapabilities : {
        browserName : 'chrome',
        'goog:chromeOptions' : {
          w3c: true,
          args: [
            '--no-sandbox',
            '--disable-dev-shm-usage'
          ]
        },
        handleAlerts: true,
        'goog:loggingPrefs': { 'browser': 'ALL' } // 替换原loggingPrefs
      }
    }
  }
};

2. 调整日志获取时机与异步逻辑 #

方案A：使用getLog并确保异步完成后结束测试 #

原脚本中browser.end()在getLog回调外执行，会导致测试提前结束，日志未完全获取。需要将end()移至回调内，同时添加等待确保所有日志生成：

module.exports = {
    'Console Log Test': function (browser) {
        browser
            .url(`${environment.API_PATH_LOCAL}/log-test`)
            .waitForElementVisible('ion-button[data-e2e="dial-digit-5"]', 10000)
            .waitForElementVisible('ion-button[data-e2e="dial-digit-2"]', 10000)
            .waitForElementVisible('ion-button[data-e2e="dial-digit-0"]', 10000)
            .waitForElementVisible('#callBtn', 10000)
            .click('ion-button[data-e2e="dial-digit-5"]')
            .click('ion-button[data-e2e="dial-digit-2"]')
            .click('ion-button[data-e2e="dial-digit-0"]')
            .click('ion-button[data-e2e="dial-digit-0"]')
            .click('#callBtn')
            .pause(5000) // 等待足够时间让所有日志输出
            .getLog('browser', function(logEntriesArray) {
                console.log('Log length: ' + logEntriesArray.length);
                logEntriesArray.forEach(function(log) {
                    console.log('[' + log.level + '] ' + log.timestamp + ' : ' + log.message);
                });
                browser.end(); // 测试结束放在日志获取完成后
            });
    }
}

方案B：使用captureBrowserConsoleLogs全程监听日志 #

该方法需要在页面导航前就启动监听，才能捕获从页面加载到操作后的所有日志：

module.exports = {
    'Console Log Test': function (browser) {
        browser
            .captureBrowserConsoleLogs((event) => {
                console.log('[' + event.level + '] ' + event.timestamp + ' : ' + event.message);
            })
            .url(`${environment.API_PATH_LOCAL}/log-test`)
            .waitForElementVisible('ion-button[data-e2e="dial-digit-5"]', 10000)
            .waitForElementVisible('ion-button[data-e2e="dial-digit-2"]', 10000)
            .waitForElementVisible('ion-button[data-e2e="dial-digit-0"]', 10000)
            .waitForElementVisible('#callBtn', 10000)
            .click('ion-button[data-e2e="dial-digit-5"]')
            .click('ion-button[data-e2e="dial-digit-2"]')
            .click('ion-button[data-e2e="dial-digit-0"]')
            .click('ion-button[data-e2e="dial-digit-0"]')
            .click('#callBtn')
            .pause(5000) // 等待日志全部输出
            .end();
    }
}

3. 额外注意事项 #

• 确保ChromeDriver版本与本地Chrome浏览器版本匹配，版本不兼容可能导致日志捕获异常。
• 若日志仍有缺失，可尝试关闭Chrome的日志限制：在goog:chromeOptions的args中添加--disable-logging --log-level=0（注意与之前的日志参数配合调整）。

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