Scenario:
I have cypress tests that we run on multiple environments( more than 8), each environment with a separate domain, so we have configured all the domains in cypress.json file under env, now I need to pass the domain dynamically, i.e, from command line and be able to pick it and run the tests on respective domain. but I'm not sure how I can grab that value passed in command line.
Note: I have tried process.env method but did not work.
Code looks like this :
Cypress.json
{
"env": {
"domain1": xyz.com,
"domain2": abc.com,
"domain3": 123.com
}
}
package.json :
{
scripts: {
"test": "npm run cypress open --env domian= $1
}
}
$1 is suppose to get me the command line argument"
From my files under integration folder, Cypress.env(Cypress.env().domain) will/should fetch me the right domain.
However I'm receiving $1 as domain value.
Please help.
Can you share how $1 is supposed to reference the env file? I don't understand that part.
In the meantime, here is an alternative answer to your problem. (just tested it out)
You can write several test scripts which each provide a different domain address.
{
scripts: {
"test1": "npm run cypress open --env domian=xyz.com",
"test2": "npm run cypress open --env domian=abc.com",
"test3": "npm run cypress open --env domian=123.com"
}
}
Related
I launch a debug session through the Module option and specifying a folder, the app starts up and responds to requests - and code changes are seen when other services interact with mine by calling into it (print statements show the change in the terminal output of the IDE), however, breakpoints are not hit. How come?
My devcontainer.json file looks like this:
{
"name": "Existing Dockerfile",
"build": {
"dockerfile": "../Dockerfile",
"context": "../.",
"target": "deploy"
},
}
My Dockerfile does the usual stuff and runs our app with python -m app:
FROM python:3.9.3-slim AS deploy
COPIES SOME FILES
CMD ["python", "-m", "app"]
My problem was the version of python that was pulled in.
In my Dockerfile, I had to change:
FROM python:3.9.3-slim AS base
to
FROM python:3.9.4-slim AS base
Then breakpoints started working.
I just have a question around best method to start my react app when I run cypress test. Right now the way its setup for me I need to start my server then run cypress test. I would like a single command to start react app -> run Cypress test.
I am new to both react and cypress
My package.json looks like this
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "cypress run",
"eject": "react-scripts eject"
},
Currently I need to run npm start then in another window npm test
I tried to start and run test in a single line but I could not get it to work. It just started react app and did nothing else.
I wrote this up recently as part of a series on TDD in JS, you can read the full article on my blog.
First, install some useful helper dependencies:
$ npm install concurrently cross-env wait-on
Then add some extra scripts to the package.json:
"e2e:ci": "concurrently -k -s first \"npm:e2e:ci:*\"",
"e2e:ci:app": "cross-env BROWSER=none PORT=4321 npm start",
"pree2e:ci:run": "wait-on -t 30000 http-get://localhost:4321",
"e2e:ci:run": "cross-env CYPRESS_BASE_URL=http://localhost:4321 npm run e2e",
So what does that do? When we run npm run e2e:ci, the concurrently script is going to run two things in parallel for us:
e2e:ci:app: Run the app using npm start, with some environment variables set via cross-env (this allows it to work on *nix and Windows):
BROWSER=none stops the browser from popping up and taking over the screen [this is the default behaviour of a React app created by CRA, which the article was using]; and
PORT=4321 runs the app on the specified port (so we can still have a version running on port 3000 without causing any conflicts).
e2e:ci:run: Run the E2E tests in a two-step process:
The pre script runs first, and uses wait-on to wait for up to 30,000ms for the app to be running on the specified port; then
If that works (i.e. the app starts in less than 30s) run the actual tests, with the baseUrl configuration overridden to point to the right place.
The other configuration options passed to concurrently itself are:
-k, meaning stop all of the other processes when one exits (in this case we expect our tests to exit at some point and want to stop the app when they do); and
-s first, meaning that the output of the overall command is the output of the first one to exit (i.e. output from the e2e:ci command should be the output from the tests).
Building on the answer by jonrsharpe, I also needed to launch my (golang, though the implementation language doesn't really matter) api server, and I'm running tests via wdio. It uses the same toolset as his answer but with an extra step:
"e2e:ci": "concurrently -k -s first \"npm:e2e:ci:*\"",
"e2e:ci:server": "cross-env SERVER_PORT=40001 ./launchServer.sh",
"pree2e:ci:app": "wait-on -t30000 http-get://localhost:40001/state",
"e2e:ci:app": "cross-env BROWSER=none PORT=40002 npm start",
"pree2e:ci:run": "wait-on -t 30000 http-get://localhost:40002",
"e2e:ci:run": "npx wdio run ./wdio.conf.js --baseUrl http://localhost:40002"
The two extra scripts are:
e2e:ci:server which runs a script to launch the server
pree2e:ci:app just waits until the server is running. Note that it's not just waiting on "/" -- my api server 404s on root requests, and wait-on needs to get a 2xx response, so the http-get url needs to be a valid api endpoint ("/state").
It's also worth noting that wdio just uses an extra command line argument to set the base url instead of the env var in the original cypress solution.
I am facing an issue while building my React project using GitHub as a repository, Travis as CI with AWS ElasticBeanStalk as a service to run my app using Docker. I am able to run my test suite but after that, it is not deploying my app on AWS and also not getting any error in Travis console except below:
Below is my Travis .yml file configuration:
language: generic
services:
- docker
before_install:
- docker build -t heet1996/my-profile -f Dockerfile.dev .
script:
- docker run heet1996/my-profile npm run test -- --coverage
deploy:
provider: elasticbeanstalk
region: "us-east-1"
app: "My-profile"
env: "MyProfile-env"
bucket_name: "elasticbeanstalk-us-east-1-413920612934"
bucket_path: "My-profile"
on:
branch: master
access_key_id: $AWS_ACCESS_KEY
secret_access_key: "$AWS_SECRET_KEY"
Let me know if you need more information
A couple things you could try:
Your script command needs to set the environment var CI=true
So
script:
- docker run heet1996/my-profile npm run test -- --coverage
Becomes
script:
- docker run -e CI=true heet1996/my-profile npm run test -- --coverage
Also AWS needs the access variables to be named differently.
Change
access_key_id: $AWS_ACCESS_KEY
secret_access_key: "$AWS_SECRET_KEY"
To
access_key_id: "$AWS_ACCESS_KEY_ID"
secret_access_key: "$AWS_SECRET_ACCESS_KEY"
Using the option --coverage, your test will hang, waiting for input. Hence the message: "...no output has been received in the last 10m0s...".
At a certain point, --coverage was probably able to stop tests (as some used for that purpose), but I guess it was not meant for that and subsequent versions of docker removed that behavior.
Your test must conclude and the conclusion be a success for the deployment by Travis to begin.
Use instead the option --watchAll=false. So you should have:
...
script:
- docker run heet1996/my-profile npm run test -- --watchAll=false
...
That would take care of the obvious issue of your test never concluding (that could be the only issue). Afterward, make sure that your tests are successful. Then, you can worry about other issues such as authentication on AWS, etc...
I am getting invalid host header problem while i am trying to server my application by ng serve --host 0.0.0.0 . I have tried the following.
1.install -g angular-cli
2. cd to that app-directory
3. change port in angular-cli.json
"defaults": {
"styleExt": "css",
"component": {},
"serve": {
"port": 1337
}
}
ng serve --host 0.0.0.0
Requested url in browser is http://port-1337.angular2-jobproject0889272.codeanyapp.com/
I was looking to sovle a different problem and came across an answer that may work for you.
ng serve --port 8080 --host 0.0.0.0 --disableHostCheck true
Angular-cli GitHub
If I'm understanding your question correctly, your issue could be stemming from Webpack's security impl.
As the Angular CLI uses Webpack by default to bundle your app, you have to abide by its requirements when using "ng serve". App bundles produced by Webpack now require the Host header of the request to match the listening address OR the host provided in the public option.
The public option is a --public flag passed with the "ng serve" command. On CodeAnywhere you should most likely care to indicate a port # as well. A valid "ng serve" command could look like this:
$ ng serve --host 0.0.0.0 --port 3000 --public myproject-myusername.codeanyapp.com
(For HTTPS service, CodeAnywhere requires you use port 3000)
You can find your specific value for the --public flag in your CodeAnywhere IDE by right-clicking on your project's tree view Connection icon and selecting the "info" option.
To simplify things, you can set this up in your package.json file and then start the Angular server with the command:
$ npm start
For example, you can modify the "start" element of the package.json "scripts" entry as follows:
"scripts": {
"ng": "ng",
"start": "ng serve --host 0.0.0.0 --port 3000 --public myproject-myusername.codeanyapp.com"
}
Hopefully this info is applicable to the issue you are facing. Good Luck!
How do a run the servers I need as well as the e2e tests in a teamcity build step(s)?
I have protractor e2e test for my angular 2 application. (I have a funny mix of angular-cli and gulp, but bear with me.)
Here's how I run my tests locally. I need three console windows (w1,w2,w3).
w1) First thing I need to do is start my application:
npm start -> Which I have defined in package.json as ng serve -prod
w2) Then start the fake back-end, an express webserver
npm run gulp e2e-server -> I've defined "gulp": "gulp" in my package config, because gulp won't be recognised on teamcity.
3w) And then finally I can run my e2e tests
npm run e2e -- e2e/protractor-teamcity.conf.js I've defined "pree2e": "webdriver-manager update" and "e2e": "protractor" in my package config
Then...
I need to manually stop the two servers I started.
Something like this hack will work:
npm run gulp e2e-clean && start "MyWindow" cmd /c "start npm start && npm run gulp e2e-server" && ping -n 31 127.0.0.1 >nul && npm run e2e -- e2e/protractor-teamcity.conf.js
But start creates console windows that will never stop. I'm not sure what the consequences of this are (I doubt this will run successfully twice). The ping is a sleep hack, which isn't ideal either.
Has anyone found a solution for running a command "in the background" during the test run and then killing it afterwards?
So, this is a terrible hack. The sort of hack that suggests something is deeply wrong, but ho-hum:
When ng serve runs it will change the console window title to "angular-cli", when gulp runs it which change it to "gulp" (or "select gulp"). I don't expect anything else will be running with these titles. This is enough to write __kill-running-windows to go and kill these windows.
Package.json:
"scripts": {
"start": "ng serve -prod",
"test": "gulp test-teamcity",
"pree2e": "webdriver-manager update",
"e2e": "protractor",
"gulp": "gulp",
"e2e-teamcity": "gulp _e2e-clean && npm run _e2e-teamcity & npm run _kill-running-windows",
"_e2e-teamcity": "npm run _e2e-servers && gulp __wait-60 && gulp _e2e-test-teamcity",
"_e2e-servers": "start gulp _e2e-server && start gulp serve",
"_kill-running-windows": "taskkill /fi \"Windowtitle eq gulp\" & taskkill /fi \"Windowtitle eq select gulp\" & taskkill /fi \"Windowtitle eq angular-cli\" & taskkill /fi \"Windowtitle eq select angular-cli\""
},
The code (the interesting parts anyway, I'll leave what eg gulp serve to the readers imagination):
var expressServer = require("gulp-express");
var process = require("child_process");
var shell = require("gulp-shell");
/**
* Run vanilla e2e tests with teamcity reporter
*
* (Remember to call `e2e-server`, `serve` and edit `config.json` to point at config.e2e.json` first)
*/
gulp.task("_e2e-test-teamcity", function(done) {
return gulp.src("")
.pipe(
shell(["npm run e2e -- e2e/protractor-teamcity.conf.js"])
)
});
gulp.task("__wait-60", function(done) {
// HACK: Do 61 pings -> wait 30 seconds
process.exec("ping 127.0.0.1 -n 61 > nul", function (err, stdout, stderr) {
done();
});
});
/**
* Run mock backend for the e2e, with canned answers to all calls
* !! Use config.e2e.json in your application in order to point at this !!
*/
gulp.task("_e2e-server", function () {
expressServer.run(["./e2e/server.js"]);
gulp.watch(["./e2e/server.js"], expressServer.notify);
});
For some reason, moving more code into gulp seemed to make the builds never finish on teamcity. But here's the e2e I use locally, which is more gulp based:
/**
* Run vanilla e2e tests
* Cleans screenshots folder, tarts the application, starts the mock server
* Leaves command windows running the servers open at the end of the test run
*
* 30 second wait for tests to start
*
* (Remember to edit `config.json` to point at config.e2e.json` first)
*/
gulp.task("e2e", ["_e2e-clean"], function (done) {
gulp.src("")
.pipe(
shell(["start gulp _e2e-server"])
).pipe(
shell(["start gulp serve"])
);
runSequence("__wait-30","_e2e-test", done);
});