使用webdriverio和browsermob从BrowserStack捕获HAR

时间:2019-05-22 16:21:01

标签: selenium webdriver-io browserstack browsermob-proxy

我正在尝试使用BrowserMob代理捕获使用WebdriverIO在BrowserStack上运行的测试的HAR

到目前为止,我有以下代码

conf / local.conf.js

const browserstack = require('browserstack-local');
const Proxy = require('browsermob-proxy').Proxy;
const fs = require('fs');

exports.config = {
    user: process.env.BROWSERSTACK_USERNAME || 'shubhamjindal2',
    key: process.env.BROWSERSTACK_ACCESS_KEY || 'PyNWYKCcnwxt4XMCP52s',
    proxyHost: process.env.PROXY_HOST || 'localhost',
    proxyPort: process.env.PROXY_PORT || '9090',

    updateJob: false,
    specs: [
        './test/specs/localTest.js'
    ],
    exclude: [],

    capabilities: [{
        'os': 'Windows',
        'os_version': '10',
        'browserName': 'Chrome',
        'browserVersion': '62.0',
        'browserstack.local': 'true',
        'browserstack.video': 'false',
        'seleniumProtocol': 'WebDriver'
    }],
    logLevel: 'warn',
    coloredLogs: true,
    screenshotPath: './errorShots/',
    baseUrl: '',
    waitforTimeout: 10000,
    connectionRetryTimeout: 90000,
    connectionRetryCount: 3,
    host: 'hub.browserstack.com',

    before: function() {
        const chai = require('chai');
        global.expect = chai.expect;
        chai.Should();
    },
    framework: 'mocha',
    mochaOpts: {
        ui: 'bdd',
        timeout: 60000
    },

    // Code to start browserstack local before start of test
    onPrepare: function(config, capabilities) {
        console.log("Connecting local");
        exports.proxy = new Proxy();

        exports.proxy.start(exports.config.proxyPort, function(err, data) {
            if (!err) {
                exports.proxy.startHAR(exports.config.proxyPort, 'dummy', true, true);
            } else {
                console.error(err);
            }
        });

        capabilities['proxy'] = {
            httpProxy: exports.proxy,
        };

        const bsLocalArgs = {
            'key': exports.config.key,
            'forcelocal': true,
            'forceproxy': true,
            'force': true,
            'v': true,
            '-local-proxy-host': exports.config.proxyHost,
            '-local-proxy-port': exports.config.proxyPort,
        };

        return new Promise(function(resolve, reject) {
            exports.bsLocal = new browserstack.Local();
            exports.bsLocal.start(bsLocalArgs, function(error) {
                if (error) return reject(error);

                console.log('Connected. Now testing...');
                resolve();
            });
        });
    },

    // Code to stop browserstack local after end of test
    onComplete: function(exitCode, config, capabilities, results) {
        exports.bsLocal.stop();

        exports.proxy.getHAR(exports.config.proxyPort, function(err, resp) {
            console.log(err, resp);
            if (!err) {
                console.log('har saved at output.har');
                fs.writeFileSync('test/diagnostics/output.har', resp, 'utf8');
            } else {
                console.err('Error getting HAR file: ' + err);
            }
            exports.proxy.stop(exports.config.proxyPort);
        });
    },
}

tests / spec / localTest.js

describe('BrowserStack Local Testing', function() {
    it('can check tunnel working', function() {
        browser.url('http://localhost:8083');
    });
});

我一直坚持从onComplete挂钩中的代理获取HAR,但是我无法 想办法获得HAR。

这是正确的配置吗?如何以回调结束浏览器,以便代理能够捕获HAR?

我正在使用wdio cli进行测试

  

./ node_modules / .bin / wdio conf / local.conf.js

2 个答案:

答案 0 :(得分:0)

我了解您正在使用Webdriver IO来执行测试。您可以通过BrowserStack引用示例项目: https://github.com/browserstack/webdriverio-browserstack

通过将onPrepare函数替换为以下共享的函数,对local.conf.js文件进行如下更改。

我正在使用Charles Proxy捕获网络流量,它正在为我工​​作。 确保遵循Readme.md文件中提到的步骤。

onPrepare: function (config, capabilities) {
    console.log("Connecting local");
    return new Promise(function(resolve, reject){
      exports.bs_local = new browserstack.Local();
      exports.bs_local.start({'key': exports.config.key,'forcelocal': true, 'verbose': 'true','force':'true','proxyHost': '127.0.0.1', 'proxyPort': '8888','forceProxy': true }, function(error) {
        if (error) return reject(error);
        console.log('Connected. Now testing...');

        resolve();
      });
    });
  },

答案 1 :(得分:0)

如果我理解正确,出于某些原因,您需要收集HAR以便在BrowserStack上运行会话。 如果是这样,则BrowserStack提供此网络日志功能,您可以将其作为HAR文件获取,并包含将从浏览器移动中获取的所有网络信息。 您可以使用其API获取网络日志。

检索自动化网络日志

每个会话的网络日志都可以采用HAR(HTTP存档)格式,并且可以使用REST API进行检索。

curl -u "USERNAME:ACCESS_KEY" https://api.browserstack.com/automate/builds/<build-id>/sessions/<session-id>/networklogs

和供参考,请从您发布的代码中删除BrowserStack用户名和访问密钥。