The BugReplay Nightwatch service records screencasts of your automated tests including timesynced JavaScript Console and Network logs
Install the package
npm install nightwatch-bugreplay --save-dev
You will need to sign up for an account at https://bugreplay.com. After that you will need to login and get an API key by clicking the Hamburger Menu, click My Settings, and then Show API Key. You'll use this in the configuration file.
In nightwatch.conf.js, you will need to setup a globals_path where you setup the BugReplay automation extension, a globals object where you specify the apiKey and your bugreplay report attributes as well as configure the BugReplay automation extension to be added to chrome:
//nightwatch.conf.js
module.exports = {
src_folders : ["tests"],
// ...
globals_path : 'global.conf.js', // Specify a global config file
// ...
test_settings : {
// ...
default : {
// ...
globals: {
apiKey: 'YOUR_BUGREPLAY_API_KEY_GOES_HERE',
saveSuccessfulTests: true, // the default is false
test_run_id : process.env.TEST_RUN_ID || new Date().toISOString(), // Assign a unique test run ID for each run. Defaults to current timestamp.
project_id: 'YOUR_BUGREPLAY_PROJECT_ID', // OPTIONAL: Your BugReplay ProjectID you want your reports to save. Defaults to your active project ID.
assigned_user_id: 'YOUR_BUGREPLAY_ASSIGNEE_ID', // OPTIONAL: UserID of your BugReplay team member you want the bugreport to assign. Default is unassigned.
tags: 'automation, nightwatch, chrome', // OPTIONAL: comma separated tags you want to assign to the bugreport.
status_id: 'YOUR_BUGREPLAY_STATUS_ID' // OPTIONAL: assign the status id by default. Default is New.
},
desiredCapabilities: {
// ...
browserName: 'chrome',
'goog:chromeOptions': {
args: [
'--load-extension=node_modules/bugreplay-automation/extension/',
'--auto-select-desktop-capture-source=Record This Window'
]
}
}
}
}
};
In your global config file, setup the bugreplay automation extension using the apiKey
//global.conf.js
const bugreplay = require('nightwatch-bugreplay'); // import nightwatch-bugreplay package
module.exports = {
// ...
asyncHookTimeout : 60000, // minimum time it takes for bugreplay extension to capture bug report. Specify atleast 60 secs
// ...
// beforeEach hook which runs before each test suite
beforeEach: async (browser, done) => {
await bugreplay.setup(browser.globals.apiKey, browser, done); //setup bugreplay using the apiKey specified under globals in nightwatch.conf.js
},
// ...
};
And lastly, in each of your testsuite within your src_folders specify the beforeEach and afterEach test hooks to start and stop bugreplay recording respectively
// search.e2e.js
const bugreplay = require('nightwatch-bugreplay'); // Import nightwatch bugreplay package
describe('Search ecosia.org', () => {
// start bugreplay recording before each testcase
beforeEach(async (browser, done) => {
await bugreplay.startRecording(browser, done);
});
// stop bugreplay recording after each testcase
afterEach(async (browser, done) => {
await bugreplay.stopRecording(browser, done)
browser.end() // Make sure .end() is only called after you stop bugreplay recording.
});
test('Search nightwatch', (browser) => {
browser
.url('https://www.ecosia.org/')
.pause(1000)
.waitForElementVisible('body')
.assert.titleContains('Ecosia')
.assert.visible('input[type=search]')
.setValue('input[type=search]', 'nightwatchjs')
.assert.visible('button[type=submit]')
.click('button[type=submit]')
.assert.containsText('.mainline-results', 'Nightwatch.js')
});
test('Search BugReplay', (browser) => {
browser
.url('https://www.ecosia.org/')
.pause(1000)
.waitForElementVisible('body')
.assert.titleContains('Ecosia')
.assert.visible('input[type=search]')
.setValue('input[type=search]', 'BugReplay')
.assert.visible('button[type=submit]')
.click('button[type=submit]')
.assert.containsText('.mainline-results', 'BugReplay')
});
// ...
});
After this configuration your tests will automatically be recorded to video, uploaded to BugReplay, and ready for playback alongside the timesynced JS console and network traffic logs.
While the above configuration is mostly focused on capturing your automated bug reports on chrome, you can setup your tests to run on MS Edge (chromium) browser.
To get started with MS Edge, install selenium server along with the nightwatch-bugreplay package
npm install --save-dev selenium-server nightwatch-bugreplay
Check the version of your MS Edge browser and then download the appropriate version of MS Edge driver from
https://developer.microsoft.com/en-us/microsoft-edge/tools/webdriver/
Next, you will need to configure selenium-server and MS Edge browser capability in your nightwatch config file nightwatch.config.js
//nightwatch.conf.js
const seleniumServer = require("selenium-server");
module.exports = {
src_folders : ["tests"],
// ...
globals_path : 'global.conf.js', // Specify a global config file
selenium: {
"start_process": true, // tells nightwatch to start/stop the selenium process
"server_path": seleniumServer.path,
"host": "127.0.0.1",
"port": 4444, // standard selenium port
"cli_args": {
"webdriver.edge.driver" : 'LOCATION_OF_MS_EDGE_DRIVER' // location of your msedgedriver executable file
}
},
// ...
test_settings : {
// ...
default : {
// ...
globals: {
// ...
},
desiredCapabilities: {
browserName: 'MicrosoftEdge',
'ms:edgeOptions': {
w3c: false,
args: [
'--load-extension=node_modules/bugreplay-automation/extension/ ',
'--auto-select-desktop-capture-source=Record This Window'
]
}
}
// ...
}
// ...
}
// ...
}
Currently, we do not support Firefox browser.