Fix 4199: TypedResponse allows incompatible types (#4734)

* Fixes #4199: Do not allow assignment of incompatible TypedResponses

* Add myself to contributors.yml

* Create light-sheep-give.md

* slight changeset tweak

* additional changeset tweaks

Co-authored-by: Pedro Cattori <[email protected]>

.changeset/light-sheep-give.md

@@ -0,0 +1,26 @@
+---
+"remix": patch
+"@remix-run/serve": patch
+"@remix-run/server-runtime": patch
+---
+
+Fix `TypedResponse` so that Typescript correctly shows errors for incompatible types in loaders and actions.
+
+Previously, when the return type of a loader or action was explicitly set to `TypedResponse<SomeType>`,
+Typescript would not show errors when the loader or action returned an incompatible type.
+
+For example:
+
+```ts
+export const action = async (args: ActionArgs): Promise<TypedResponse<string>> => {
+    return json(42);
+};
+```
+
+In this case, Typescript would not show an error even though `42` is clearly not a `string`.
+
+This happens because `json` returns a `TypedResponse<string>`,
+but because `TypedReponse<string>` was previously just `Response & { json: () => Promise<string> }`
+and `Response` already defines `{ json: () => Promise<any> }`, type erasure caused `Promise<any>` to be used for `42`.
+
+To fix this, we explicitly omit the `Response`'s `json` property before intersecting with `{ json: () => Promise<T> }`.

contributors.yml

@@ -452,3 +452,4 @@
 - zachdtaylor
 - zainfathoni
 - zhe
+- dabdine

packages/remix-server-runtime/__tests__/responses-test.ts

@@ -44,6 +44,11 @@ describe("json", () => {
     expect(result).toMatchObject({ hello: "remix" });
   });
 
+  it("disallows unmatched typed responses", async () => {
+    let response = json("hello");
+    isEqual<TypedResponse<number>, typeof response>(false);
+  });
+
   it("disallows unserializables", () => {
     // @ts-expect-error
     expect(() => json(124n)).toThrow();

packages/remix-server-runtime/responses.ts

@@ -5,7 +5,7 @@ export type JsonFunction = <Data extends unknown>(
 
 // must be a type since this is a subtype of response
 // interfaces must conform to the types they extend
-export type TypedResponse<T extends unknown = unknown> = Response & {
+export type TypedResponse<T extends unknown = unknown> = Omit<Response, 'json'> & {
   json(): Promise<T>;
 };