CODEWITHSUNDEEP
jestjscontinuous-integrationcypressgithub-actions
CT100
CT100

Reputation: 113

Github Actions - Run server & frontend, then execute tests

I would like to use Github Actions for CI and run tests before the branch can be merged.

I have a single repository that has both my server and frontend within it (Nest & Angular).
I am using Cypress/Jest for my tests.

I need my backend server running for my frontend cypress tests to pass.
Currently GH Actions doesn't move onto the next step because the backend process is running - but that's what I need to happen...

How should I set this up so that I can use GH Actions for CI?

name: test
on: [push]
env:
  CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }}
  GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
  OTHER_SECRETS: ${{ secrets.otherSecrets }}
jobs:
  cypress-run:
    runs-on: macos-11
    steps:
      # start cypress w/github action: https://github.com/cypress-io/github-action
      - name: Setup Node.js environment
        uses: actions/[email protected]
        with:
          node-version: '16.13.0'
      - name: Checkout
        uses: 'actions/checkout@v2'
      - name: "Start Backend"
        run: |
          cd server &&
          npm install &&
          npm run build &&
          npm run start:prod
      - name: "Start Frontend"
        run: |
          npm install &&
          npm run build &&
          npm run start
      - name: Cypress run
        uses: cypress-io/github-action@v2
        with:
          record: true
          browser: chrome
      - name: "Run Jest Tests"
        run: |
            cd server &&
            npm run test

#note: I have tried appending the "&& sleep 10 && curl http://localhost:port -i" option to the npm commands - and it hasn't worked for me.

#note2: It's my first time w/ GH Actions, so maybe I'm missing something obvious!!

Upvotes: 9

Views: 6775

Answers (2)

user18103863
user18103863

Reputation: 1

I had the same problem, server running but never moving to the next step of running the Cypress tests. Thanks didwefixit, using just one & worked to start the server and then run Cypress test script worked:

 jobs: 
  build: 
    env:
      CI: true
    strategy: 
      matrix: 
        node-version: [14.x, 16.x]
    runs-on: [ ubuntu-latest ]
    steps: 
      - uses: actions/checkout@v2
      - name: Use Node.js version ${{ matrix.node-version }}
        uses: actions/setup-node@v2
        with: 
          node-version: ${{ matrix.node-version }}
      - run: npm install --prefix client
      - run: npm install --prefix server
      - run: npm install 
      - run: npm run build --prefix client
      - run: npm run start --prefix server & npm run test

script in client package.json:

"build": "BUILD_PATH=../server/public react-scripts build"

script in server package.json:

"start": "node src/server.js"

script in root package.json:

"test": "npx cypress run"

Upvotes: 0

didwefixit
didwefixit

Reputation: 63

#note: I have tried appending the "&& sleep 10 && curl http://localhost:port -i" option to the npm commands - and it hasn't worked for me.

There is a slight error here, && will wait for the previous command to complete and only run the next one if it is successful & would run the previous command in the background and then will move on to running the next one. Therefore as nothing stops your server, && won't work.

I am not sure it is the cleanest way but the following should work, I have used an equivalent to run a UI in one of my projects.

  - name: "Start Backend"
    run: |
      cd server &&
      npm install &&
      npm run build &&
      npm run start:prod &
      sleep 5 &&
      curl http://localhost:port -I
  - name: "Start Frontend"
    run: |
      npm install &&
      npm run build &&
      npm run start &
      sleep 5 &&
      curl http://localhost:port -I

Upvotes: 6

Related Questions