How to get nightwatch test_workers work with browserstack-local - nightwatch.js

I am trying to get Nightwatch's inbuilt parallel test_workers working with browserstack-local for local url testing.
When running tests without browserstack local, Nightwatch test_workers seem to work just fine. The same is true for running local tests without test_workers enabled.
I have tried the examples found here https://github.com/browserstack/nightwatch-browserstack but none of these uses browserstack-local in combination with Nightwatch test_workers.
When running locally with test_workers I get the following output.
Connecting local
Connected. Now testing...
Process terminated with code 0.
Has anyone else encountered similar issues?
EDIT: I have since resolved this issue and have posted an answer below
I have dumped the relevant configuration files below.
My local.conf.js
nightwatch_config = {
globals_path: 'globals.js',
output_folder: false,
src_folders: ['tests'],
selenium: {
'start_process': false,
'host': 'hub-cloud.browserstack.com',
'port': 80
},
test_workers: {
"enabled": true,
"workers":2
},
test_settings: {
default: {
desiredCapabilities: {
'browserstack.user': process.env.BROWSERSTACK_USER,
'browserstack.key': process.env.BROWSERSTACK_ACCESS_KEY,
'browserstack.local': true,
'browserstack.debug': false,
}
}
}
};
// Code to copy seleniumhost/port into test settings
for (let i in nightwatch_config.test_settings) {
if (nightwatch_config.test_settings.hasOwnProperty(i)) {
let config = nightwatch_config.test_settings[i];
config['selenium_host'] = nightwatch_config.selenium.host;
config['selenium_port'] = nightwatch_config.selenium.port;
}
}
module.exports = nightwatch_config;
local.runner.js
#!/usr/bin/env node
var Nightwatch = require('nightwatch');
var browserstack = require('browserstack-local');
var bs_local;
process.env.BROWSERSTACK_ID = new Date().getTime();
try {
process.mainModule.filename = "./node_modules/.bin/nightwatch";
// Code to start browserstack local before start of test
console.log("Connecting local");
Nightwatch.bs_local = bs_local = new browserstack.Local();
bs_local.start({ 'key': process.env.BROWSERSTACK_ACCESS_KEY }, function (error) {
if (error) throw error;
console.log('Connected. Now testing...');
Nightwatch.cli(function (argv) {
Nightwatch.CliRunner(argv)
.setup(null, function () {
// Code to stop browserstack local after end of parallel test
bs_local.stop(function () { });
})
.runTests(function () {
// Code to stop browserstack local after end of single test
bs_local.stop(function () { });
});
});
});
} catch (ex) {
console.log('There was an error while starting the test runner:\n\n');
process.stderr.write(ex.stack + '\n');
process.exit(2);
}
and my package.json script
node ./local.runner.js -c ./local.conf.js

The issue here was due to the module filename being incorrectly defined in the local.runner.js
process.mainModule.filename = "./node_modules/.bin/nightwatch";
should be pointed directly at the Nightwatch file in its directory.
process.mainModule.filename = "./node_modules/nightwatch/bin/nightwatch";
The difference in these files and the exact reason for this solution working are beyond me.
The answer was derived from the "suite" runner in https://github.com/browserstack/nightwatch-browserstack

It seems you are not specifying browsers. Modify your configuration file to be inline with the following configuration file:
var browserstack = require('browserstack-local');
nightwatch_config = {
src_folders : [ "local" ],
selenium : {
"start_process" : false,
"host" : "hub-cloud.browserstack.com",
"port" : 80
},
test_workers: {
"enabled": true,
"workers":2
},
common_capabilities: {
'browserstack.user': process.env.BROWSERSTACK_USERNAME || 'BROWSERSTACK_USERNAME',
'browserstack.key': process.env.BROWSERSTACK_ACCESS_KEY || 'BROWSERSTACK_ACCESS_KEY',
'browserstack.debug': true,
'browserstack.local': true
},
test_settings: {
default: {},
chrome: {
desiredCapabilities: {
browser: "chrome"
}
},
firefox: {
desiredCapabilities: {
browser: "firefox"
}
},
safari: {
desiredCapabilities: {
browser: "safari"
}
}
}
};
// Code to support common capabilites
for(var i in nightwatch_config.test_settings){
var config = nightwatch_config.test_settings[i];
config['selenium_host'] = nightwatch_config.selenium.host;
config['selenium_port'] = nightwatch_config.selenium.port;
config['desiredCapabilities'] = config['desiredCapabilities'] || {};
for(var j in nightwatch_config.common_capabilities){
config['desiredCapabilities'][j] = config['desiredCapabilities'][j] || nightwatch_config.common_capabilities[j];
}
}
module.exports = nightwatch_config;

