Run Same Testcafe tests with different URLs per environment - automation

I am working on a TestCafe proof of concept. I have a few tests working in one test environment. I need a way to run the same tests in up to 3 different test environments that have different URLs. Is there a best practice for this scenario?

A solution is to add custom options on the testcafe command-line like for example : --env=uat.
Use minimist to read all custom options that you have added to the TestCafe command-line and export a config object like this:
import * as minimist from 'minimist';
const args = minimist(process.argv.slice(2));
// get the options --env=xxx --user=yyy from the command line
export const config = {
env: args.env,
user: args.user,
};
Then import that config object wherever you need it in the test code.
see How do I work with configuration files and environment variables? for more details.

In v1.20.0 and later, TestCafe offers a way to specify the baseUrl in the test run setup:
CLI
Program API runner.run({baseUrl})
Config file
You can use this approach along with environment variables or custom command line arguments to determine what url should be assigned to the baseUrl option.
Alternatively, you can have a different configuration file for each test run setup and switch between these files using the --config-file option.

Related

VueJS place multiple .env in folder

Hello I'm using VueJS 2 and I have multiple .env in my project.
My app have .env for each company to select the company configuration (skin color / files...)
Actually I have all my .env in the root folder:
.env.company1-dev
.env.company1-staging
.env.company1-prod
.env.company2-dev
.env.company2-staging
.env.company2-prod
.env.company3-dev
.env.company3-staging
.env.company3-prod
So when I'll get 20 companies it will be confused on my root folder so it is possible to create a folder where I can place all my .env ?
The idea :
/environments/company1/
.env.dev
.env.staging
.env.prod
/environments/company2/
.env.dev
.env.staging
.env.prod
/environments/company3/
.env.dev
.env.staging
.env.prod
On your vue.config.js file you can add:
const dotenv = require("dotenv");
const path = require("path");
let envfile = ".env";
if (process.env.NODE_ENV) {
envfile += "." + process.env.NODE_ENV;
}
const result = dotenv.config({
path: path.resolve(`environments/${process.env.VUE_APP_COMPANY}`, envfile)
});
// optional: check for errors
if (result.error) {
throw result.error;
}
the before run you can set VUE_APP_COMPANY to a company name and run your app,
Note: It's important to put this code on vue.config.js and not in main.js because dotenv will use fs to read files.
References
https://github.com/motdotla/dotenv#path
https://github.com/vuejs/vue-cli/issues/787
https://cli.vuejs.org/guide/mode-and-env.html#environment-variables
The accepted answer we have also used in the past. But I found a better solution to handle different environments. Using the npm package dotenv-flow allows not only the use of different environments but has some more benefits like:
local overwriting of variables by using .env.local or .env.staging.local and so on
definition of defaults using .env.defaults
In combination we have set up our projects with this configuration:
.env
.env.defaults
.env.development
.env.production
.env.staging
.env.test
And the only thing you have to do in your vue.config.js, nuxt.config.js or other entry points is
require('dotenv-flow').config()
Reference: https://www.npmjs.com/package/dotenv-flow
The powershell solution
I was handling exactly the same problem. Accepted solution is kind of ok, but it did not solve all differences between companies. Also, if you are using npm, your scripts can look nasty. So if you have powershell, here is what I suggest - get rid of the .env files :)
You can keep your structure like you want in the question. Just convert the env files to ps1.
/build/company1/
build-dev.ps1
build-stage.ps1
build-prod.ps1
/build/company2/
build-dev.ps1
build-stage.ps1
build-prod.ps1
Inside each of those, you can fully customize all env variables, run build process and apply some advanced post-build logic (like careful auto-deploy, publishing, merging with api project, ..).
So for example company1\build-stage.ps1 can look like this:
# You can pass some arguments to the script
param (
[string]$appName = "company1"
)
# Set environment variables for vue pipeline
$env:VUE_APP_ENVIRONMENT = "company1-stage";
$env:NODE_ENV="development";
$env:VUE_APP_NAME=$appName;
$env:VUE_APP_API_BASE_URL="https://company1.stage.mycompany.com"
# Run the vue pipeline build
vue-cli-service build;
# Any additional logic e.g.
# Copy-Item -Path "./dist" -Destination "my-server/my-app" -Recurse¨
Last part is easy - just call it (manualy or from integration service like TeamCity). Or, you can put it inside package.json.
...
"scripts": {
"build-company1-stage": "#powershell -Command ./build/company1/build-stage.ps1 -appName Company-One",
}
...
The you can call whole build process just by calling
npm run build-company1-stage
Similary, you can create localhost, dev, prod, test and any other environment. Let the javascript handle the part of building the app itself. For other advanced work, use poweshell. I think that this solution gives you much more flexibility for configuration and build process.
P.S.
I know that this way I'm merging configuration and build process, but you can always extract the configuration outside the file if it gets bigger.

