Fetcher with ?index route has the URL parameter overridden

[huw]

What version of Remix are you using?

1.7.1

Steps to Reproduce

Create a manual Fetcher, perhaps using useFetcher. Then submit it against the index route using a GET request.

const fetcher = useFetcher();
fetcher.submit({ parameter: “true” }, { replace: false, method: “get”, action: “?index” });

(I’m calling this from the index route, so I think you can omit all of these options. But worth being verbose to explain the error.)

Expected Behavior

This code should call the index loader & return its data in fetcher.data

Actual Behavior

fetcher.data is undefined

(this example in the docs is now broken, BTW)

Reason

In #4046, we override the URL parameters for a GET request. Since Fetcher uses this under the hood, the ?index search string gets wiped from the URL. Then when calling getFetcherRequestMatch, match.route.index is no longer true, so it can’t find the index route anymore, so it calls the default fetcher, which silently returns undefined.

(I also happened to be relying on the old behaviour by submitting action: “?index&parameter=true” which broke in the new version, but I didn’t realise you could use the first parameter. Only mentioning in case someone else has the same problem.)

Workaround

You have to downgrade to 1.7.0. I tried:

fetcher.submit({ parameter: “true”, index: “anything” }, options)

But this doesn’t work because it only matches against a bare index parameter, which I can’t pass using this object.

[hyperborea]

Just encountered the same issue, downgrading @remix-run/react to 1.7.0 until this has been fixed.

[brophdawg11]

This was a regression on our part - normal form GET submissions run all loaders and thus don't need the ?index param, but this fetcher.submit({}, { method: 'get' }) case was overlooked. Sorry about that! Fixed in #4238 and should be released soon 👍

[MichaelDeBoey]

Closed by #4238