Cannot redirect to different app on same domain from loader function

What version of Remix are you using?

1.5.1

Steps to Reproduce

I have a Remix Form that submits a GET request to a UI-route’s loader function, which can either return a JSON object or redirect the user to different places depending on the value of a query parameter.

For instance, these are the 2 only properties that I set on my Remix Form:

<Form method="get" action="/product-A">...</Form>

Let’s say the domain of my application is mywebsite.com, and when the form is submitted the query looks like this: mywebsite.com/product-A?area=11103.

The loader function has 3 possible outcomes:

1. return json(payload) and renders the UI-route. This works ✅
2. redirect user to an external website through redirect('differenwebsite.com'). This works ✅
3. redirect user to mywebsite.com/product-B, which is a route on the same domain that is handled by a separate NextJS application. This doesn’t work, Remix shows a 404 page under mywebsite.com/product-B ❌

In order to make the Form work in every scenario, I’d have to use the reloadDocument property, but that would be detrimental for the “happy path” UX.

Expected Behavior

I’d expect loader functions to be able to redirect to routes that live on the same domain, even though those routes are not part of the Remix application.

I’d expect to do so without resorting to the use of the reloadDocument directive on the Form.

Actual Behavior

Remix shows a 404 error page when a Form submission to a loader function results into a redirection to a route that is handled by a different application on the same domain.

[kiliman]

This code is what’s causing the issue. It checks the redirect URL’s origin and compares it to the current location. If the same, then it simply does a client side transition.

Perhaps, they could support adding a header X-Remix-Force-Redirect: true, that will do window.location.replace() like for external URLs.

let forceRedirect = response.headers.get('X-Remix-Force-Redirect') === 'true'
if (forceRedirect || url.origin !== window.location.origin) {
 ...
}

https://github.com/remix-run/remix/blob/99d98bd85897fcb37f4bd1e22f778d7c4d89198d/packages/remix-react/routes.tsx#L212-L234

[anton-paskanny]

Any progress on this issue?