v7.80.0 breaks tRPC middleware handler (Typescript)

[spaceemotion]

Is there an existing issue for this?

• I have checked for existing issues https://github.com/getsentry/sentry-javascript/issues
• I have reviewed the documentation https://docs.sentry.io/
• I am using the latest SDK release https://github.com/getsentry/sentry-javascript/releases

How do you use Sentry?

Sentry Saas (sentry.io)

Which SDK are you using?

@sentry/node

SDK Version

7.80.0

Framework Version

No response

Link to Sentry event

No response

SDK Setup

The following downgrade of all dependencies worked, the combination of all latest doesnt:

    "@sentry/esbuild-plugin": "^2.10.0",
-   "@sentry/node": "^7.80.0",
-   "@sentry/serverless": "^7.80.0",
+   "@sentry/node": "^7.79.0",
+   "@sentry/serverless": "^7.79.0",
-   "@trpc/server": "^10.43.3",
+   "@trpc/server": "^10.43.2",

Here is my trpc setup:

import { Handlers } from '@sentry/node';
import { TRPCError, initTRPC } from '@trpc/server';
import superjson from 'superjson';

import { type Context } from './context';

export const t = initTRPC
  .context<Context>()
  .create({
    transformer: superjson,
  });

export const middleware = t.middleware;
export const router = t.router;

const sentryMiddleware = middleware(
  // 1.
  Handlers.trpcMiddleware({
    attachRpcInput: false,
  }),
);

const isAuthenticated = middleware(({ next, ctx }) => {
  if (ctx.user === null) {
    throw new TRPCError({
      code: 'UNAUTHORIZED',
      message: 'Unauthorized',
    });
  }

  return next({
    ctx: {
      ...ctx,
      user: ctx.user,
    },
  });
});

export const publicProcedure = t.procedure.use(sentryMiddleware);
export const protectedProcedure = t.procedure.use(sentryMiddleware).use(isAuthenticated); // 2.

Depending on which combination of versions i tried, no. 1 had a type error (the middleware is now async), or no. 2 had the wrong context. Swapping the Auth middleware with Sentry had a similar result (type errors)

Steps to Reproduce

1. Create a tRPC server with latest sentry integration
2. Try to compile with typescript

Expected Result

No Type errors, project compiles

Actual Result

