How to track HTTP calls using proxy browser and nightwatch.js?

Question

I am writing testcases using the Nightwatch.js framework for a SPA application. The following was required: to track HTTP calls and get results for the site. Since this can be easily achieved with JMeter.

Using a test automation tool, we can do this with a proxy browser and selenium.

Can I do the same using Nightwatch.js and browsermob proxies ?

And what are the steps that need to be taken for this.

Answer 1

Nightwatchjs browserermob-proxy , , NodeJS - browsermob HAR (HTTP Archive).

Nightwatchjs, :

• ,
• , , .

, , Nightwatch, !

Answer 2

browserermob-proxy-api --, npm: npm install browsermob-proxy-api --save-dev :

'test_settings': {
    'default': {
      'launch_url': 'http://localhost:3000',
      'screenshots': {
        'enabled': true, // if you want to keep screenshots
        'path': './screenshots' // save screenshots here
      },
      'globals': {
        'waitForConditionTimeout': 30000 // sometimes internet is slow so wait.
      },
      'desiredCapabilities': { // use Chrome as the default browser for tests
        'browserName': 'chrome',
        'proxy': {
          'proxyType': 'manual',
          'httpProxy': 'localhost:10800'
        },
        'acceptSslCerts': true,
        'javascriptEnabled': true, // turn off to test progressive enhancement

      }
    },

index.js : https://github.com/jmangs/node-browsermob-proxy-api step_definitions, gherkin describe step

Answer 3

. nightwatch.

• https://bmp.lightbody.net/
• cmd bin, , "browserermob-proxy".

• , . mobproxy. "npm browserermob-proxy-api"

• . "globalmodule.js" globals_path nightwatch.json

• globalmodule , http://nightwatchjs.org/guide#external-globals

• beforeEach hook :// , -

  var MobProxy = require ('browserermob-proxy-api');
   var proxyObj = new MobProxy ({'host': 'localhost', 'port': '8080'});

//, 8080. 2.

// -, . browserermob-proxy-api. , .

7. proxyObj.startPort(, (err, data) { if (err) { console.log(ERR); } else { console.log( " " ) } })

8. , Chrome , .

   proxyObj.startPort(, (err, data) { if (err) { console.log(ERR); } else { console.log( " " ) var dataInJson = JSON.parse();

// 8:

this.test_settings.desiredCapabilities =  {
"browserName": "chrome",
"proxyObj": proxyObj, //for future use
"proxyport": dataInJson.port, //for future use
"proxy": {
"proxyType": "manual",
"httpProxy": "127.0.0.1:" + dataInJson.port,
"sslProxy": "127.0.0.1:" + dataInJson.port //important is you have https site
},
"javascriptEnabled": true,
"acceptSslCerts": true,
"loggingPrefs": {
"browser": "ALL"
}
}
}
}) 

9. , , cmd [, 2 , . - ]

10. HAR HAR, browserermob-proxy-api api.

    createHAR.js nightwatch.json [custom_commands section]

    export.command = function (callback) { var self = this;

    if (! self.options.desiredCapabilities.proxyObj) { console.error( " - - setupProxy()?" ); }

    this.options.desiredCapabilities.proxyObj.createHAR(this.options.desiredCapabilities.proxyport, { 'captureHeaders': 'true', 'captureContent': 'true', 'captureBinaryContent': 'true', 'initialPageRef': 'homepage' }, function (err, result) { (ERR) { console.log(ERR) } { console.log() if (typeof callback === "function" ) { console.log(this.options.desiredCapabilities.proxyObj); console.log(this.options.desiredCapabilities.proxyport); //console.log(); callback.call(self, result); } } });

    ; };

, HAR, getHAR.js, .

var parsedData;
exports.command = function(callback) {
var self = this;
if (!self.options.desiredCapabilities.proxy) {
console.error('No proxy setup - did you call setupProxy() ?');
}

self.options.desiredCapabilities.proxyObj.getHAR(self.options.desiredCapabilities.proxyport, function (err, data) {
console.log(self.options.desiredCapabilities.proxyObj);
console.log(self.options.desiredCapabilities.proxyport);
//console.log(result);
if(err){
console.log(err)
}else{
parsedData = JSON.parse(data)
console.log(parsedData.log.entries)
}
if (typeof callback === "function") {
console.log(self.options.desiredCapabilities.proxyObj);
console.log(self.options.desiredCapabilities.proxyport);
callback.call(self, parsedData);
}
});

return this;
};

11. createHAR proxyObj, . browser.perform()

    browser.perform (function () {browser.createHAR ()}) //// some kind of navigation

    browser.perform (function () {browser.getHAR ()})

Note. If you work for a corporate proxy, you may need to use the proxy function offered by the browser. According to the browsermob proxy documentation, go to the api section, → / proxy may have the request parameters "proxyUsername" and "proxyPassword"

In node_modules -> browserermob-proxy-api-> index.js add the line below line 22:

this.proxyUsername  = cfg.proxyUsername || '';
this.proxyPassword = cfg.proxyPassword || '';
this.queryString = cfg.queryString || 'httpProxy=yourupstreamProxy:8080'; //you will get this from pac file

then at line 177, where package is making request '/proxy' to browser.
replace 
path: url
 to
path: url + '?proxyUsername=' +this.proxyUsername + '&proxyPassword=' +  this.proxyPassword + '&' + this.queryString