Related

Cannot find module babel-preset-es2015 in cypress

The erros occurs when i add
const replace = require("replace-in-file"); in file to my code
const replace = require("replace-in-file");
const options = {
files: "./config/dashboardData.json",
configFile: true,
from: /}\n{/g,
to: ",\n",
};
I have installed babel and configured the preset still I got the issue
The package replace-in-file handles files on the OS, so it needs to be called from Node.
You would need to set up a Cypress task.
In Cypress ver 10+, do this in cypress.config.js
// cypress.config.js
const { defineConfig } = require("cypress");
module.exports = defineConfig({
e2e: {
setupNodeEvents(on, config) {
on('task', {
replaceTask(options) {
const replace = require("replace-in-file");
try {
const results = replace.sync(options);
return results
}
catch (error) {
return error
}
},
})
},
// other e2e configuration here
},
});
// test.spec.cy.js
it('calls replace-in-file', () => {
const options = {
files: "./config/dashboardData.json",
configFile: true,
from: /}\n{/g,
to: ",\n",
};
cy.task('replaceTask', options).then(resultsOrError => {
console.log(resultsOrError)
})
});

Can passed nightwatch.js tests be hidden in output?

The default Nightwatch.js output consumes one line per passed test. For example,
✔ Testing if element <body> contains text 'lecture is so boring' (12ms)
✔ Testing if element <button[id=btn1]> is visible (6ms)
✔ Testing if element <button[id=btn]> is visible (10ms)
✔ Testing if element <#fill1> is visible (19ms)
✔ Testing if element <#fill2> is visible (18ms)
✔ Testing if element <#fill3> is visible (20ms)
Currently Nightwatch consumes far more of my screen than the rest of my build output combined. On the CLI on Linux, appending
|grep -v "✔"
to the command mostly alleviates that but has the disadvantage of stripping colored text (even with --color=always) when calling nightwatch from gulp. Is there a configuration option or command line parameter to minimize output and only show failed tests?
Ideally, if all tests pass, I would prefer just one line of output, but that may be asking too much. Using the grep above, this still results, which remains too much for my taste.
[Nightwatch] Test Suite
=======================
ℹ Connected to localhost on port 4444 (1133ms).
Using: firefox (91.0.1) on linux 4.19.0-18-amd64 platform.
Running: Demo of Quiz
OK. 51 assertions passed. (3.498s)
I'd really just like it to say
Nightwatch: 51 assertions passed. (3.498s)
or similar.
My config file:
// Autogenerated by Nightwatch
// Refer to the online docs for more details: https://nightwatchjs.org/gettingstarted/configuration/
const Services = {}; loadServices();
module.exports = {
// An array of folders (excluding subfolders) where your tests are located;
// if this is not specified, the test source must be passed as the second argument to the test runner.
src_folders: ['src/ts/test/functional'],
// See https://nightwatchjs.org/guide/working-with-page-objects/
page_objects_path: '',
// See https://nightwatchjs.org/guide/extending-nightwatch/#writing-custom-commands
custom_commands_path: '',
// See https://nightwatchjs.org/guide/extending-nightwatch/#writing-custom-assertions
custom_assertions_path: '',
// See https://nightwatchjs.org/guide/#external-globals
globals_path : '',
webdriver: {},
test_settings: {
default: {
disable_error_log: false,
launch_url: 'https://nightwatchjs.org',
screenshots: {
enabled: false,
path: 'screens',
on_failure: true
},
desiredCapabilities: {
browserName : 'firefox'
},
webdriver: {
start_process: true,
server_path: (Services.geckodriver ? Services.geckodriver.path : '')
}
},
firefox: {
desiredCapabilities : {
browserName : 'firefox',
alwaysMatch: {
// Enable this if you encounter unexpected SSL certificate errors in Firefox
// acceptInsecureCerts: true,
'moz:firefoxOptions': {
args: [
// '-headless',
// '-verbose'
],
}
}
},
webdriver: {
start_process: true,
port: 4444,
server_path: (Services.geckodriver ? Services.geckodriver.path : ''),
cli_args: [
// very verbose geckodriver logs
// '-vv'
]
}
},
chrome: {
desiredCapabilities : {
browserName : 'chrome',
chromeOptions : {
// This tells Chromedriver to run using the legacy JSONWire protocol (not required in Chrome 78)
// w3c: false,
// More info on Chromedriver: https://sites.google.com/a/chromium.org/chromedriver/
args: [
//'--no-sandbox',
//'--ignore-certificate-errors',
//'--allow-insecure-localhost',
//'--headless'
]
}
},
webdriver: {
start_process: true,
port: 9515,
server_path: (Services.chromedriver ? Services.chromedriver.path : ''),
cli_args: [
// --verbose
]
}
},
//////////////////////////////////////////////////////////////////////////////////
// Configuration for when using the browserstack.com cloud service |
// |
// Please set the username and access key by setting the environment variables: |
// - BROWSERSTACK_USER |
// - BROWSERSTACK_KEY |
// .env files are supported |
//////////////////////////////////////////////////////////////////////////////////
browserstack: {
selenium: {
host: 'hub-cloud.browserstack.com',
port: 443
},
// More info on configuring capabilities can be found on:
// https://www.browserstack.com/automate/capabilities?tag=selenium-4
desiredCapabilities: {
'bstack:options' : {
local: 'false',
userName: '${BROWSERSTACK_USER}',
accessKey: '${BROWSERSTACK_KEY}',
}
},
disable_error_log: true,
webdriver: {
keep_alive: true,
start_process: false
}
},
'browserstack.chrome': {
extends: 'browserstack',
desiredCapabilities: {
browserName: 'chrome',
chromeOptions : {
// This tells Chromedriver to run using the legacy JSONWire protocol
// More info on Chromedriver: https://sites.google.com/a/chromium.org/chromedriver/
w3c: false
}
}
},
'browserstack.firefox': {
extends: 'browserstack',
desiredCapabilities: {
browserName: 'firefox'
}
},
'browserstack.ie': {
extends: 'browserstack',
desiredCapabilities: {
browserName: 'IE',
browserVersion: '11.0',
'bstack:options' : {
os: 'Windows',
osVersion: '10',
local: 'false',
seleniumVersion: '3.5.2',
resolution: '1366x768'
}
}
},
//////////////////////////////////////////////////////////////////////////////////
// Configuration for when using the Selenium service, either locally or remote, |
// like Selenium Grid |
//////////////////////////////////////////////////////////////////////////////////
selenium: {
// Selenium Server is running locally and is managed by Nightwatch
selenium: {
start_process: true,
port: 4444,
server_path: (Services.seleniumServer ? Services.seleniumServer.path : ''),
cli_args: {
'webdriver.gecko.driver': (Services.geckodriver ? Services.geckodriver.path : ''),
'webdriver.chrome.driver': (Services.chromedriver ? Services.chromedriver.path : '')
}
}
},
'selenium.chrome': {
extends: 'selenium',
desiredCapabilities: {
browserName: 'chrome',
chromeOptions : {
w3c: false
}
}
},
'selenium.firefox': {
extends: 'selenium',
desiredCapabilities: {
browserName: 'firefox',
'moz:firefoxOptions': {
args: [
// '-headless',
// '-verbose'
]
}
}
}
}
};
function loadServices() {
try {
Services.seleniumServer = require('selenium-server');
} catch (err) {}
try {
Services.chromedriver = require('chromedriver');
} catch (err) {}
try {
Services.geckodriver = require('geckodriver');
} catch (err) {}
}
Edit: Just to mark it as answered
You need to add detailed_output: false in your nightwatch config file.

