Elven Posts

Elven

•Created by Elven on 4/21/2024 in #❓-help

Error with v11 when using batching

I'm using the lastest version of v11. When I use the batch link I get an trpc inernal error when batched request are received. I'm using HonoJS, bun and v11. Stack trace:

TRPCError: Body already used
code: "PARSE_ERROR"
at new TRPCError (/usr/src/app/node_modules/@trpc/server/dist/unstable-core-do-not-import/error/TRPCError.mjs:51:9)
at /usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/content-type/json/index.mjs:28:27
16 | if (!input) {
17 | return undefined;
18 | }
19 | return JSON.parse(input);
20 | }
21 | const body = opts.req.headers.get('content-type')?.startsWith('application/json') ? await opts.req.text() : '';
^
error: Body already used
at /usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/content-type/json/index.mjs:21:111
at getRawProcedureInputOrThrow (/usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/content-type/json/index.mjs:11:58)
at /usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/content-type/json/index.mjs:37:36
at getInputs (/usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/content-type/json/index.mjs:10:27)
at /usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/fetchRequestHandler.mjs:104:26
at getInput (/usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/fetchRequestHandler.mjs:103:25)
at /usr/src/app/node_modules/@trpc/server/dist/unstable-core-do-not-import/http/resolveHTTPResponse.mjs:113:45
at getRawInputForBatch (/usr/src/app/node_modules/@trpc/server/dist/unstable-core-do-not-import/http/resolveHTTPResponse.mjs:111:44)
at /usr/src/app/node_modules/@trpc/server/dist/unstable-core-do-not-import/http/resolveHTTPResponse.mjs:136:30

TRPCError: Body already used
code: "PARSE_ERROR"
at new TRPCError (/usr/src/app/node_modules/@trpc/server/dist/unstable-core-do-not-import/error/TRPCError.mjs:51:9)
at /usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/content-type/json/index.mjs:28:27
16 | if (!input) {
17 | return undefined;
18 | }
19 | return JSON.parse(input);
20 | }
21 | const body = opts.req.headers.get('content-type')?.startsWith('application/json') ? await opts.req.text() : '';
^
error: Body already used
at /usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/content-type/json/index.mjs:21:111
at getRawProcedureInputOrThrow (/usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/content-type/json/index.mjs:11:58)
at /usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/content-type/json/index.mjs:37:36
at getInputs (/usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/content-type/json/index.mjs:10:27)
at /usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/fetchRequestHandler.mjs:104:26
at getInput (/usr/src/app/node_modules/@trpc/server/dist/adapters/fetch/fetchRequestHandler.mjs:103:25)
at /usr/src/app/node_modules/@trpc/server/dist/unstable-core-do-not-import/http/resolveHTTPResponse.mjs:113:45
at getRawInputForBatch (/usr/src/app/node_modules/@trpc/server/dist/unstable-core-do-not-import/http/resolveHTTPResponse.mjs:111:44)
at /usr/src/app/node_modules/@trpc/server/dist/unstable-core-do-not-import/http/resolveHTTPResponse.mjs:136:30

For now i disabled it. Is there a better long term solution?

9 replies

TtRPC

•Created by Elven on 4/16/2024 in #❓-help

Typescript type error with latest version

I'm initialising a project with trpc v11 and I'm trying to strictly follow the documentation for react-query. I face a problem: everything works fine at runtime but in vscode I have 2 typescript errors: 1/ My hello procedure get this type error on useQuery : Property 'useQuery' does not exist on type 'never'.ts(2339) on this line const q = trpc.hello.useQuery("thing"); in my component. 2/ In the AppRouter in the frontend on this line:

export const trpc = createTRPCReact<AppRouter>();

export const trpc = createTRPCReact<AppRouter>();

Truncated error (full: https://pastebin.com/ZDD5nsy3):

Type 'CreateRouterInner<RootConfig<{ ctx: object; meta: object; errorShape: DefaultErrorShape; transformer: DefaultDataTransformer; }>, { hello: BuildProcedure<...>; }>' does not satisfy the constraint 'Router<any, any>'.
  The types of '_def._config.errorFormatter' are incompatible between these types.
    Type 'ErrorFormatter<object, TRPCErrorShape<number, Record<string, unknown>> & { [key: string]: any; }>' is not assignable to type 'ErrorFormatter<any, any>'.
        Type '{ error: TRPCError; type: "query" | "mutation" | "subscription" | "unknown"; path: string | undefined; input: unknown; ctx: any; shape: DefaultErrorShape; }' is not assignable to type '{ error: TRPCError; type: "query" | "mutation" | "subscription" | "unknown"; path: string | undefined; input: unknown; ctx: object | undefined; shape: DefaultErrorShape; }'.
          The types of 'error.code' are incompatible between these types.
            Type '"INTERNAL_SERVER_ERROR" | ... few more ... | "UNSUPPORTED_MEDIA_TYPE"' is not assignable to type '"INTERNAL_SERVER_ERROR" | "PARSE_ERROR" | ... few more ... | "CLIENT_CLOSED_REQUEST"'.
              Type '"UNSUPPORTED_MEDIA_TYPE"' is not assignable to type '"INTERNAL_SERVER_ERROR" | "PARSE_ERROR" | ... few more ... | "CLIENT_CLOSED_REQUEST"'.ts(2344)

Type 'CreateRouterInner<RootConfig<{ ctx: object; meta: object; errorShape: DefaultErrorShape; transformer: DefaultDataTransformer; }>, { hello: BuildProcedure<...>; }>' does not satisfy the constraint 'Router<any, any>'.
  The types of '_def._config.errorFormatter' are incompatible between these types.
    Type 'ErrorFormatter<object, TRPCErrorShape<number, Record<string, unknown>> & { [key: string]: any; }>' is not assignable to type 'ErrorFormatter<any, any>'.
        Type '{ error: TRPCError; type: "query" | "mutation" | "subscription" | "unknown"; path: string | undefined; input: unknown; ctx: any; shape: DefaultErrorShape; }' is not assignable to type '{ error: TRPCError; type: "query" | "mutation" | "subscription" | "unknown"; path: string | undefined; input: unknown; ctx: object | undefined; shape: DefaultErrorShape; }'.
          The types of 'error.code' are incompatible between these types.
            Type '"INTERNAL_SERVER_ERROR" | ... few more ... | "UNSUPPORTED_MEDIA_TYPE"' is not assignable to type '"INTERNAL_SERVER_ERROR" | "PARSE_ERROR" | ... few more ... | "CLIENT_CLOSED_REQUEST"'.
              Type '"UNSUPPORTED_MEDIA_TYPE"' is not assignable to type '"INTERNAL_SERVER_ERROR" | "PARSE_ERROR" | ... few more ... | "CLIENT_CLOSED_REQUEST"'.ts(2344)

Context: I'm using react + vite + react query + bun. package.json of frontend & backend are matching to 11.0.0-rc.340

3 replies