Establish automated frontend testing

[martinheppner]

See: https://app.meticulous.ai/organizations/Bahn%20zum%20Berg

[martinheppner]

This issue is depending on #169

After that we can establish the file meticulous.yml again - see below.

`name: Meticulous

Important: The workflow needs to run both on pushes to your main branch and on pull requests.

It needs to run on your main branch because it'll use the results from the

base commit of the PR on the main branch to compare against.

on: push: branches:

• uat pull_request: {}

  Important: We need the workflow to be triggered on workflow_dispatch events,

  so that Meticulous can run the workflow on the base commit to compare

  against if an existing workflow hasn't run

  workflow_dispatch: {}

Important: The workflow needs all the permissions below.

These permissions are mainly need to post and update the status check and

feedback comment on your PR. Meticulous won’t work without them.

permissions: actions: write checks: write contents: read discussions: write pull-requests: write statuses: write

jobs: test: name: Report diffs runs-on: ubuntu-latest

steps:
  - name: Checkout repository
    uses: actions/checkout@v3

  - name: Install Node.js
    uses: actions/setup-node@v3
    with:
      node-version: "18.9.1"

  - name: Cache node_modules
    id: cache-npm
    uses: actions/cache@v3
    env:
      cache-name: cache-node-modules
    with:
      # npm cache files are stored in `~/.npm` on Linux/macOS
      path: ~/.npm
      key: ${{ runner.os }}-build-${{ env.cache-name }}-${{ hashFiles('**/package-lock.json') }}
      restore-keys: |
        ${{ runner.os }}-build-${{ env.cache-name }}-
        ${{ runner.os }}-build-
        ${{ runner.os }}-

  - name: Install npm dependencies
    run: npm install

  - name: Serve project
    # Notes:
    #
    # 1. Please make sure your serve command listens 0.0.0.0 rather than localhost or 127.0.0.1
    #    (i.e. listens to all requests via all network interfaces rather than just the loopback interface
    #    - see https://stackoverflow.com/a/20778887 for more details)
    # 2. The sleep is often required to ensure your app is readily being served by the time the Meticulous tests start
    run: |
      npm run start-remote-api
      sleep 5

  - name: Run Meticulous tests
    uses: alwaysmeticulous/report-diffs-action@v1
    with:
      api-token: ${{ secrets.METICULOUS_API_TOKEN }}
      app-url: "http://localhost:3000/"

`