How to configure Cypress for e2e in Github Actions?-CodePudding

I am trying to do an e2e test on my VueJS app that uses axios for API calls. In my vue component, in the mounted, i do an API call. My idea would be to mock this call with cy.intercept and cy.wait, however i can't make it work. On my local environment when i launch my frontend and backend servers, my test passes as the API call is made. However, the call is not silenced and the cy.wait('@apiCall') does not work.

Also my test does not work in Github Actions, i have this error : AxiosError: The following error originated from your application code, not from Cypress. It was caused by an unhandled promise rejection.. I have the impression that github actions need a special ci environment file but i don't know where to tell cypress to look into those env variables when in continous integration.

Anyone had the same issue or knows about cypress X axios X github actions combined ?

Some of my code :

test.cy.js

cy.intercept('GET', '/coaches/coach-informations/30283', {
  data: {
    email: '[email protected]',
  },
}).as('getCoach')

cy.visit('/hello?coach=30283')

cy.wait('@getCoach')

component.vue

async mounted() {
   await axios.get(`/coaches/coach-informations/30283/`)
}

.env

API_URL=http://127.0.0.1:8000/api

test-frontend.yml

name: GitHub Actions Demo
on: [pull_request, push]
jobs:
  cypress-run:
    runs-on: ubuntu-latest
    env:
      working-directory: front
    steps:
      - name: Checkout
        uses: actions/checkout@v3

      - name: Install node
        uses: actions/setup-node@v3
        with:
          node:version: 'node-version'

      - name: Get yarn cache directory path