chore: types, cleanup, rename it, end to end tests

Author: acao

.npmrc

@@ -1 +1,2 @@
 engine-strict=true
+access=public

package.json

@@ -52,7 +52,7 @@
     "eslint": "eslint --ext=ts,js,jsx,tsx .",
     "lint": "yarn eslint && yarn lint-check && yarn pretty-check",
     "lint-fix": "yarn eslint --fix",
-    "lint-check": "eslint-config-prettier .eslintrc.js",
+    "lint-check": "eslint --print-config .eslintrc.js | eslint-config-prettier-check",
     "check": "flow check --show-all-errors && yarn tsc --dry",
     "pretty": "node resources/pretty.js",
     "pretty-check": "node resources/pretty.js --check",

packages/graphiql-build-fetcher/src/index.ts

@@ -1,4 +1,4 @@
-## `@graphiql/build-fetcher`
+## `@graphiql/create-fetcher`
 
 a utility for generating a full-featured fetcher for GraphiQL.
 
@@ -8,18 +8,18 @@ under the hood, it uses [`graphql-ws`](https://www.npmjs.com/package/graphql-ws)
 
 [`graphiql`](https://npmjs.com/package/graphiql) and thus `react` and `react-dom` should already be installed.
 
-you'll need to install `@graphiql/build-fetcher`
+you'll need to install `@graphiql/create-fetcher`
 
 npm
 
 ```bash
-npm install --save @graphiql/build-fetcher
+npm install --save @graphiql/create-fetcher
 ```
 
 yarn
 
 ```bash
-yarn add @graphiql/build-fetcher
+yarn add @graphiql/create-fetcher
 ```
 
 ### Getting Started
@@ -34,11 +34,11 @@ Here's a simple example. In this case, a websocket client isn't even initialized
 import * as React from 'react';
 import ReactDOM from 'react-dom';
 import { GraphiQL } from 'graphiql';
-import { buildGraphiQLFetcher } from '@graphiql/build-fetcher';
+import { createGraphiQLFetcher } from '@graphiql/create-fetcher';
 
 const url = 'https://myschema.com/graphql';
 
-const fetcher = buildGraphiQLFetcher({ url });
+const fetcher = createGraphiQLFetcher({ url });
 
 export const App = () => <GraphiQL fetcher={fetcher} />;
 
@@ -53,13 +53,13 @@ Just by providing the `subscriptionUrl`, you can generate a `graphql-ws` client
 import * as React from 'react';
 import ReactDOM from 'react-dom';
 import { GraphiQL } from 'graphiql';
-import { buildGraphiQLFetcher } from '@graphiql/build-fetcher';
+import { createGraphiQLFetcher } from '@graphiql/create-fetcher';
 
 const url = 'https://myschema.com/graphql';
 
 const subscriptionUrl = 'wss://myschema.com/graphql';
 
-const fetcher = buildGraphiQLFetcher({
+const fetcher = createGraphiQLFetcher({
   url,
   subscriptionUrl,
 });
@@ -104,13 +104,13 @@ import * as React from 'react';
 import ReactDOM from 'react-dom';
 import { GraphiQL } from 'graphiql';
 import { createClient } from 'graphql-ws';
-import { buildGraphiQLFetcher } from '@graphiql/build-fetcher';
+import { createGraphiQLFetcher } from '@graphiql/create-fetcher';
 
 const url = 'https://myschema.com/graphql';
 
 const subscriptionUrl = 'wss://myschema.com/graphql';
 
-const fetcher = buildGraphiQLFetcher({
+const fetcher = createGraphiQLFetcher({
   url,
   wsClient: createClient({
     url: subscriptionUrl,
@@ -132,11 +132,11 @@ import * as React from 'react';
 import ReactDOM from 'react-dom';
 import { GraphiQL } from 'graphiql';
 import { fetch } from 'isomorphic-fetch';
-import { buildGraphiQLFetcher } from '@graphiql/build-fetcher';
+import { createGraphiQLFetcher } from '@graphiql/create-fetcher';
 
 const url = 'https://myschema.com/graphql';
 
-const fetcher = buildGraphiQLFetcher({
+const fetcher = createGraphiQLFetcher({
   url,
   fetch,
 });

packages/graphiql-build-fetcher/test/server.ts

@@ -1,5 +1,5 @@
 {
-  "name": "@graphiql/build-fetcher",
+  "name": "@graphiql/create-fetcher",
   "version": "0.0.1",
   "description": "Utility to build a fetcher for GraphiQL",
   "contributors": [
@@ -13,14 +13,8 @@
   "license": "MIT",
   "main": "dist/index.js",
   "module": "esm/index.js",
-  "scripts": {
-    "server": "ts-node test/server.ts"
-  },
-  "workspaces": {
-    "nohoist": [
-      "graphql"
-    ]
-  },
+  "types": "dist/index.d.ts",
+  "scripts": {},
   "dependencies": {
     "graphql-ws": "^4.1.0",
     "subscriptions-transport-ws": "^0.9.18",
@@ -30,13 +24,6 @@
   },
   "devDependencies": {
     "isomorphic-fetch": "^3.0.0",
-    "express": "^4.17.1",
-    "express-graphql": "experimental-stream-defer",
-    "ws": "^7.4.2",
-    "ts-node": "^9.1.1",
-    "graphql": "experimental-stream-defer"
-  },
-  "resolutions": {
     "graphql": "experimental-stream-defer"
   }
 }

packages/graphiql-build-fetcher/README.md renamed to packages/graphiql-create-fetcher/README.md

@@ -1,5 +1,5 @@
 import { parse, getIntrospectionQuery } from 'graphql';
-import { buildGraphiQLFetcher } from '../buildFetcher';
+import { createGraphiQLFetcher } from '../createFetcher';
 
 import 'isomorphic-fetch';
 
@@ -32,13 +32,13 @@ const wssURL = 'ws://localhost:3000/graphql';
 
 const exampleIntrospectionDocument = parse(getIntrospectionQuery());
 
-describe('buildGraphiQLFetcher', () => {
+describe('createGraphiQLFetcher', () => {
   afterEach(() => {
     jest.resetAllMocks();
   });
   it('returns fetcher without websocket client by default', async () => {
     createWebsocketsFetcherFromUrl.mockReturnValue(true);
-    const fetcher = buildGraphiQLFetcher({ url: serverURL });
+    const fetcher = createGraphiQLFetcher({ url: serverURL });
     expect(createWebsocketsFetcherFromUrl.mock.calls).toEqual([]);
     expect(createMultipartFetcher.mock.calls).toEqual([
       [{ enableIncrementalDelivery: true, url: serverURL }],
@@ -47,7 +47,7 @@ describe('buildGraphiQLFetcher', () => {
 
   it('returns simple fetcher for introspection', async () => {
     createSimpleFetcher.mockReturnValue(async () => 'hey!');
-    const fetcher = buildGraphiQLFetcher({ url: serverURL });
+    const fetcher = createGraphiQLFetcher({ url: serverURL });
     expect(createWebsocketsFetcherFromUrl.mock.calls).toEqual([]);
     expect(createMultipartFetcher.mock.calls).toEqual([
       [{ enableIncrementalDelivery: true, url: serverURL }],
@@ -66,7 +66,7 @@ describe('buildGraphiQLFetcher', () => {
   });
   it('returns fetcher without websocket client or multipart', () => {
     createWebsocketsFetcherFromUrl.mockReturnValue(true);
-    buildGraphiQLFetcher({ url: serverURL, enableIncrementalDelivery: false });
+    createGraphiQLFetcher({ url: serverURL, enableIncrementalDelivery: false });
     expect(createWebsocketsFetcherFromUrl.mock.calls).toEqual([]);
     expect(createMultipartFetcher.mock.calls).toEqual([]);
     expect(createSimpleFetcher.mock.calls).toEqual([
@@ -82,7 +82,7 @@ describe('buildGraphiQLFetcher', () => {
       enableIncrementalDelivery: true,
     };
 
-    buildGraphiQLFetcher(args);
+    createGraphiQLFetcher(args);
 
     expect(createMultipartFetcher.mock.calls).toEqual([[args]]);
     expect(createWebsocketsFetcherFromUrl.mock.calls).toEqual([
@@ -101,7 +101,7 @@ describe('buildGraphiQLFetcher', () => {
       enableIncrementalDelivery: true,
     };
 
-    buildGraphiQLFetcher(args);
+    createGraphiQLFetcher(args);
 
     expect(createMultipartFetcher.mock.calls).toEqual([[args]]);
     expect(createWebsocketsFetcherFromUrl.mock.calls).toEqual([]);

packages/graphiql-build-fetcher/jest.config.js renamed to packages/graphiql-create-fetcher/jest.config.js

@@ -1,5 +1,5 @@
 import { parse } from 'graphql';
-import { isSubcriptionWithName, createWebsocketsFetcherFromUrl } from '../lib';
+import { isSubscriptionWithName, createWebsocketsFetcherFromUrl } from '../lib';
 
 import 'isomorphic-fetch';
 
@@ -23,17 +23,17 @@ const exampleWithSubscripton = /* GraphQL */ parse(`
 describe('isSubcriptionWithName', () => {
   it('detects when the subscription is present', () => {
     expect(
-      isSubcriptionWithName(exampleWithSubscripton, 'Example'),
+      isSubscriptionWithName(exampleWithSubscripton, 'Example'),
     ).toBeTruthy();
   });
   it('detects when the specified operation is not a subscription', () => {
     expect(
-      isSubcriptionWithName(exampleWithSubscripton, 'SomethingElse'),
+      isSubscriptionWithName(exampleWithSubscripton, 'SomethingElse'),
     ).toBeFalsy();
   });
   it('detects when the operation is not present', () => {
     expect(
-      isSubcriptionWithName(exampleWithSubscripton, 'NotPresent'),
+      isSubscriptionWithName(exampleWithSubscripton, 'NotPresent'),
     ).toBeFalsy();
   });
 });

packages/graphiql-build-fetcher/package.json renamed to packages/graphiql-create-fetcher/package.json

@@ -1,10 +1,10 @@
 import type { Fetcher } from '@graphiql/toolkit';
-import type { BuildFetcherOptions } from './types';
+import type { CreateFetcherOptions } from './types';
 
 import {
   createMultipartFetcher,
   createSimpleFetcher,
-  isSubcriptionWithName,
+  isSubscriptionWithName,
   createWebsocketsFetcherFromUrl,
   createWebsocketsFetcherFromClient,
 } from './lib';
@@ -14,10 +14,10 @@ import {
  * - backwards compatible
  * - optionally supports graphql-ws or `
  *
- * @param options {BuildFetcherOptions}
+ * @param options {CreateFetcherOptions}
  * @returns {Fetcher}
  */
-export function buildGraphiQLFetcher(options: BuildFetcherOptions): Fetcher {
+export function createGraphiQLFetcher(options: CreateFetcherOptions): Fetcher {
   let httpFetch;
   let wsFetcher: null | Fetcher | void = null;
   if (typeof window !== null && window?.fetch) {
@@ -53,14 +53,14 @@ export function buildGraphiQLFetcher(options: BuildFetcherOptions): Fetcher {
     if (graphQLParams.operationName === 'IntrospectionQuery') {
       return simpleFetcher(graphQLParams, opts);
     }
-    const isSubscription = isSubcriptionWithName(
+    const isSubscription = isSubscriptionWithName(
       opts?.documentAST!,
       graphQLParams.operationName,
     );
     if (isSubscription) {
       if (!wsFetcher) {
         throw Error(
-          `Your GraphiQL buildFetcher is not properly configured for websocket subscriptions yet. ${
+          `Your GraphiQL createFetcher is not properly configured for websocket subscriptions yet. ${
             options.subscriptionUrl
               ? `Provided URL ${options.subscriptionUrl} failed`
               : `Try providing options.subscriptionUrl or options.wsClient first.`

packages/graphiql-build-fetcher/src/__tests__/buildFetcher.spec.ts renamed to packages/graphiql-create-fetcher/src/__tests__/buildFetcher.spec.ts

@@ -0,0 +1,2 @@
+export type { CreateFetcherOptions } from './types';
+export { createGraphiQLFetcher } from './createFetcher';