Type instantiation is excessively deep and possibly infinite.ts(2589) when using readonly

[punkpeye]

Reproduction

https://stackblitz.com/edit/remix-run-remix-msgs25?file=app%2Froutes%2F_index.tsx

System Info

N/A

Used Package Manager

pnpm

Expected Behavior

No type error.

Actual Behavior

Getting error:

Type instantiation is excessively deep and possibly infinite.ts(2589)

[punkpeye]

The only code necessary to replicate is this:

export const loader = defineLoader(async () => {
  type RecentChat = {};

  const recentChats: readonly RecentChat[] = [];

  return {
    recentChats,
  };
});

const Route = () => {
  const data = useLoaderData<typeof loader>();
};

[lilouartz]

@brophdawg11 I am facing the same issue. This is a blocker for adopting turbo-stream. It forces me to continue using json. unstable_data has the same issue.

[lilouartz]

I dug into types. Looks like fixing this is super simple:

- type Serializable = undefined | null | boolean | string | symbol | number | Array<Serializable> | 
+ type Serializable = undefined | null | boolean | string | symbol | number | Array<Serializable> | ReadonlyArray<Serializable> | 
{
    [key: PropertyKey]: Serializable;
} | bigint | Date | URL | RegExp | Error | Map<Serializable, Serializable> | Set<Serializable> | Promise<Serializable>;

[punkpeye]

This fixed the issue!

[lilouartz]

@brophdawg11 @jacob-ebey Can this me merged upstream?

At the moment, I have to patch local node_modules every time I update Remix.

[brophdawg11]

defineLoader is going away in favor of a better type story soon so this will be resolved once that lands

[punkpeye]

defineLoader is going away in favor of a better type story soon so this will be resolved once that lands

That's great news, but apps that currently rely on defineLoader cannot lint properly.

[brophdawg11]

It's an unstable API not intended for production use. // @ts-expect-error is your friend here 😄