When I run cypress as npm run cypress run build fails - gitlab-ci

I have installed cypress using npm as npm install cypress --save-dev .
I used the same command in .gitlab-ci.yml file
When i run the command npm run cypress run locally , IDE opens and when i double click the spec.js file , then the tests run.
But I i use the same command on the gitlab pipeline , it says
cypress open "run"
It looks like this is your first time using Cypress: 4.1.0
[07:45:16] Verifying Cypress can run /osmc/ux/framework-acceptance-tests/cache/Cypress/4.1.0/Cypress [started]
[07:45:18] Verifying Cypress can run /osmc/ux/framework-acceptance-tests/cache/Cypress/4.1.0/Cypress [completed]
Opening Cypress...
and build fails .
Am i missing anything here ?

It's because it's opening the test runner, which is used locally via npx cypress open.
From that output it looks like you're running npx cypress open run, which isn't a real command and will open the runner
In CI you need to use npx cypress run, which will run tests without user interaction. https://docs.cypress.io/guides/guides/command-line.html#How-to-run-commands

Your gitlab.yml file should accomodate for the npm installations.
One example is as below. Meanwhile also please check the test/run command for your specs under package.json file. use the same command to trigger the test in pipeline.
stages:
- test
test:
image: cypress/browsers:node12.14.1-chrome85
stage: test
script:
npm i
npm run start:ci &
npx cypress run

You should have your .gitlab-ci.yml with:
stages:
- test
cypress-test:
image: cypress/browsers:node16.14.0-slim-chrome99-ff97
stage: test
script:
- npm ci
- npx cypress run

Related

NPX command not running in Azure pipeline

I need your help
I was trying to run my cypress test cases which I generally run using command
"npx cypress run"
so I tried to have the same command in tasks when I created Azure pipeline
after NPM Install
I even tried installing npx via
npm task and custom command "npm install nx"
and this causing the below issue so can anyone suggest to me how to proceed in this case
"##[warning]Couldn't find a debug log in the cache or working directory
##[error]Error: Npm failed with return code: 1
"
From the error screenshot, it shows that you are using the Npm Task and running the command: npm npm install nx.
The command is invalid.
To solve this issue, you need to remove the npm in the NPM task -> Command and arguments .
Refer to the following sample:
YAML Pipeline:
- task: Npm#1
displayName: 'npm custom'
inputs:
command: custom
verbose: false
customCommand: 'install nx'
Classic Pipeline:

What are the equivalent CI commands for Vue projects based on Vite instead of the Vue CLI?

I created a new Vue project via npm init vue#latest. I used the Vue CLI before and want to get into Vite now. Inside my Github action I used the Vue CLI service commands before but now I'm looking for the equivalent commands using Vite.
Check that the code style is fine (no errors, no warnings)
Inside my workflow I previously used the command
npm run lint -- --no-fix --max-warnings=0
Based on the lint script command
eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore
I added the lint:ci script command
eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --max-warnings 0 --ignore-path .gitignore
Check that unit tests are passing
Inside my workflow I previously used the command
npm run test:unit
Based on the test:unit script command
vitest --environment jsdom
I added the test:unit:ci script command
vitest --environment jsdom --run
Check that e2e tests are passing
Inside my workflow I previously used the command
npm run test:e2e -- --headless
There already is a test:e2e:ci script command and based on the Cypress docs I think I have to use it this way (which worked for me)
- name: Check if e2e tests are passing
uses: cypress-io/github-action#v2
with:
build: npm run build
start: npm run test:e2e:ci
Do you have any better solutions? I'm not sure if this is the most elegant way or if Vue/Vite already provide some commands I don't know about yet.
Thanks in advance!

NodeJS docker image to run Angular test in gitlab-ci

I have a small Angular app which I am try to build using gitlab-ci and node docker image, when I try to run the test using the command npm run test it fails with the following error :
ERROR [launcher]: No binary for Chrome browser on your platform. Please, set "CHROME_BIN" env variable.
gitlab-ci.yml
stages:
- build
variables:
NPM_CONFIG_REGISTRY: https://test.com/xx/api/npm/npm-all
build:
stage: build
image: node:12.9
script:
- npm install
- npm run build:prod
- npm run test
tags:
- DOCKER
In the above code npm run test executes ng test as configured in the package.json
I was able to run the build but when I run the test it looks for a chrome browser, I also tried running the test in a headless way using the below command but resulted in the same error :
ng test --no-watch --browsers=ChromeHeadless
How do I add the chrome feature to this build ?
Either install Chrome by yourself or try an existing Docker image that already includes it.

yarn serve in background

I'm trying to configure gitlab CI/CD for cypress e2e testing on my vue app which uses yarn for package management. cypress documents are all written for npm cypress gitlab ci/cd configuration tutorial
# start the server in the background
- npm run start:ci &
# run Cypress tests
- npx cypress run --browser firefox
is there a way to start server in background for yarn? like running yarn serve but in background.
There is an issue with the command yarn serve&. It will still give you this screen when done compiling:
I found a way to work around this through pm2 and this command
pm2 start yarn --interpreter bash --name api -- start

cypress: pass environment variables from command line with npm run cy:open

In cypress.json there is one env variable:
"env": {
"AUTH_TOKEN": "token_1"
},
I have multiple users in db and would like to test them separately without editing cypress.json. Cypress documentation provides two possible ways how to override env variables form command line:
cypress run --env AUTH_TOKEN="token_2"
and
AUTH_TOKEN="token_2" cypress run
When I run cypress interface with
npm run cy:open --env AUTH_TOKEN="token_2"
or
AUTH_TOKEN="token_2" npm run cy:open
token_1 does not get overriden with token_2. Why is cypress ignoring options provided in command line?
npm run requires a -- to pass parameters to script cy:open in package.json,
npm run cy:open -- --env AUTH_TOKEN="token_2"
or use yarn
yarn cy:open --env AUTH_TOKEN="token_2"
or bypass the script
yarn cypress open --env AUTH_TOKEN="token_2"
or
npx cypress open --env AUTH_TOKEN="token_2"