How to using .env variable in package.json

Question

I'm using Cypress to run some tests with my VueJS project.

I just want to run test with browser I want so I made a .env like below

BROWSER=edge

And in package.json file, I write a command like this:

"scripts":{
      "cy:run" : "cypress run --browser %BROWSER%"
}

I know I can put the command like this

"cy:run" : "cypress run --browser edge"

But the reason I created an .env file is when the test is finished, I want to save my test result with the browser's name. So when I change the BROWSER in my .env, after that I just only run npm command.

But it didn't work. Cypress cannot detect which browser I wanted. I've tried so many ways, including this.

Can anyone tell me how to make it work? Super many thanks.

I've tried with a specific browser, when the test is done, test results save with the name I want, which means BROWSER in .env file is OK to use.

score 0 · Answer 1 · answered Oct 10 '22 at 04:51

0

You need two dashes for the full "browser" option

"scripts":{
  "cy:run" : "cypress run --browser %BROWSER%"
}

or one dash for shortcut "-b"

"scripts":{
  "cy:run" : "cypress run -b %BROWSER%"
}

answered Oct 10 '22 at 04:51

TesterDick

3,830
5
18

It was my mistake when typing the question. I've edited my question. – Nguyễn Nhật Trường Oct 10 '22 at 05:00
Both of these examples work, so you must be failing to set up `%BROWSER%`. – TesterDick Oct 10 '22 at 05:32
Are you looking for [dotenv package](https://www.npmjs.com/package/dotenv)? If so, you cannot use `%BROWSER%` on the script with that configuration. – TesterDick Oct 10 '22 at 05:38
Yes, I'm using dotenv. So what can I do now? I figured that `cypress run -b %BROWSER% `, it will looking for the system environment variable named BROWSER. So when I run `set BROWSER=edge` on the cmd, and `cypress run` again, it works. But that's not what I wanted. – Nguyễn Nhật Trường Oct 10 '22 at 06:12
I just add a workaround above. – Nguyễn Nhật Trường Oct 10 '22 at 07:39

Nguyễn Nhật Trường · Accepted Answer · 2022-10-10T07:45:53.917

0

I figured this out, by using cross-env

First I install cross-env with npm i cross-env

In my package.json, I modified like this

"scripts":{
   "run:env" : "cross-env BROWSER=\"edge\" npm run cy:run"
   "cy:run" : "cross-env-shell cypress run --browser=$BROWSER"
 }

Then I run npm run run:env

Everything works now.

The process.env.BROWSER is still usable even I deleted the .env file

edited Oct 10 '22 at 07:45

answered Oct 10 '22 at 07:32

Nguyễn Nhật Trường

45
1
8

How to using .env variable in package.json

2 Answers2