Skip to content

Conversation

@MaxGhenis
Copy link
Contributor

@MaxGhenis MaxGhenis commented Nov 25, 2025

Summary

Add tests that validate app/vercel.json is correctly configured for SPA routing.

What broke and why

When implementing social preview support (OG tags), I added a root vercel.json to configure API functions. This broke the entire site with 404 errors on all routes because:

  1. Root vercel.json overrides app/vercel.json - Vercel uses the config file closest to the project root, so my new root config took precedence over the working app/vercel.json

  2. Wrong routing config - I tried various approaches (rewrites, routes with handle: filesystem) but none worked correctly because:

    • The original working config used { "source": "/(.*)", "destination": "/" } in app/vercel.json
    • My root config used different patterns and paths that didn't match the outputDirectory setup
  3. SPA routing requires specific config - For React Router to handle client-side routes, all requests must be rewritten to serve index.html. Without this, direct URL access (e.g., refreshing /uk/research/some-article) returns 404 because Vercel looks for a literal file at that path.

Timeline of the incident

Commit/PR Description Impact
1113ee30 Added root vercel.json to enable API functions 🔴 Broke all routes with 404
0db14439 Attempted fix: changed rewrite to serve index.html 🔴 Still broken
#437 Attempted fix: switched to routes with filesystem handler 🔴 Still broken
#438 Fix: Removed root vercel.json, restored app/vercel.json ✅ Site working

What these tests catch

These tests would have immediately failed when the root vercel.json was added:

✗ given root vercel.json then does NOT exist (app/vercel.json is canonical)

And would have caught incorrect rewrite configurations:

✗ given vercel.json rewrites then has SPA fallback rule
  Expected: { source: "/(.*)", destination: "/" }

Tests added

  1. Verifies app/vercel.json exists
  2. Verifies it contains valid JSON
  3. Verifies it has rewrites array
  4. Verifies it has the SPA fallback rule { source: "/(.*)", destination: "/" }
  5. Verifies no routes array (which breaks SPA routing when combined with rewrites)
  6. Verifies no root vercel.json exists (which caused 404 errors)

Test plan

  • Tests pass locally
  • CI passes

🤖 Generated with Claude Code

Add tests that validate the Vercel configuration is correct for SPA routing:
- Verifies app/vercel.json exists and contains valid JSON
- Ensures rewrites array has the SPA fallback rule (/(.*) -> /)
- Confirms no routes array (which breaks SPA routing)
- Confirms no root vercel.json (which caused 404 errors)

These tests prevent future regressions where vercel.json changes
could break client-side routing.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>
@vercel
Copy link

vercel bot commented Nov 25, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Preview Comments Updated (UTC)
policyengine-app-v2 Ready Ready Preview Comment Nov 25, 2025 11:14am

@anth-volk
Copy link
Collaborator

Will review today

Copy link
Collaborator

@anth-volk anth-volk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Approved. Going to break the code freeze rule, since this PR is tests only.

@anth-volk anth-volk merged commit 2a02cf6 into main Nov 25, 2025
6 checks passed
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.

3 participants