Loader and Action params encoding / decoding is faulty

[KingSora]

Reproduction

Example: https://stackblitz.com/edit/github-xk9p5y-9ttpl5?file=app%2Froutes%2Findex.tsx

I'm having a loader which receives one parameter called param. This loader is called via a fetcher like:

load(
  `/services/loader/${encodeURIComponent(
    JSON.stringify({ test: 'öpsdgd=$%&!%"&___...Ä+~~' })
  )}`
);

The loader itself returns the params without making any modifications to it:

export const loader = async ({ request, params }: LoaderArgs) => {
  return json(params);
};

Now I would expect that the param field from the loader data is either the string I've passed (the result of whatever encodeURIComponent(JSON.stringify({ test: 'öpsdgd=$%&!%"&___...Ä+~~' })) returns OR a version of that string which has been already decoded with decodeURIComponent.

Instead I'm getting a malformed result which can't be put into the decodeURIComponent because its not a valid URI.

System Info

Shouldn't matter

Used Package Manager

npm

Expected Behavior

A predicatble behavior of the params field in the loader

Actual Behavior

The params field does some kind of transformation with the params which is unexpected.

[brophdawg11]

Duplicate of remix-run/react-router#10814