Introduce Apollo v4 support & Drop Apollo v2/v3 and Node 16 support

Author: ardatan

.changeset/dull-camels-grow.md

@@ -0,0 +1,5 @@
+---
+'graphql-modules': minor
+---
+
+Introduce `createApolloGateway` for Apollo Server v4

.changeset/heavy-owls-look.md

@@ -0,0 +1,17 @@
+---
+'graphql-modules': major
+---
+
+Drop Node 16 and Apollo v2 and v3 support
+
+`createApolloExecutor` and `createSchemaForApollo` have been removed in favor of `createApolloGateway`.
+
+You can create `gateway` instance for Apollo Server v4 like this, and pass it directly to `ApolloServer` constructor. You don't need to pass `schema` or `executor` anymore.
+
+```ts
+const gateway = application.createApolloGateway()
+
+const apolloServer = new ApolloServer({
+  gateway
+})
+```

.github/workflows/tests.yml

@@ -39,7 +39,7 @@ jobs:
     strategy:
       matrix:
         os: [ubuntu-latest] # remove windows to speed up the tests
-        node-version: [12, 16, 18]
+        node-version: [18, 20]
         graphql_version:
           - 15
           - 16
@@ -49,7 +49,7 @@ jobs:
       - name: Setup env
         uses: the-guild-org/shared-config/setup@main
         with:
-          nodeVersion: 18
+          nodeVersion: 20
       - name: Use GraphQL v${{matrix.graphql_version}}
         run: node ./scripts/match-graphql.js ${{matrix.graphql_version}}
       - name: Cache Jest

benchmark/basic.case.ts

@@ -96,30 +96,36 @@ let showedError = false;
 
 const executeAppWithDI = appWithDI.createExecution();
 const executeApp = app.createExecution();
-const apolloWithDIExecutor = appWithDI.createApolloExecutor();
+const apolloGWWithDI = appWithDI.createApolloGateway();
+const apolloGWWithDILoadResult$ = apolloGWWithDI.load();
 const executeApolloWithDI = (args: ExecutionArgs) => {
-  return apolloWithDIExecutor({
-    schema: args.schema,
-    document: args.document,
-    operationName: args.operationName,
-    context: args.contextValue,
-    request: {
-      variables: args.variableValues,
-    },
-  });
+  return apolloGWWithDILoadResult$.then(({ executor }) =>
+    executor({
+      schema: args.schema,
+      document: args.document,
+      operationName: args.operationName,
+      context: args.contextValue,
+      request: {
+        variables: args.variableValues,
+      },
+    })
+  );
 };
 
-const apolloExecutor = app.createApolloExecutor();
+const apolloGW = app.createApolloGateway();
+const apolloGWLoadResult$ = apolloGW.load();
 const executeApollo = (args: ExecutionArgs) => {
-  return apolloExecutor({
-    schema: args.schema,
-    document: args.document,
-    operationName: args.operationName,
-    context: args.contextValue,
-    request: {
-      variables: args.variableValues,
-    },
-  });
+  return apolloGWLoadResult$.then(({ executor }) =>
+    executor({
+      schema: args.schema,
+      document: args.document,
+      operationName: args.operationName,
+      context: args.contextValue,
+      request: {
+        variables: args.variableValues,
+      },
+    })
+  );
 };
 
 const query = parse(/* GraphQL */ `
@@ -162,11 +168,11 @@ const suites: Record<string, { name: string; runner: Function }> = {
   },
   'apollo-with-id': {
     name: 'ApolloServer (DI)',
-    runner: () => graphql(appWithDI.schema, executeApolloWithDI as any),
+    runner: () => graphql(appWithDI.schema, executeApolloWithDI),
   },
   apollo: {
     name: 'ApolloServer',
-    runner: () => graphql(app.schema, executeApollo as any),
+    runner: () => graphql(app.schema, executeApollo),
   },
 };
 

examples/apollo-subscriptions/src/app/index.ts

@@ -4,5 +4,10 @@ import { PostModule } from './post/post.module';
 
 export const graphqlApplication = createApplication({
   modules: [PostModule],
-  providers: [PubSub],
+  providers: [
+    {
+      provide: PubSub,
+      useValue: new PubSub(),
+    },
+  ],
 });

examples/apollo-subscriptions/src/index.ts

@@ -1,24 +1,26 @@
 import 'reflect-metadata';
 import express from 'express';
 import { createServer } from 'http';
-import { ApolloServer } from 'apollo-server-express';
-import { ApolloServerPluginDrainHttpServer } from 'apollo-server-core';
+import { ApolloServer } from '@apollo/server';
+import { expressMiddleware } from '@apollo/server/express4';
+import { ApolloServerPluginDrainHttpServer } from '@apollo/server/plugin/drainHttpServer';
 import { graphqlApplication } from './app';
 import { WebSocketServer } from 'ws';
 import { useServer } from 'graphql-ws/lib/use/ws';
+import bodyParser from 'body-parser';
+import cors from 'cors';
 
-const { schema, createExecution, createSubscription, createApolloExecutor } =
+const { schema, createExecution, createSubscription, createApolloGateway } =
   graphqlApplication;
 
-const executor = createApolloExecutor();
+const gateway = createApolloGateway();
 
 const app = express();
 const httpServer = createServer(app);
 // Creating the WebSocket subscription server
 
 const server = new ApolloServer({
-  schema,
-  executor,
+  gateway,
   plugins: [
     // Proper shutdown for the HTTP server.
     ApolloServerPluginDrainHttpServer({ httpServer }),
@@ -35,11 +37,9 @@ const server = new ApolloServer({
   ],
 });
 
-server.applyMiddleware({ app });
-
 const wsServer = new WebSocketServer({
   server: httpServer,
-  path: server.graphqlPath,
+  path: '/graphql',
 });
 
 const execute = createExecution();
@@ -49,7 +49,24 @@ const subscribe = createSubscription();
 // telling the WebSocketServer to start listening
 const serverCleanup = useServer({ schema, execute, subscribe }, wsServer);
 
-httpServer.listen({ port: 4000 }, () => {
+async function main() {
+  await server.start();
+
+  app.use(
+    '/graphql',
+    cors<cors.CorsRequest>(),
+    bodyParser.json(),
+    expressMiddleware(server)
+  );
+
+  httpServer.listen({ port: 4000 }, () => {
+    // tslint:disable-next-line: no-console
+    console.info(`🚀 Server ready at http://localhost:4000/graphql`);
+  });
+}
+
+main().catch((error) => {
   // tslint:disable-next-line: no-console
-  console.info(`🚀 Server ready at http://localhost:4000${server.graphqlPath}`);
+  console.error(error);
+  process.exit(1);
 });

