在运行Nightwatch.js测试时，如何获取当前正在运行测试的浏览器名称？

Question

Situation : We are running tests in several browsers using Nightwatch
( via Saucelabs; everything runs fine on Saucelabs ).

Desired : we want to know which browser the test is currently running in so we can save screenshots including the browser name.

Is it possible to determine which browser is running the tests?

Answer 1

Its quite simple, when running a Nightwatch test, the browser ( or client ) parameter is passed in, eg:

module.exports = {
  'Demo test GitHub': function (browser) {
    console.log(browser.options); // this will output the browser details
    browser
      .url('http://www.github.com/dwyl')   // visit the url
      .waitForElementVisible('body'); // wait for the body to be rendered
      .assert.containsText('body', 'do what you love') // assert contains
      .saveScreenshot('dwyl_github.png')
      .end();
  }
};

The browser Object contains an options Object with the following form:

{ screenshots: true,
  screenshotsPath: './node_modules/nightwatch/screenshots/1.0.20/',
  skip_testcases_on_fail: true,
  log_screenshot_data: true,
  username: 'thisguy',
  accessKey: 'notimportant',
  desiredCapabilities: 
   { browserName: 'internet explorer',
     javascriptEnabled: true,
     acceptSslCerts: true,
     platform: 'Windows 10',
     version: '11.0',
     name: 'Github' } }

So we wrote a little helper function to format the name of the browser into a string we could include in the screenshot file name:

function userAgent(browser) { // see: https://git.io/vobdn
  var a = browser.options.desiredCapabilities;
  return (a.platform + '~' + a.browserName + '~' + a.version).replace(/ /g, '');
}

Which is then used as:

module.exports = {
  'Demo test GitHub': function (browser) {
    console.log(browser.options); // this will output the browser details
    browser
      .url('http://www.github.com/dwyl')   // visit the url
      .waitForElementVisible('body'); // wait for the body to be rendered
      .assert.containsText('body', 'do what you love') // assert contains
      .saveScreenshot(userAgent(browser) + '_dwyl_github.png')
      .end();
  }
};

Example filename: Windows10~internetexplorer~11.0~dwyl_github.png

The reason for using ~ ("tilde") as the word separator was so we can later split on this character in our screenshot viewer. See: https://github.com/dwyl/learn-nightwatch for more detail.