fix(react-router): add crossOrigin prop to Links component

[joseph0926]

Description

When using a CDN with CORS headers, CSS files loaded via the <Links> component can fail due to browser cache behavior.

After #14463, React Router appends # suffix to CSS hrefs for dynamic imports. This causes Vite to make a separate request (since URLs differ), but both requests share the browser cache. If React Router's <link> lacks crossOrigin while Vite's has crossOrigin="anonymous", the cached response (without CORS headers) fails Vite's CORS check.

Changes

• Add crossOrigin prop to LinksProps interface
• Pass crossOrigin to <link> elements in Links component
• Add tests for crossOrigin behavior

Impact

• Probably no compatibility issues -> Because it was applied selectively via properties

Fixes #14678

[changeset-bot]

🦋 Changeset detected

Latest commit: c6d079d

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 11 packages

Name	Type
react-router	Major
@react-router/architect	Major
@react-router/cloudflare	Major
@react-router/dev	Major
react-router-dom	Major
@react-router/express	Major
@react-router/node	Major
@react-router/serve	Major
@react-router/fs-routes	Major
@react-router/remix-routes-option-adapter	Major
create-react-router	Major

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[markdalgleish]

Thanks for the PR!

[github-actions]

🤖 Hello there,

We just published version 7.13.0-pre.0 which includes this pull request. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

[github-actions]

🤖 Hello there,

We just published version 7.13.0 which includes this pull request. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

[msurdi-a8c]

Hi @joseph0926, @markdalgleish

Shouldn't this fix be also applied here?

We're trying to migrate from Styled Components to CSS modules, and we're facing an issue where dynamically added css links are not including the crossOrigin attribute, and after digging into the source code it looks to me like those dynamically added link elements should also be included in this patch.

Thanks!

[joseph0926]

@msurdi-a8c

I'm not entirely sure, but it does seem like the part you mentioned in your comment is missing. However, it doesn't appear to be just a single instance of prefetchStyleLink being omitted; rather, it seems to be a broader issue where the default cross-origin propagation is missing across all imperative CSS prefetch paths during lazy route/module loading.
Since this doesn’t seem to fall within the scope of this PR, if it’s an issue, you’ll probably need to create a new issue and then file a new PR. That’s just my guess, though—I haven’t reproduced it or tested it separately, so I can’t say for sure...