Laravel Inertia using InertiaProgress with Axios returns: Cannot read property 'defaultPrevented' of undefined

I am using current versions of Laravel & Inertia.js. I am also using IntertiaProgress and looking to use it during a file upload using axios
The files all upload OK but the console shows:
app.js:33316 Uncaught (in promise) TypeError: Cannot read property 'defaultPrevented' of undefined
Tracing this back it points to here in the source of InertiaProgress:
start(event) {
Promise.resolve().then(() => {
if (event.defaultPrevented) {
return
}
this.inProgress++
clearTimeout(this.timeout)
this.timeout = setTimeout(() => {
Nprogress.set(0)
Nprogress.start()
}, this.delay)
})
},
If I console.log(event) I get undefined
My upload() method:
upload(files) {
let url = this.$route('library.upload');
this.$root.showLoading = true;
const uploadConfig = {
timeout: 10000,
onUploadProgress: function(progressEvent) {
let percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total)
InertiaProgress.progress(percentCompleted)
}
}
InertiaProgress.start()
axios.post(url, {
files,
},
uploadConfig
).then(res => {
let files = res.data.files
if (files.length) {
this.filesList = cloneDeep(files)
}
this.newFiles = []
InertiaProgress.finish()
this.$root.showLoading = false
}).catch(err => {
console.log(err)
InertiaProgress.finish()
this.$root.showLoading = false
})
},
Any help is appreciated
You could use NProgress directly.
Instead of:
InertiaProgress.progress(percentCompleted)
Like this:
NProgress.progress(percentCompleted)
See also: https://inertiajs.com/progress-indicators

