fix incremental delivery in test graphiql server (#3978)

* fix test graphiql server

* fix

* upd

* cleanup legacy files

* fix one e2e test

* here we gooo

* fix lint and remove unused deps

* try this if netlify works

* try helix in netlify

* log error

* try

* rm graphql dep

* rm graphql dep

* rollback to use graphql-http

Author: dimaMachina

functions/graphql.ts

@@ -3,22 +3,21 @@ import {
   HandlerOptions as RawHandlerOptions,
   OperationContext,
 } from 'graphql-http';
-
 import type {
   Handler as NetlifyHandler,
   HandlerEvent as NetlifyHandlerEvent,
   HandlerContext as NetlifyHandlerContext,
 } from '@netlify/functions';
-
-import { testSchema } from '../packages/graphiql/test/schema.js';
-import { customExecute } from '../packages/graphiql/test/execute.js';
+import * as graphql from 'graphql';
+import { createSchema } from '../packages/graphiql/test/schema.js';
+import { createExecute } from '../packages/graphiql/test/execute.js';
 
 /**
  * Handler options when using the netlify adapter
  *
  * @category Server/@netlify/functions
  */
-export type HandlerOptions<Context extends OperationContext = undefined> =
+type HandlerOptions<Context extends OperationContext = undefined> =
   RawHandlerOptions<NetlifyHandlerEvent, NetlifyHandlerContext, Context>;
 
 /**
@@ -52,12 +51,15 @@ export function createHandler<Context extends OperationContext = undefined>(
         'Internal error occurred during request handling. Please check your implementation.',
         err,
       );
-      return { statusCode: 500 };
+      return {
+        statusCode: 500,
+        body: JSON.stringify({ errors: [{ message: err.message }] }),
+      };
     }
   };
 }
 
 export const handler = createHandler({
-  schema: testSchema,
-  execute: customExecute,
+  schema: createSchema(graphql),
+  execute: createExecute(graphql),
 });

functions/package.json

@@ -0,0 +1,8 @@
+{
+  "name": "netlify-function",
+  "private": true,
+  "dependencies": {
+    "graphql": "^16.11.0",
+    "graphql-http": "^1.22.4"
+  }
+}

jest.config.base.js

@@ -1,11 +1,5 @@
-const path = require('node:path');
-
-module.exports = (dir, env = 'jsdom') => {
+module.exports = dir => {
   const package = require(`${dir}/package.json`);
-  const setupFilesAfterEnv = [];
-  if (env === 'jsdom') {
-    setupFilesAfterEnv.push(path.join(__dirname, '/resources/test.config.js'));
-  }
   return {
     globals: {
       'ts-jest': {
@@ -15,21 +9,14 @@ module.exports = (dir, env = 'jsdom') => {
     clearMocks: true,
     collectCoverage: true,
     coverageDirectory: `${__dirname}/coverage/jest`,
-    setupFilesAfterEnv,
     moduleNameMapper: {
-      '\\.css$': 'identity-obj-proxy',
       '^graphql-language-service-([^/]+)': `${__dirname}/packages/graphql-language-service/src/$1`,
       '^graphql-language-([^/]+)': `${__dirname}/packages/graphql-language-$1/src`,
-      '^@graphiql\\/([^/]+)': `${__dirname}/packages/graphiql-$1/src`,
-      '^codemirror-graphql\\/esm([^]+)\\.js': `${__dirname}/packages/codemirror-graphql/src/$1`,
-      '^codemirror-graphql\\/cjs([^]+)': `${__dirname}/packages/codemirror-graphql/src/$1`,
-      // relies on compilation
-      '^cm6-graphql\\/src\\/([^]+)': `${__dirname}/packages/cm6-graphql/dist/$1`,
       // because of the svelte compiler's export patterns i guess?
       'svelte/compiler': `${__dirname}/node_modules/svelte/compiler.cjs`,
     },
     testMatch: ['**/*[-.](spec|test).[jt]s?(x)', '!**/cypress/**'],
-    testEnvironment: env,
+    testEnvironment: 'node',
     testPathIgnorePatterns: ['node_modules', 'dist', 'cypress'],
     collectCoverageFrom: ['**/src/**/*.{js,jsx,ts,tsx}'],
     transformIgnorePatterns: ['node_modules/(!@astrojs/compiler)'],

package.json

@@ -6,6 +6,8 @@
   "workspaces": {
     "packages": [
       "packages/*",
+      "functions",
+      "packages/graphiql/test",
       "examples/monaco-graphql-webpack",
       "examples/monaco-graphql-nextjs",
       "examples/monaco-graphql-react-vite",
@@ -87,7 +89,6 @@
     "@types/ws": "8.2.2",
     "@typescript-eslint/eslint-plugin": "^8.32.0",
     "@typescript-eslint/parser": "^8.32.0",
-    "babel-jest": "^29.4.3",
     "babel-plugin-macros": "^3.1.0",
     "babel-plugin-transform-import-meta": "^2.2.1",
     "concurrently": "^7.0.0",
@@ -107,8 +108,6 @@
     "eslint-plugin-unicorn": "^56.0.0",
     "execa": "^7.1.1",
     "fetch-mock": "6.5.2",
-    "graphql-http": "^1.22.1",
-    "identity-obj-proxy": "^3.0.0",
     "jest": "^27.5.1",
     "js-green-licenses": "4.0.0",
     "mkdirp": "^1.0.4",

packages/graphiql/cypress/e2e/incremental-delivery.cy.ts

@@ -1,11 +1,10 @@
-// import { version } from 'graphql';
+import { version } from 'graphql';
 
 let describeOrSkip: Mocha.SuiteFunction | Mocha.PendingSuiteFunction = describe;
-// TODO: add support to graphql-http for IncrementalDelivery first
-// if (parseInt(version, 10) < 17) {
 
-describeOrSkip = describe.skip;
-// }
+if (parseInt(version, 10) < 17) {
+  describeOrSkip = describe.skip;
+}
 
 describeOrSkip('IncrementalDelivery support via fetcher', () => {
   describe('When operation contains @stream', () => {
@@ -20,36 +19,16 @@ describeOrSkip('IncrementalDelivery support via fetcher', () => {
     const mockStreamSuccess = {
       data: {
         streamable: [
-          {
-            text: 'Hi',
-          },
-          {
-            text: '你好',
-          },
-          {
-            text: 'Hola',
-          },
-          {
-            text: 'أهلاً',
-          },
-          {
-            text: 'Bonjour',
-          },
-          {
-            text: 'سلام',
-          },
-          {
-            text: '안녕',
-          },
-          {
-            text: 'Ciao',
-          },
-          {
-            text: 'हेलो',
-          },
-          {
-            text: 'Здорово',
-          },
+          { text: 'Hi' },
+          { text: '你好' },
+          { text: 'Hola' },
+          { text: 'أهلاً' },
+          { text: 'Bonjour' },
+          { text: 'سلام' },
+          { text: '안녕' },
+          { text: 'Ciao' },
+          { text: 'हेलो' },
+          { text: 'Здорово' },
         ],
       },
     };
@@ -142,22 +121,10 @@ describeOrSkip('IncrementalDelivery support via fetcher', () => {
           person: {
             name: 'Mark',
             friends: [
-              {
-                name: 'James',
-                age: 1000,
-              },
-              {
-                name: 'Mary',
-                age: 1000,
-              },
-              {
-                name: 'John',
-                age: 1000,
-              },
-              {
-                name: 'Patrica',
-                age: 1000,
-              },
+              { name: 'James', age: 1000 },
+              { name: 'Mary', age: 1000 },
+              { name: 'John', age: 1000 },
+              { name: 'Patrica', age: 1000 },
             ],
             age: 1000,
           },

packages/graphiql/package.json

@@ -65,18 +65,13 @@
     "babel-plugin-react-compiler": "19.1.0-rc.1",
     "cross-env": "^7.0.2",
     "cypress": "^13.13.2",
-    "express": "^4.20.0",
     "graphql": "^16.11.0",
-    "graphql-helix": "^1.13.0",
-    "graphql-subscriptions": "^2.0.0",
     "lightningcss": "^1.29.3",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     "start-server-and-test": "^1.10.11",
-    "subscriptions-transport-ws": "0.11.0",
     "typescript": "^4.6.3",
     "vite": "^6.3.4",
-    "vite-plugin-dts": "^4.5.3",
-    "ws": "8.17.1"
+    "vite-plugin-dts": "^4.5.3"
   }
 }

packages/graphiql/test/e2e-server.js

@@ -5,21 +5,25 @@
  *  LICENSE file in the root directory of this source tree.
  */
 
-/* eslint-disable no-console, import-x/no-extraneous-dependencies */
+/* eslint-disable no-console */
 import { createServer } from 'node:http';
 import path from 'node:path';
 import { fileURLToPath } from 'node:url';
 import express from 'express';
-import { useServer } from 'graphql-ws/lib/use/ws';
+import { useServer } from 'graphql-ws/use/ws';
 import { WebSocketServer } from 'ws';
 import {
   getGraphQLParameters,
   processRequest,
   sendResult,
 } from 'graphql-helix'; // update when `graphql-http` is upgraded to support multipart requests for incremental delivery https://github.com/graphql/graphiql/pull/3682#discussion_r1715545279
+import * as graphql from 'graphql';
 
-import { testSchema as schema } from './schema.js';
-import { customExecute } from './execute.js';
+import { createSchema } from './schema.js';
+import { createExecute } from './execute.js';
+
+const schema = createSchema(graphql);
+const customExecute = createExecute(graphql);
 
 const app = express();
 
@@ -44,6 +48,7 @@ async function handler(req, res) {
 
   sendResult(result, res);
 }
+
 // Server
 app.use(express.json());
 

packages/graphiql/test/execute.js

@@ -1,24 +1,26 @@
-/* eslint-disable import-x/no-extraneous-dependencies, import-x/default */
-import pkg from 'graphql';
-const { execute, experimentalExecuteIncrementally, version } = pkg;
+export function createExecute({
+  execute,
+  experimentalExecuteIncrementally,
+  version,
+}) {
+  if (parseInt(version, 10) < 17) {
+    return execute;
+  }
+  return async (...args) => {
+    const result = await experimentalExecuteIncrementally(...args);
 
-export const customExecute =
-  parseInt(version, 10) > 16
-    ? async (...args) => {
-        const result = await experimentalExecuteIncrementally(...args);
+    if (!('subsequentResults' in result)) {
+      return result;
+    }
 
-        if (!('subsequentResults' in result)) {
-          return result;
-        }
+    const { initialResult, subsequentResults } = result;
+    if (typeof subsequentResults[Symbol.asyncIterator] !== 'function') {
+      return result;
+    }
 
-        const { initialResult, subsequentResults } = result;
-        if (typeof subsequentResults[Symbol.asyncIterator] !== 'function') {
-          return result;
-        }
-
-        return (async function* () {
-          yield initialResult;
-          yield* subsequentResults;
-        })();
-      }
-    : execute;
+    return (async function* () {
+      yield initialResult;
+      yield* subsequentResults;
+    })();
+  };
+}

packages/graphiql/test/package.json

@@ -1,3 +1,12 @@
 {
-  "type": "module"
+  "type": "module",
+  "name": "test-server",
+  "private": true,
+  "dependencies": {
+    "express": "^4.20.0",
+    "graphql": "^17.0.0-alpha.8",
+    "graphql-helix": "^1.13.0",
+    "graphql-ws": "^6.0.5",
+    "ws": "8.17.1"
+  }
 }