truckwashdashboardsfrontend

This template should help get you started developing with Vue 3 in Vite.

Recommended IDE Setup

VSCode + Volar (and disable Vetur).

Customize configuration

See Vite Configuration Reference.

Project Setup

npm install

Compile and Hot-Reload for Development

npm run dev

By default, the Vite dev server proxies /api/* to the remote stable API at https://api-v2.truckwash.io/master/api. This lets the Vue app run locally without a local PHP API container.

To develop against a local PHP API instead:

$env:VITE_API_PROXY_TARGET="http://localhost"; npm run dev

To use another remote API route:

$env:VITE_API_PROXY_BASE_PATH="/canary/api"; npm run dev

TLS certificate validation is enabled for proxied HTTPS APIs by default. If you are using a trusted local HTTPS API with a self-signed certificate, you can opt out explicitly:

$env:VITE_API_PROXY_TARGET="https://local-api.test"; $env:VITE_API_PROXY_SECURE="false"; npm run dev

For compatible local gateways that expect the /api prefix to be preserved:

$env:VITE_API_PROXY_TARGET="http://localhost"; $env:VITE_API_PROXY_STRIP_PREFIX="false"; npm run dev

Compile and Minify for Production

npm run build

Playwright Batched Chromium Runs

Run default e2e tests in deterministic 25-test shards across chromium-desktop and chromium-mobile:

npm run test:e2e:batched:chromium

Run the same flow and automatically re-run failed shards with PLAYWRIGHT_WORKERS=1:

npm run test:e2e:batched:chromium:rerun-failed

Optional overrides:

PLAYWRIGHT_BATCH_SIZE=25
PLAYWRIGHT_BATCH_WORKERS=2
PLAYWRIGHT_BATCH_DEV_PORT=5193

You can also forward Playwright args:

npm run test:e2e:batched:chromium -- --grep @smoke

Artifacts and summaries:

• output/playwright/batched-chromium/last-run.json
• output/playwright/batched-chromium/failed-shards.json
• output/playwright/batched-chromium/report-index.html
• output/playwright/batched-chromium-shard-<i>-of-<n>/report/index.html
• output/playwright/batched-chromium-rerun-shard-<i>-of-<n>/report/index.html

Playwright Full E2E

Run the permanent grouped full-suite entrypoint with a hard max of 5 total workers across the browser-engine groups:

• Chromium
• WebKit
• Firefox

npm run test:e2e:ci

The full CI matrix is ordered by browser engine, then device class, then user role:

• browsers: chromium, webkit, firefox
• devices: mobile, desktop, tablet
• roles: superuser, admin, customer, subuser

Run a single full-suite slice for one role and one Playwright project:

npm run test:e2e:full:slice -- --role=admin --project=webkit-tablet

Default worker allocation:

PLAYWRIGHT_PARALLEL_WORKERS_CHROMIUM=2
PLAYWRIGHT_PARALLEL_WORKERS_FIREFOX=1
PLAYWRIGHT_PARALLEL_WORKERS_WEBKIT=1

Optional overrides:

PLAYWRIGHT_PARALLEL_BASE_PORT=5191
PLAYWRIGHT_PARALLEL_WORKERS_CHROMIUM=2
PLAYWRIGHT_PARALLEL_WORKERS_FIREFOX=1
PLAYWRIGHT_PARALLEL_WORKERS_WEBKIT=1

The runner fails fast if the combined worker count exceeds 5.

GitHub Actions keeps the full browser/device/role matrix stable by capping full-suite matrix parallelism at 2 jobs, running each full slice with PLAYWRIGHT_WORKERS=1, wrapping Docker Playwright runs with systemd-inhibit when available, and setting PLAYWRIGHT_VIDEO_MODE=off for the full matrix. The E2E network harness serves Font Awesome from local fixtures so WebKit page loads and visual snapshots do not depend on CDN/TLS availability. Traces and screenshots are still retained on failure.

Artifacts and summaries:

• output/playwright/ci-parallel-report/index.html
• output/playwright/ci-parallel-chromium/report/index.html
• output/playwright/ci-parallel-firefox/report/index.html
• output/playwright/ci-parallel-webkit/report/index.html
• output/playwright/test-lists/<project>-<role>.txt
• output/playwright/test-lists/<role>-<project>.txt (legacy compatibility copy)

Bubblewrap (TWA) Build and Install

To build and install the Trusted Web Activity (TWA) using Bubblewrap, use the following commands:

Build the TWA

bubblewrap build

Install the TWA on a connected device

bubblewrap install