Skip to content

feat: upgrade Tailwind CSS v3 to v4 and add Playwright e2e tests#59

Merged
1kevgriff merged 1 commit intomainfrom
feat/tailwind-v4-playwright
Feb 13, 2026
Merged

feat: upgrade Tailwind CSS v3 to v4 and add Playwright e2e tests#59
1kevgriff merged 1 commit intomainfrom
feat/tailwind-v4-playwright

Conversation

@1kevgriff
Copy link
Member

Summary

  • Tailwind v4 migration: Replaces @astrojs/tailwind integration with @tailwindcss/vite plugin, creates src/styles/global.css entry point imported in all pages, and removes tailwind.config.mjs (v4 auto-detects content)
  • Playwright e2e tests: 28 tests across 3 spec files covering homepage, site navigation, and responsive layout against production baseline (hrdevfest.org)
  • CI workflow: GitHub Actions runs Playwright on PRs to main with report artifacts

Supersedes #32 (Renovate's Tailwind bump) by including the full migration changes needed for v4 compatibility.

Changes

File Change
package.json Remove @astrojs/tailwind, add @tailwindcss/vite + @playwright/test, bump tailwindcss to v4
astro.config.mjs Replace Tailwind integration with Vite plugin
tailwind.config.mjs Deleted (v4 auto-detects)
src/styles/global.css New CSS entry point with @import "tailwindcss"
src/pages/*.astro Add global.css import to all 6 pages
playwright.config.ts Chromium desktop + mobile, BASE_URL env override
e2e/*.spec.ts Homepage, navigation, responsive tests
.github/workflows/playwright.yml CI workflow for PR checks

Test plan

  • yarn build passes (0 errors, TypeScript check + Astro build)
  • All 28 Playwright tests pass against production (desktop + mobile Chromium)
  • Visual check: yarn dev renders pages correctly with Tailwind v4
  • CI workflow runs on this PR

For staging preview tests, set BASE_URL env var to the Azure SWA preview URL.

🤖 Generated with Claude Code

Replace @astrojs/tailwind integration with @tailwindcss/vite plugin,
create CSS entry point, and delete tailwind.config.mjs for Tailwind v4
compatibility. Add Playwright e2e test suite (28 tests) covering
homepage, navigation, and responsive layout against production baseline.

Closes #32

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@github-actions
Copy link

Azure Static Web Apps: Your stage site is ready! Visit it here: https://orange-water-00a09360f-59.eastus2.4.azurestaticapps.net

@1kevgriff 1kevgriff merged commit c5da0bc into main Feb 13, 2026
3 checks passed
@1kevgriff 1kevgriff deleted the feat/tailwind-v4-playwright branch February 13, 2026 15:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant