The new 'shows QR code for desktop scanning' E2E test used plate JKL012,
which is the same plate seeded as a processing order in the dev migrations
(V7__seed_processing_order.sql) and used by the admin dashboard/fulfillment
tests as PROCESSING_PLATE.
Because the E2E chromium (parallel) tests run before the chromium-serial
tests, the QR test created a second order with plate JKL012. When the serial
admin tests then searched for rows matching JKL012, Playwright's strict
mode found 2 matching rows and threw a strict mode violation.
This caused 4 test failures + 2 skipped tests:
- admin-dashboard: click row shows tracking section
- admin-dashboard: click row again collapses it
- admin-dashboard: expanded row shows tracking input and save button
- admin-fulfillment: can register shipment for processing order
- admin-fulfillment: can mark sent order as delivered (skipped)
- admin-fulfillment: can mark delivered order as failed then back to sent (skipped)
Changed the plate to QRA222 — not used in any seed data or other E2E test.
Replace manual "type the number and order ID" flow with:
- Client-side QR code (qrcode npm package) for desktop users
- Pre-filled Swish payment URL (app.swish.nu) for mobile users
- Manual number fallback + "Jag har betalat" confirmation
The Swish C2B URL scheme pre-fills amount and message (order ID)
without requiring any Swish Commerce API certificate or bank agreement.
Supports both personal phone numbers (070...) and Swish Företag
business numbers (123...) via number normalization in buildSwishPaymentUrl().
Set SWISH_NUMBER in .env to a Företags number once set up.
fix: add preview.allowedHosts and preview.host to vite.config.ts
Vite preview server blocks requests from non-localhost hosts by default.
In the E2E Docker Compose stack, Playwright accesses the frontend via
http://frontend (container hostname). Without allowedHosts, Vite returns
"Blocked request. This host is not allowed." and the SPA never mounts,
causing all 59 E2E tests to fail with blank pages and missing elements.
- Add preview.host: true (bind to 0.0.0.0)
- Add preview.allowedHosts: ['frontend', 'localhost']
test: update payment-redirect E2E tests to match current UI
The payment page was redesigned to a two-step confirmation flow:
"Jag har betalat" → confirmation → "Ja, jag har betalat". The E2E
tests still referenced the old single-step "Genomför testbetalning"
button and a removed .payment__note CSS class.
- Update 'payment button marks order as paid' to click through both steps
- Rename 'shows mock payment note' to 'shows Swish payment instructions'
and assert on actual UI elements (Swish label + payment button)
Result: E2E suite now passes 59/59 tests in the Docker Compose CI stack.
Vitest:
- PaymentRedirect.spec.ts (8 tests): renders heading and 49 kr,
shows plate from query, Betalt button exists, calls payOrder on
click, navigates to /orders on success, shows error on failure,
disables button while paying, shows mock note
- ComposePage.spec.ts: update navigation test to expect /betalning
route with orderId param instead of /orders; add payment route
to test router; add PaymentRedirect import
Playwright E2E:
- payment-redirect.spec.ts (4 tests): compose→payment navigation,
Betalt→orders flow, auth guard redirects to login, mock note
visible
- compose.spec.ts: rename test and update assertion from /orders
to /betalning/ URL pattern; use getByRole('heading',
{ name: 'Betalning' }) to avoid strict mode violation with
mock-note paragraph containing the word 'Betalning'