Modify typescript-graphql-request example and add test

dotansimha · Mar 10, 2023 · 7a94464 · 7a94464
1 parent ef28588
commit 7a94464
Show file tree

Hide file tree

Showing 7 changed files with 55 additions and 146 deletions.
diff --git a/examples/typescript-graphql-request/babel.config.js b/examples/typescript-graphql-request/babel.config.js
@@ -0,0 +1,6 @@
+module.exports = {
+  presets: [
+    ['@babel/preset-env', { targets: { node: process.versions.node.split('.')[0] } }],
+    '@babel/preset-typescript',
+  ],
+};
diff --git a/examples/typescript-graphql-request/codegen.ts b/examples/typescript-graphql-request/codegen.ts
@@ -7,6 +7,9 @@ const config: CodegenConfig = {
   generates: {
     './src/gql/': {
       preset: 'client',
+      config: {
+        documentMode: 'string',
+      },
     },
   },
   hooks: { afterAllFileWrite: ['prettier --write'] },

diff --git a/examples/typescript-graphql-request/jest.config.js b/examples/typescript-graphql-request/jest.config.js
@@ -0,0 +1,3 @@
+module.exports = {
+  transform: { '^.+\\.ts': 'babel-jest' },
+};
diff --git a/examples/typescript-graphql-request/package.json b/examples/typescript-graphql-request/package.json
@@ -4,7 +4,9 @@
   "private": true,
   "devDependencies": {
     "@graphql-codegen/cli": "3.2.2",
-    "@graphql-codegen/gql-tag-operations-preset": "2.1.0"
+    "@graphql-codegen/gql-tag-operations-preset": "2.1.0",
+    "babel-jest": "28.1.3",
+    "jest": "28.1.3"
   },
   "dependencies": {
     "graphql": "16.6.0",
@@ -15,7 +17,7 @@
     "codegen": "graphql-codegen --config codegen.ts",
     "build": "tsc",
     "dev": "ts-node src/main.ts",
-    "test:end2end": "node dist/main.js"
+    "test:end2end": "yarn jest"
   },
   "type": "commonjs",
   "bob": false

diff --git a/examples/typescript-graphql-request/src/gql/gql.ts b/examples/typescript-graphql-request/src/gql/gql.ts
@@ -1,6 +1,5 @@
 /* eslint-disable */
 import * as types from './graphql';
-import { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/core';
 
 /**
  * Map of all GraphQL operations in the project.
@@ -19,40 +18,19 @@ const documents = {
     types.AllPeopleWithVariablesQueryDocument,
 };
 
-/**
- * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
- *
- *
- * @example
- * ```ts
- * const query = graphql(`query GetUser($id: ID!) { user(id: $id) { name } }`);
- * ```
- *
- * The query argument is unknown!
- * Please regenerate the types.
- */
-export function graphql(source: string): unknown;
-
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function graphql(
   source: '\n  query AllPeopleQuery {\n    allPeople(first: 5) {\n      edges {\n        node {\n          name\n          homeworld {\n            name\n          }\n        }\n      }\n    }\n  }\n'
-): (typeof documents)['\n  query AllPeopleQuery {\n    allPeople(first: 5) {\n      edges {\n        node {\n          name\n          homeworld {\n            name\n          }\n        }\n      }\n    }\n  }\n'];
+): typeof import('./graphql').AllPeopleQueryDocument;
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
 export function graphql(
   source: '\n  query AllPeopleWithVariablesQuery($first: Int!) {\n    allPeople(first: $first) {\n      edges {\n        node {\n          name\n          homeworld {\n            name\n          }\n        }\n      }\n    }\n  }\n'
-): (typeof documents)['\n  query AllPeopleWithVariablesQuery($first: Int!) {\n    allPeople(first: $first) {\n      edges {\n        node {\n          name\n          homeworld {\n            name\n          }\n        }\n      }\n    }\n  }\n'];
+): typeof import('./graphql').AllPeopleWithVariablesQueryDocument;
 
 export function graphql(source: string) {
   return (documents as any)[source] ?? {};
 }
-
-export type DocumentType<TDocumentNode extends DocumentNode<any, any>> = TDocumentNode extends DocumentNode<
-  infer TType,
-  any
->
-  ? TType
-  : never;
diff --git a/examples/typescript-graphql-request/src/gql/graphql.ts b/examples/typescript-graphql-request/src/gql/graphql.ts
@@ -1,5 +1,5 @@
 /* eslint-disable */
-import { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/core';
+import { TypedDocumentString } from '@graphql-typed-document-node/core';
 export type Maybe<T> = T | null;
 export type InputMaybe<T> = Maybe<T>;
 export type Exact<T extends { [key: string]: unknown }> = { [K in keyof T]: T[K] };
@@ -1309,122 +1309,31 @@ export type AllPeopleWithVariablesQueryQuery = {
   } | null;
 };
 
-export const AllPeopleQueryDocument = {
-  kind: 'Document',
-  definitions: [
-    {
-      kind: 'OperationDefinition',
-      operation: 'query',
-      name: { kind: 'Name', value: 'AllPeopleQuery' },
-      selectionSet: {
-        kind: 'SelectionSet',
-        selections: [
-          {
-            kind: 'Field',
-            name: { kind: 'Name', value: 'allPeople' },
-            arguments: [
-              { kind: 'Argument', name: { kind: 'Name', value: 'first' }, value: { kind: 'IntValue', value: '5' } },
-            ],
-            selectionSet: {
-              kind: 'SelectionSet',
-              selections: [
-                {
-                  kind: 'Field',
-                  name: { kind: 'Name', value: 'edges' },
-                  selectionSet: {
-                    kind: 'SelectionSet',
-                    selections: [
-                      {
-                        kind: 'Field',
-                        name: { kind: 'Name', value: 'node' },
-                        selectionSet: {
-                          kind: 'SelectionSet',
-                          selections: [
-                            { kind: 'Field', name: { kind: 'Name', value: 'name' } },
-                            {
-                              kind: 'Field',
-                              name: { kind: 'Name', value: 'homeworld' },
-                              selectionSet: {
-                                kind: 'SelectionSet',
-                                selections: [{ kind: 'Field', name: { kind: 'Name', value: 'name' } }],
-                              },
-                            },
-                          ],
-                        },
-                      },
-                    ],
-                  },
-                },
-              ],
-            },
-          },
-        ],
-      },
-    },
-  ],
-} as unknown as DocumentNode<AllPeopleQueryQuery, AllPeopleQueryQueryVariables>;
-export const AllPeopleWithVariablesQueryDocument = {
-  kind: 'Document',
-  definitions: [
-    {
-      kind: 'OperationDefinition',
-      operation: 'query',
-      name: { kind: 'Name', value: 'AllPeopleWithVariablesQuery' },
-      variableDefinitions: [
-        {
-          kind: 'VariableDefinition',
-          variable: { kind: 'Variable', name: { kind: 'Name', value: 'first' } },
-          type: { kind: 'NonNullType', type: { kind: 'NamedType', name: { kind: 'Name', value: 'Int' } } },
-        },
-      ],
-      selectionSet: {
-        kind: 'SelectionSet',
-        selections: [
-          {
-            kind: 'Field',
-            name: { kind: 'Name', value: 'allPeople' },
-            arguments: [
-              {
-                kind: 'Argument',
-                name: { kind: 'Name', value: 'first' },
-                value: { kind: 'Variable', name: { kind: 'Name', value: 'first' } },
-              },
-            ],
-            selectionSet: {
-              kind: 'SelectionSet',
-              selections: [
-                {
-                  kind: 'Field',
-                  name: { kind: 'Name', value: 'edges' },
-                  selectionSet: {
-                    kind: 'SelectionSet',
-                    selections: [
-                      {
-                        kind: 'Field',
-                        name: { kind: 'Name', value: 'node' },
-                        selectionSet: {
-                          kind: 'SelectionSet',
-                          selections: [
-                            { kind: 'Field', name: { kind: 'Name', value: 'name' } },
-                            {
-                              kind: 'Field',
-                              name: { kind: 'Name', value: 'homeworld' },
-                              selectionSet: {
-                                kind: 'SelectionSet',
-                                selections: [{ kind: 'Field', name: { kind: 'Name', value: 'name' } }],
-                              },
-                            },
-                          ],
-                        },
-                      },
-                    ],
-                  },
-                },
-              ],
-            },
-          },
-        ],
-      },
-    },
-  ],
-} as unknown as DocumentNode<AllPeopleWithVariablesQueryQuery, AllPeopleWithVariablesQueryQueryVariables>;
+export const AllPeopleQueryDocument = `
+    query AllPeopleQuery {
+  allPeople(first: 5) {
+    edges {
+      node {
+        name
+        homeworld {
+          name
+        }
+      }
+    }
+  }
+}
+    ` as unknown as TypedDocumentString<AllPeopleQueryQuery, AllPeopleQueryQueryVariables>;
+export const AllPeopleWithVariablesQueryDocument = `
+    query AllPeopleWithVariablesQuery($first: Int!) {
+  allPeople(first: $first) {
+    edges {
+      node {
+        name
+        homeworld {
+          name
+        }
+      }
+    }
+  }
+}
+    ` as unknown as TypedDocumentString<AllPeopleWithVariablesQueryQuery, AllPeopleWithVariablesQueryQueryVariables>;
diff --git a/examples/typescript-graphql-request/src/main.spec.ts b/examples/typescript-graphql-request/src/main.spec.ts
@@ -0,0 +1,8 @@
+import { execSync } from 'child_process';
+
+describe('TypeScript GraphQL Request tests', () => {
+  it('works', () => {
+    const result = execSync('node dist/main.js', { stdio: 'pipe' }).toString();
+    expect(result).toContain('Luke Skywalker');
+  });
+});