Bun + Typescript type mismatch: Argument of type 'YogaServerInstance<{}, {}>' is not assignable to parameter of type 'Serve<unknown>'

[d6u]

Describe the bug

I'm following the instruction to create a minimum GraphQL server locally https://the-guild.dev/graphql/yoga-server/docs/integrations/integration-with-bun

import { createSchema, createYoga } from "graphql-yoga";

const yoga = createYoga({
  schema: createSchema<{}>({
    typeDefs: /* GraphQL */ `
      type Query {
        greetings: String
      }
    `,
    resolvers: {
      Query: {
        greetings: () => "Hello from Yoga in a Bun app!",
      },
    },
  }),
});

const server = Bun.serve(yoga);

console.info(
  `Server is running on ${new URL(
    yoga.graphqlEndpoint,
    `http://${server.hostname}:${server.port}`
  )}`
);

It runs successfully and I can see graphiql UI at http://localhost:3000/graphql

However, I'm encountering this type error when performing typescript type checking:

index.ts:18:26 - error TS2345: Argument of type 'YogaServerInstance<{}, {}>' is not assignable to parameter of type 'Serve<unknown>'.
  Type 'YogaServerInstance<{}, {}>' is not assignable to type 'UnixTLSWebSocketServeOptions<unknown>'.

18 const server = Bun.serve(yoga);
                            ~~~~


Found 1 error in index.ts:18

Your Example Website or App

https://the-guild.dev/graphql/yoga-server/docs/integrations/integration-with-bun

Steps to Reproduce the Bug or Issue

1. Install Bun by following https://bun.sh/docs/installation
2. Create a new directory and bun init
3. bun add graphql-yoga graphql typescript
4. Copy the example code from https://the-guild.dev/graphql/yoga-server/docs/integrations/integration-with-bun to index.ts
5. bun run index.ts should work just fine
6. tsc will show the error.

Expected behavior

I expect there is no TS errors.

Screenshots or Videos

No response

Platform

• macOS
• Bun 1.0.2
• graphql-yoga 4.0.4, typescript 5.2.2

Additional context

Thanks!

[EmrysMyrddin]

It seems the types has changed on 1.0.0 release. A workaround is to give an option object to Bun.serve instead of the yoga instance directly. This also allows you to give other options like development or tls if this is something you need.

Bun.serve({
  fetch: yoga
})

[EmrysMyrddin]

This seems to be fixed now

[DuckThom]

I just ran into an issue similar to this one after updating some packages to the latest (stable) versions

src/index.ts:121:13 - error TS2322: Type 'YogaServerInstance<{}, GlobalContext>' is not assignable to type '((this: Server, request: Request, server: Server) => Response | Promise<Response>) | ((this: Server, request: Request, server: Server) => Response | Promise<...>) | ((this: Server, request: Request, server: Server) => void | ... 2 more ... | undefined) | ((this: Server, request: Request, server: Server) => Response ...'.
  Type 'YogaServerInstance<{}, GlobalContext>' is not assignable to type '(this: Server, request: Request, server: Server) => Response | Promise<Response>'.
    Types of parameters 'res' and 'server' are incompatible.
      Type 'Server' is not assignable to type 'NodeResponse'.

121             fetch: yoga,
                ~~~~~

  node_modules/bun-types/bun.d.ts:2425:3
    2425   fetch(
           ~~~~~~
    2426    this: Server,
         ~~~~~~~~~~~~~~~~
     ... 
    2428    server: Server,
         ~~~~~~~~~~~~~~~~~~
    2429   ): Response | Promise<Response>;
         ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    The expected type comes from property 'fetch' which is declared here on type 'Serve<unknown>'

Changing the following resolved this error for me:

         const server = Bun.serve({
             port: config.server.port,
             hostname: config.server.hostname,
-            fetch: yoga,
+            fetch: (request) => yoga(request),
         })

[mdugue]

thanks @DuckThom , same issue here. Could be fixed with you change! I will add a comment to https://the-guild.dev/graphql/yoga-server/docs/integrations/integration-with-bun