SAUCE_CONFIG_PATH is not working for me in testcafe-browser-provider-saucelabs

I am trying to use testcafe-browser-provider-saucelabs.
My tests can successfully connect to SauceLabs and run there, but testcafe creates a unique sauceconnect tunnel, whereas I need to use a shared tunnel. Also, screenResolution is not being picked up from sauceLabsConfig.json file.
I have saucelabs credentials set as environment variables.
I am launching tests using these commands:
export SAUCE_JOB="Regression Job"
export SAUCE_BUILD="Build 1"
export SAUCE_CONFIG_PATH="./sauceLabsConfig.json"
testcafe saucelabs:chrome tests/
I created a sauce config JSON file:
{
"parentTunnel": "PARENT_TUNNEL",
"tunnelIdentifier": "qa",
"screenResolution": "1920x1080"
}
Why is my SAUCE_CONFIG_PATH variable not working?
At present, not all SauceLabs options are supported for the 'testcafe-browser-provider-saucelabs'. For example, the tunnelIdentifier option is not supported. I've created an issue in the browser provider repository. Track it be informed about the progress.
Note that this issue seems to be fixed, per this pull request:
https://github.com/DevExpress/saucelabs-connector/pull/33
...and integrated in to testcafe 1.14.0:
https://github.com/DevExpress/testcafe/tree/v1.14.0

How to get the currently active configuration in a detox test

In the docs it is described how to add multiple detox configs to package.json
When I run the tests with detox --configuration someconfig, how do I find out the someconfig parameter in my tests (in someTestSuite.spec.js)?
Use case: in a test I want to set username and password textinputs based on the config, eg.
await getUNameTextInput().typeText('someUsernameBasedOnConfig');
Thanks.
There's a non official way of accessing the configuration name, and it may change in the future:
const argparse = require('detox/src/utils/argparse');
const configurationName = argparse.getArgValue('configuration');

Driving Nightwatch Tests through REPL

I currently have nightwatch.js setup using the vue automated setup. That template is located here.
https://github.com/vuejs-templates/webpack/tree/master/template/test/e2e
Is it possible to run nightwatch assertions through the command line in a REPL like fashion that is available in webdriver.io? Here is a reference to the webdriver feature https://twitter.com/webdriverio/status/806911722682544128
Update, we have moved to using Cypress.io It has made us pretty happy
You can use nightwatch-repl package available on NPM.
https://www.npmjs.com/package/nightwatch-repl
// nightwatch.conf.js
var repl = require('nightwatch-repl');
module.exports = (function (settings) {
repl.init(settings);
...
...
return settings;
})(require('./nightwatch.json'));
Once you run your tests and invoke browser.repl()
you should see the following in your console
Running: Login to dashboard
Type in a command (eg: browser.function()) or type "quit" to exit
repl>

Passing cli parameters to casperjs through grunt task and npm test

I'm running tests with npm test - that actually runs a grunt task grunt casperjs:
casperjs:{
options:{},
files:
['./test_index.js',
'./test_map_regression.js',
'./test_index_get_gush.js'] /
},
using the grunt-casperjs-plugin in order to automate testing with slimerjs along with phantomjs, both running under casperjs in Travis-ci.
In order to do that, I need to pass the engine as a variable from the command line. something like:
casperjs --engine=slimerjs test_suite.js
Question: I can't find a way to pass the options from grunt cli (and I assume npm command line options would delegate to grunt. correctly?) to the files array.
I tried to add:
var engine = grunt.option('engine') || 'phantomjs';
engine = '--engine='+engine;
and then in the file array do:
files:['./test_index.js '+engine,
'./test_map_regression.js '+enging,
'./test_index_get_gush.js '+engine]
but seems that file array has to get real file names without the added args.
I'll be glad for any ideas on how to solve this through.
I haven't tested this, but looking at the grunt-casperjs source, it looks as though you would want to pass the engine as an option.
So, something like this should work:
casperjs:{
options: {
'engine': 'slimerjs'
},
files: [
'./test_index.js',
'./test_map_regression.js',
'./test_index_get_gush.js'
]
}