Error: ../server/src/trpc.ts(17,3): error TS[23](https://github.com/spaceemotion/novelcrafter/actions/runs/6843475593/job/18606103847#step:11:24)45: Argument of type '<T>({ path, type, next, rawInput }: TrpcMiddlewareArguments<T>) => Promise<T>' is not assignable to parameter of type 'MiddlewareFunction<{ _config: RootConfig<{ ctx: { user: { id: string; } | null; req: FastifyRequest<RouteGenericInterface, RawServerDefault, IncomingMessage, FastifySchema, FastifyTypeProviderDefault, unknown, FastifyBaseLogger, ResolveFastifyRequestType<...>>; res: FastifyReply<...>; }; meta: object; errorShape: De...'.
  Type 'Promise<Promise<MiddlewareResult<{ _config: RootConfig<{ ctx: { user: { id: string; } | null; req: FastifyRequest<RouteGenericInterface, RawServerDefault, IncomingMessage, ... 4 more ..., ResolveFastifyRequestType<...>>; res: FastifyReply<...>; }; meta: object; errorShape: DefaultErrorShape; transformer: typeof Supe...' is not assignable to type 'Promise<MiddlewareResult<ProcedureParams<AnyRootConfig, unknown, unknown, unknown, unknown, unknown, unknown>>>'.
    Type 'Promise<MiddlewareResult<{ _config: RootConfig<{ ctx: { user: { id: string; } | null; req: FastifyRequest<RouteGenericInterface, RawServerDefault, IncomingMessage, ... 4 more ..., ResolveFastifyRequestType<...>>; res: FastifyReply<...>; }; meta: object; errorShape: DefaultErrorShape; transformer: typeof SuperJSON; }...' is not assignable to type 'MiddlewareResult<ProcedureParams<AnyRootConfig, unknown, unknown, unknown, unknown, unknown, unknown>>'.
Error: ../server/src/trpc.ts(39,73): error TS2345: Argument of type 'MiddlewareBuilder<{ _config: RootConfig<{ ctx: { user: { id: string; } | null; req: FastifyRequest<RouteGenericInterface, RawServerDefault, IncomingMessage, FastifySchema, FastifyTypeProviderDefault, unknown, FastifyBaseLogger, ResolveFastifyRequestType<...>>; res: FastifyReply<...>; }; meta: object; errorShape: Def...' is not assignable to parameter of type 'MiddlewareBuilder<{ _config: RootConfig<{ ctx: { user: { id: string; } | null; req: FastifyRequest<RouteGenericInterface, RawServerDefault, IncomingMessage, ... 4 more ..., ResolveFastifyRequestType<...>>; res: FastifyReply<...>; }; meta: object; errorShape: DefaultErrorShape; transformer: typeof SuperJSON; }>; ... ...'.
  Type 'import("/home/runner/work/novelcrafter/novelcrafter/application/node_modules/.pnpm/@trpc+server@10.43.3/node_modules/@trpc/server/dist/core/middleware").MiddlewareBuilder<{ _config: import("/home/runner/work/novelcrafter/novelcrafter/application/node_modules/.pnpm/@trpc+server@10.43.3/node_modules/@trpc/server/dist/...' is not assignable to type 'import("/home/runner/work/novelcrafter/novelcrafter/application/node_modules/.pnpm/@trpc+server@10.43.3/node_modules/@trpc/server/dist/core/middleware").MiddlewareBuilder<{ _config: import("/home/runner/work/novelcrafter/novelcrafter/application/node_modules/.pnpm/@trpc+server@10.43.3/node_modules/@trpc/server/dist/...'. Two different types with this name exist, but they are unrelated.
    The types of 'unstable_pipe(...)._middlewares' are incompatible between these types.
      Type 'import("/home/runner/work/novelcrafter/novelcrafter/application/node_modules/.pnpm/@trpc+server@10.43.3/node_modules/@trpc/server/dist/core/middleware").MiddlewareFunction<{ _config: import("/home/runner/work/novelcrafter/novelcrafter/application/node_modules/.pnpm/@trpc+server@10.43.3/node_modules/@trpc/server/dist...' is not assignable to type 'import("/home/runner/work/novelcrafter/novelcrafter/application/node_modules/.pnpm/@trpc+server@10.43.3/node_modules/@trpc/server/dist/core/middleware").MiddlewareFunction<{ _config: import("/home/runner/work/novelcrafter/novelcrafter/application/node_modules/.pnpm/@trpc+server@10.43.3/node_modules/@trpc/server/dist...'. Two different types with this name exist, but they are unrelated.
        Type 'import("/home/runner/work/novelcrafter/novelcrafter/application/node_modules/.pnpm/@trpc+server@10.43.3/node_modules/@trpc/server/dist/core/middleware").MiddlewareFunction<{ _config: import("/home/runner/work/novelcrafter/novelcrafter/application/node_modules/.pnpm/@trpc+server@10.43.3/node_modules/@trpc/server/dist...' is not assignable to type 'import("/home/runner/work/novelcrafter/novelcrafter/application/node_modules/.pnpm/@trpc+server@10.43.3/node_modules/@trpc/server/dist/core/middleware").MiddlewareFunction<{ _config: import("/home/runner/work/novelcrafter/novelcrafter/application/node_modules/.pnpm/@trpc+server@10.43.3/node_modules/@trpc/server/dist...'. Two different types with this name exist, but they are unrelated.
          Types of parameters 'opts' and 'opts' are incompatible.
            Type '{ ctx: {}; type: "query" | "mutation" | "subscription"; path: string; input: unique symbol; rawInput: unknown; meta: object | undefined; next: { (): Promise<MiddlewareResult<{ _config: RootConfig<{ ctx: { user: { id: string; } | null; req: FastifyRequest<...>; res: FastifyReply<...>; }; meta: object; errorShape: Def...' is not assignable to type '{ ctx: { user: { id: string; } | null; req: FastifyRequest<RouteGenericInterface, RawServerDefault, IncomingMessage, FastifySchema, FastifyTypeProviderDefault, unknown, FastifyBaseLogger, ResolveFastifyRequestType<...>>; res: FastifyReply<...>; }; ... 5 more ...; next: { ...; }; }'.
              Types of property 'ctx' are incompatible.
                Type '{}' is missing the following properties from type '{ user: { id: string; } | null; req: FastifyRequest<RouteGenericInterface, RawServerDefault, IncomingMessage, FastifySchema, FastifyTypeProviderDefault, unknown, FastifyBaseLogger, ResolveFastifyRequestType<...>>; res: FastifyReply<...>; }': user, req, res

[lforst]

Hi, I messed this up and we will fix this. In the meanwhile you should just be able to cast to any and everything should work as expected:

const sentryMiddleware = middleware(
  // 1.
  Handlers.trpcMiddleware({
    attachRpcInput: false,
-  }),
+  }) as any,
);

[GuilhermeCunha]

Hey @lforst ! I updated @sentry/node and @sentry/nextjs to 7.80.1 and tried your workaround, but i'm still receiving the same error.

const sentryMiddleware = t.middleware(
  Sentry.Handlers.trpcMiddleware({
    attachRpcInput: true,
  }) as any
);

export const publicProcedure = t.procedure
  .use(sentryMiddleware)
  .use(rateLimitMiddleware);

yarn list @sentry/*
yarn list v1.22.19
warning Filtering by arguments is deprecated. Please use the pattern option instead.
├─ @sentry/browser@7.80.1
├─ @sentry/cli@1.76.0
├─ @sentry/core@7.80.1
├─ @sentry/integrations@7.80.1
├─ @sentry/nextjs@7.80.1
├─ @sentry/node@7.80.1
├─ @sentry/react@7.80.1
├─ @sentry/replay@7.80.1
├─ @sentry/types@7.80.1
├─ @sentry/utils@7.80.1
├─ @sentry/vercel-edge@7.80.1
└─ @sentry/webpack-plugin@1.20.0
Done in 4.03s.

[GuilhermeCunha]

I'm still testing, but i think that this workaround is working:

const sentryMiddleware = t.middleware(async (opts) => {
  const middleware = Sentry.Handlers.trpcMiddleware({
    attachRpcInput: true,
  });

  return middleware(opts);
});

[lforst]

@GuilhermeCunha Weird, the issue is fixed for my project. Would you mind creating a small reproduction example so that we can debug this more effectively? Thanks!

[GuilhermeCunha]

Do we have one codesandbox template do to this, or should I create one repository from the ground?

[lforst]

@GuilhermeCunha please create a new one. Thank you!

[jussisaurio]

Hey, this is most probably a regression in the most recent patch version of tRPC.

trpc/trpc#5037
trpc/trpc#5039

[lforst]

I believe this should be fixed by upgrading trpc! Let me know if you still face issues.