examples/basic-with-dependency-injection/src/index.ts

@@ -2,26 +2,27 @@ import 'reflect-metadata';
 import { createApplication } from 'graphql-modules';
 import { BlogModule } from './modules/blog';
 import { UserModule } from './modules/user';
-import express from 'express';
-import { graphqlHTTP } from 'express-graphql';
+import http from 'http';
+import { createHandler } from 'graphql-http/lib/use/http';
 
 const app = createApplication({
   modules: [BlogModule, UserModule],
 });
 
-const server = express();
-
-const execute = app.createExecution();
-
-server.use(
-  '/graphql',
-  graphqlHTTP({
-    schema: app.schema,
-    customExecuteFn: execute as any,
-    graphiql: true,
-  })
-);
+// Create the GraphQL over HTTP Node request handler
+const handler = createHandler({
+  schema: app.schema,
+  execute: app.createExecution(),
+});
 
-server.listen(4000, () => {
-  console.log('Live http://localhost:4000/graphql');
+// Create a HTTP server using the listener on `/graphql`
+const server = http.createServer((req, res) => {
+  if (req.url?.startsWith('/graphql')) {
+    handler(req, res);
+  } else {
+    res.writeHead(404).end();
+  }
 });
+
+server.listen(4000);
+console.log('Listening to port 4000');

examples/basic/src/index.ts

@@ -8,28 +8,30 @@ declare global {
 
 import 'reflect-metadata';
 import { createApplication } from 'graphql-modules';
-import express from 'express';
-import { graphqlHTTP } from 'express-graphql';
+import http from 'http';
+import { createHandler } from 'graphql-http/lib/use/http';
 import { UserModule } from './app/user/user.module';
 import { AuthModule } from './app/auth/auth.module';
 import { SocialNetworkModule } from './app/social-network/social-network.module';
 
-const server = express();
 const app = createApplication({
   modules: [UserModule, AuthModule, SocialNetworkModule],
 });
-const execute = app.createExecution();
 
-server.use(
-  '/graphql',
-  graphqlHTTP((request: any) => ({
-    schema: app.schema,
-    graphiql: true,
-    customExecuteFn: execute as any,
-    context: { request },
-  }))
-);
+// Create the GraphQL over HTTP Node request handler
+const handler = createHandler({
+  schema: app.schema,
+  execute: app.createExecution(),
+});
 
-server.listen(4000, () => {
-  console.log('Live http://localhost:4000/graphql');
+// Create a HTTP server using the listener on `/graphql`
+const server = http.createServer((req, res) => {
+  if (req.url?.startsWith('/graphql')) {
+    handler(req, res);
+  } else {
+    res.writeHead(404).end();
+  }
 });
+
+server.listen(4000);
+console.log('Listening to port 4000');

examples/graphql-yoga/src/app/post/pubsub.ts

@@ -1,12 +1,12 @@
 import { InjectionToken, FactoryProvider, Scope } from 'graphql-modules';
-import { createPubSub, PubSub as TPubSub } from '@graphql-yoga/node';
+import { createPubSub, PubSub as TPubSub } from 'graphql-yoga';
 import { Post } from './types';
 
 type PubSub = TPubSub<{
   POST_ADDED: [
     {
       postAdded: Post;
-    }
+    },
   ];
 }>;
 

examples/graphql-yoga/src/index.ts

@@ -1,13 +1,16 @@
 import 'reflect-metadata';
-import { createServer } from '@graphql-yoga/node';
+import { createServer } from 'http';
+import { createYoga } from 'graphql-yoga';
 import { useGraphQLModules } from '@envelop/graphql-modules';
 import { app } from './app';
 
-const server = createServer({
+const yoga = createYoga({
   plugins: [useGraphQLModules(app)],
 });
 
-server.start().then(() => {
+const server = createServer(yoga);
+
+server.listen(4000, () => {
   // tslint:disable-next-line: no-console
   console.info(`🚀 Server ready at http://localhost:4000/graphql`);
 });