Fix Safari 404 on donate button by using canonical URL#981
Merged
Conversation
The donate nav item was linking to /{slug} (e.g. /donate), relying on a
server-side redirect to the canonical nested URL (e.g. /support/donate).
Safari mishandles this redirect due to a duplicate Location header bug in
Next.js (vercel/next.js#82117), producing a mangled URL like
/support/donate,%20/support/donate.
Resolve the canonical URL at nav-build time by looking up the page in the
already-built navigation tree, avoiding the redirect entirely.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Contributor
|
Preview deployment: https://canonical-url-for-donate-button.preview.avy-fx.org |
Collaborator
Author
|
We may also want to set this in our next config: vercel/next.js#82117 (comment) |
rchlfryn
reviewed
Mar 7, 2026
Collaborator
rchlfryn
left a comment
rchlfryn
left a comment
There was a problem hiding this comment.
LG - did you test the preview link on Safari?
Also I don't see why we wouldn't include the workaround in our next config.
Collaborator
Author
I added the redirect logic (which was definitely still necessary! I had just been focused on making sure we were using the navigation-nested (canonical) url for internal links for the donate button) and recorded a demo (see the PR description). Ready for re-review. |
rchlfryn
approved these changes
Mar 8, 2026
Contributor
|
🚀 This is included in version v1.11.0 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Fixes a Safari-only bug where clicking the donate button results in a 404. The donate nav item was linking to
/{slug}(e.g.,/donate), relying on a server-sideredirect()to the canonical nested URL (/support/donate). Safari mishandles this redirect — likely due to a duplicateLocationheader bug in Next.js (vercel/next.js#82117) — producing a mangled URL like/support/donate,%20/support/donate.The fix resolves the canonical URL at nav-build time by looking up the donate page in the already-built navigation tree using
findNavigationItemBySlug, avoiding the redirect entirely.Related Issues
Fixes #746
Related upstream issues:
Key Changes
src/components/Header/utils.ts: After building the donateNavLink, if it's an internal page link, look up the page's slug in the already-builttopLevelNavItemsto get the canonical (navigation-nested) URL. This means the donate button links directly to e.g./support/donateinstead of/donate, bypassing the problematic redirect.How to test
/support/donate) rather than the bare slug (/donate)Screenshots / Demo video
Demo: https://www.loom.com/share/3acc89bf68a9405480312972784bfe4d
Migration Explanation
No migration needed — this is a runtime behavior change only.
Future enhancements / Questions
/{slug}→/{parent}/{slug}still exists for direct URL visits and should continue working. If the Next.js duplicateLocationheader bug is confirmed fixed in a future version, the redirect path will also be safe for Safari.