Can't write out protractor network/performance log in a custom jasmine reporter

I'm trying to write to console the network log after a test failure as part of my protractor suite. The code works fine when in an afterEach() block but fails to execute the promise when inside of a custom jasmine reporter. As far as I can tell the promise never executes, but there are no known/shown errors.
protractor config (simplified):
exports.config = {
specs: ['./e2e/**/*.spec.ts'],
capabilities: {
browserName: 'chrome',
chromeOptions: {
perfLoggingPrefs: {
enableNetwork: true,
enablePage: false,
}
},
loggingPrefs: {
performance: 'ALL',
browser: 'ALL'
},
},
onPrepare() {
jasmine.getEnv().addReporter({
specDone: result => {
new ErrorReporter(browser).logNetworkError(result);
}
});
},
};
ErrorReporter:
class ErrorReporter {
constructor(browser) {
this.browser = browser;
}
logNetworkError(result) {
if(result.status === 'failed') {
// execution makes it in here
this.browser.manage().logs().get('performance').then(function(browserLogs) {
// execution DOES NOT make it here
browserLogs.forEach(function(log) {
const message = JSON.parse(log.message).message;
if(message.method === 'Network.responseReceived') {
const status = message.params.response.status;
const url = message.params.response.url;
if(status !== 200 && status !== 304) {
console.log(`----E2E NETWORK ERROR----`);
console.log(`STATUS: [${status}]`);
console.log(`URL: [${url}]`);
console.log(`RESPONSE: [${log.message}]`);
}
}
});
});
}
}
}
module.exports = ErrorReporter;
The code inside the logNetworkError() method works completely fine when executed in an afterEach() block but never writes out any logs when executed as a custom reporter. I would expect that this would work as a jasmine reporter as well.
If it's not possible to execute this as a jasmine reporter is there some way to access the executed test's results in the afterEach() block? I do not want to log on successful test execution.
I figured out the solution. There was 2 main problems. The first was that I needed to use async and await inside of the function that was creating the log:
async logNetworkError(result) {
if(result.status === 'failed') {
const logs = await this.browser.manage().logs().get('performance');
logs.forEach((log) => {
const message = JSON.parse(log.message).message;
if(message.method === 'Network.responseReceived') {
const status = message.params.response.status;
const url = message.params.response.url;
if(status !== 200 && status !== 304) {
console.log(`-----E2E NETWORK ERROR-----`);
console.log(`TEST NAME: ${result.fullName}`);
console.log(`STATUS: [${status}]`);
console.log(`URL: [${url}]`);
console.log(`RESPONSE: [${log.message}]`);
}
}
});
}
}
the second part of the problem was that another reporter which was saving screenshots did not have async and await which was stopping other reporters from completing. Adding async/await to both reporters solved this issue.

