Visual testing scenarios #2

	name: Visual Tests

	on:
	push:
	branches: [main]
	pull_request:
	branches: [main]

	jobs:
	visual-tests:
	timeout-minutes: 60
	runs-on: ubuntu-latest

	steps:
	- uses: actions/checkout@v4

	- name: Set up Node.js
	uses: actions/setup-node@v4
	with:
	node-version: "18"
	cache: "npm"

	- name: Install dependencies
	run: npm ci

	- name: Install Playwright browsers
	run: npx playwright install --with-deps

	- name: Build the app
	run: npm run build

	- name: Start the app and run tests
	run: \|
	# Kill any process using port 5173
	lsof -t -i:5173 \| xargs -r kill -9 \|\| true

	# Start the dev server in background
	npm run preview & # Use preview instead of dev for production build
	SERVER_PID=$!

	# Wait for the server to be ready
	npx wait-on http://localhost:5173

	# Run the tests
	npx playwright test

	# Store the test exit code
	TEST_EXIT_CODE=$?

	# Kill the server
	kill $SERVER_PID \|\| true

	# Exit with the test exit code
	exit $TEST_EXIT_CODE
	env:
	CI: true

	- name: Upload test results
	if: always()
	uses: actions/upload-artifact@v4
	with:
	name: playwright-report
	path: playwright-report/
	retention-days: 30

	- name: Upload snapshot diffs
	if: failure()
	uses: actions/upload-artifact@v4
	with:
	name: snapshot-diffs
	path: test-results/
	retention-days: 30

Provide feedback