ui-tests.js.yml

# Checking unit and visual tests locally on every merge rq to dev and main
name: Frontend tests

on:
  workflow_dispatch:
  push:
    branches: [ "main" ]
    paths:
      - frontend/**
      - tracker/**
  pull_request:
    branches: [ "dev", "main" ]
    paths:
      - frontend/**
      - tracker/**
env:
  API: ${{ secrets.E2E_API_ORIGIN }}
  ASSETS: ${{ secrets.E2E_ASSETS_ORIGIN }}
  APIEDP: ${{ secrets.E2E_EDP_ORIGIN }}
  CY_ACC: ${{ secrets.CYPRESS_ACCOUNT }}
  CY_PASS: ${{ secrets.CYPRESS_PASSWORD }}
  FOSS_PROJECT_KEY: ${{ secrets.FOSS_PROJECT_KEY }}
  FOSS_INGEST: ${{ secrets.FOSS_INGEST }}
jobs:
  build-and-test:
    runs-on: macos-latest
    name: Build and test Tracker plus Replayer
    strategy:
      matrix:
        node-version: [ 18.x ]
    steps:
      - uses: oven-sh/setup-bun@v1
        with:
          bun-version: latest
      - uses: actions/checkout@v3
      - name: Use Node.js ${{ matrix.node-version }}
        uses: actions/setup-node@v3
        with:
          node-version: ${{ matrix.node-version }}
      - name: Cache tracker modules
        uses: actions/cache@v3
        with:
          path: tracker/tracker/node_modules
          key: ${{ runner.OS }}-test_tracker_build-${{ hashFiles('tracker/tracker/bun.lockb') }}
          restore-keys: |
            test_tracker_build-{{ runner.OS }}-build-
            test_tracker_build-{{ runner.OS }}-
      - name: Setup Testing packages
        run: |
          cd tracker/tracker
          bun install
      - name: Build tracker inst
        run: |
          cd tracker/tracker
          bun run build
      - name: Setup Testing UI Env
        run: |
          cd tracker/tracker-testing-playground
          echo "REACT_APP_KEY=$FOSS_PROJECT_KEY" >> .env
          echo "REACT_APP_INGEST=$FOSS_INGEST" >> .env
      - name: Cache testing UI node modules
        uses: actions/cache@v3
        with:
          path: tracker/tracker-testing-playground/node_modules
          key: ${{ runner.OS }}-build-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.OS }}-build-
            ${{ runner.OS }}-
      - name: Setup Testing packages
        run: |
          cd tracker/tracker-testing-playground
          yarn
      - name: Cache node modules
        uses: actions/cache@v3
        with:
          path: frontend/node_modules
          key: ${{ runner.OS }}-build-${{ hashFiles('frontend/yarn.lock') }}
          restore-keys: |
            ${{ runner.OS }}-build-
            ${{ runner.OS }}-
      - name: Setup env
        run: |
          cd frontend
          echo "NODE_ENV=development" >> .env
          echo "SOURCEMAP=true" >> .env
          echo "ORIGIN=$API" >> .env
          echo "ASSETS_HOST=$ASSETS" >> .env
          echo "API_EDP=$APIEDP" >> .env
          echo "SENTRY_ENABLED = false" >> .env
          echo "SENTRY_URL = ''" >> .env
          echo "CAPTCHA_ENABLED = false" >> .env
          echo "CAPTCHA_SITE_KEY = 'asdad'" >> .env
          echo "MINIO_ENDPOINT = ''" >> .env
          echo "MINIO_PORT = ''" >> .env
          echo "MINIO_USE_SSL = ''" >> .env
          echo "MINIO_ACCESS_KEY = ''" >> .env
          echo "MINIO_SECRET_KEY = ''" >> .env
          echo "VERSION = '1.15.0'" >> .env
          echo "TRACKER_VERSION = '10.0.0'" >> .env
          echo "COMMIT_HASH = 'dev'" >> .env
          echo "{ \"account\": \"$CY_ACC\", \"password\": \"$CY_PASS\" }" >> cypress.env.json
      - name: Setup packages
        run: |
          cd frontend
          npm install --legacy-peer-deps
      - name: Run unit tests
        run: |
          cd frontend
          npm run test:ci
      - name: Upload coverage reports to Codecov
        uses: codecov/codecov-action@v3
        with:
          token: ${{ secrets.CODECOV_TOKEN }}
          flags: ui
          name: ui
      - name: Run testing frontend
        run: |
          cd tracker/tracker-testing-playground
          yarn start &> testing.log &
          echo "Started"
          npm i -g wait-on
          echo "Got wait on"
          sleep 30
          cat testing.log
          npx wait-on http://localhost:3000
          echo "Done"
        timeout-minutes: 4
      - name: Run Frontend
        run: |
          cd frontend
          bun start &> frontend.log &
          echo "Started"
          sleep 30
          cat frontend.log
          npx wait-on http://0.0.0.0:3333
          echo "Done"
        timeout-minutes: 4
      - name: (Chrome) Run visual tests
        run: |
          cd frontend
          npm run cy:test
#        firefox have different viewport somehow
#      - name: (Firefox) Run visual tests
#        run: yarn cy:test-firefox
#      - name: (Edge) Run visual tests
#        run: yarn cy:test-edge
      - name: Upload Debug
        if: ${{ failure() }}
        uses: actions/upload-artifact@v3
        with:
          name: 'Snapshots'
          path: |
            frontend/cypress/videos
            frontend/cypress/snapshots/replayer.cy.ts
            frontend/cypress/screenshots
            frontend/cypress/snapshots/generalStability.cy.ts