Download file to given absolute path in Firefox using Protractor

Im using Protractor for E2E testing. During automation, I need to download files to C:\Automation folder in my system. But below code is not working.
Note:During automation execution,The Save as popup opens(but i have to disable that in future) and I manually click "Save" option. It saves in default location ie Downloads folder.How do I make it save in my given path.
let profile = require('firefox-profile');
let firefoxProfile = new profile();
//_browser = 'chrome';
_browser = 'firefox';
// _browser = 'internet explorer';
firefoxProfile.setPreference("browser.download.folderList", 2);
firefoxProfile.setPreference('browser.download.dir', "C:\\Automation");
exports.config = {
framework: 'custom',
frameworkPath: require.resolve('protractor-cucumber-framework'),
capabilities: {
'browserName': _browser,
'shardTestFiles': false,
'maxInstances': 1,
'acceptInsecureCerts': true,
'moz:firefoxOptions': {
'profile': firefoxProfile
}},
beforeLaunch: function () {...}
}
It looks like you may just be missing a couple of preferences for it to work with firefox. Try adding these and see if that helps.
profile.setPreference( "browser.download.manager.showWhenStarting", false );
profile.setPreference( "browser.helperApps.neverAsk.saveToDisk",
/* A comma-separated list of MIME types to save to disk without asking goes here */ );
this will save to downloads folder inside your project. You can try to tweak it to save to desired folder. You have to specify which types of files are suppose to be downloaded without prompt. JSON and csv are already there.
var q = require('q');
var path = require('path');
var sh = require("shelljs");
var cwd = sh.pwd().toString();
var FirefoxProfile = require('selenium-webdriver/firefox').Profile;
var makeFirefoxProfile = function(preferenceMap) {
var profile = new FirefoxProfile();
for (var key in preferenceMap) {
profile.setPreference(key, preferenceMap[key]);
}
return q.resolve({
browserName: 'firefox',
marionette: true,
firefox_profile: profile
});
};
exports.config = {
seleniumAddress: 'http://localhost:4444/wd/hub',
framework: 'jasmine2',
getMultiCapabilities: function() {
return q.all([
makeFirefoxProfile(
{
'browser.download.folderList': 2,
'browser.download.dir': (path.join(cwd, 'downloads')).toString(),
'browser.download.manager.showWhenStarting': false,
'browser.helperApps.alwaysAsk.force': false,
'browser.download.manager.useWindow': false,
'browser.helperApps.neverAsk.saveToDisk': 'application/octet-stream, application/json, text/comma-separated-values, text/csv, application/csv, application/excel, application/vnd.ms-excel, application/vnd.msexcel, text/anytext, text/plaintext'
}
)
]);
},
allScriptsTimeout: 1000000,
specs: ['./tmp/**/*.spec.js'],
jasmineNodeOpts: {
defaultTimeoutInterval: 1000000,
showColors: true
},
onPrepare: function() {
browser.driver.getCapabilities().then(function(caps) {
browser.browserName = caps.get('browserName');
});
setTimeout(function() {
browser.driver.executeScript(function() {
return {
width: window.screen.availWidth,
height: window.screen.availHeight
};
}).then(function(result) {
browser.driver.manage().window().setPosition(0,0);
browser.driver.manage().window().setSize(result.width, result.height);
});
});
}
};

Resources