⛑ Fix naming convention

Author: heiso

README.md

@@ -3,3 +3,76 @@
 [![Version](https://img.shields.io/npm/v/graphql-codegen-typescript-operations-tester.svg)](https://www.npmjs.com/package/graphql-codegen-typescript-operations-tester)
 ![Test workflow](https://github.com/hellocomet/graphql-codegen-typescript-operations-tester/workflows/Tests/badge.svg?branch=main)
 ![Release workflow](https://github.com/hellocomet/graphql-codegen-typescript-operations-tester/workflows/Release%20package/badge.svg)
+
+## Install
+
+`npm i -D @graphql-codegen/typescript @graphql-codegen/typescript-operations graphql-codegen-typescript-operations-tester`
+
+In `codegen.yml`
+
+```yaml
+generated/tests.ts:
+  plugins:
+    - typescript
+    - typescript-operations
+    - graphql-codegen-typescript-operations-tester
+```
+
+Given a schema like so
+
+```graphql
+type Author {
+  firstname: String
+  lastname: String
+  fullname: String
+}
+
+type Book {
+  title: String
+  author: Author
+}
+
+type Query {
+  books: [Book]
+}
+```
+
+Create a graphQL requester somewhere in your tests
+
+```typescript
+import { graphql, GraphQLSchema, ExecutionResult } from 'graphql'
+import { testGetBooksQuery } from './generated/tests.ts'
+import { schema } from 'path/to/my/schema'
+
+type Options = {
+  silenceError?: boolean
+}
+
+export function graphqlRequester<TResultDataType>(options: Options = {}) {
+  return async (
+    query: string,
+    variables?: Record<string, any>
+  ): Promise<ExecutionResult<TResultDataType>> => {
+    const result = await graphql({
+      variableValues: variables,
+      schema,
+      source: query,
+    })
+
+    if (!options.silenceError && result.errors?.length > 0) {
+      result.errors.forEach((error) => console.error(error))
+    }
+
+    // Allow typing the return value of the query which is by default:
+    // `Record<string, any>`.
+    return result as ExecutionResult<TResultDataType>
+  }
+}
+
+describe('Test something cool', () => {
+  it('testGetBooksQuery should return something', async () => {
+    const res = await testGetBooksQuery(graphqlRequester())
+    expect(res.data?.books).toBeAwesome()
+  })
+})
+```

package-lock.json

@@ -53,9 +53,12 @@
     "typescript": "^4.3.5"
   },
   "dependencies": {
-    "@graphql-codegen/plugin-helpers": "^1.18.8"
+    "@graphql-codegen/plugin-helpers": "^1.18.8",
+    "change-case-all": "^1.0.14"
   },
   "peerDependencies": {
+    "@graphql-codegen/typescript": ">=1.21.1",
+    "@graphql-codegen/typescript-operations": ">=1.17.8",
     "graphql": "^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0"
   }
 }

package.json

@@ -1,8 +1,13 @@
 import { PluginFunction } from '@graphql-codegen/plugin-helpers'
+import { pascalCase } from 'change-case-all'
 import {
   concatAST,
   DocumentNode,
+  ExecutionResult,
   FragmentDefinitionNode,
+  graphql,
+  GraphQLArgs,
+  GraphQLSchema,
   OperationDefinitionNode,
   print,
   visit,
@@ -32,7 +37,7 @@ function getOperationFragments(
 }
 
 export const plugin: PluginFunction = (schema, documents) => {
-  const imports = [`import { graphql, ExecutionResult } from 'graphql'`]
+  const imports = [`import { request, Args } from 'graphql-codegen-typescript-operations-tester'`]
 
   const allAst = concatAST(
     documents.reduce<DocumentNode[]>((acc, source) => {
@@ -55,28 +60,26 @@ export const plugin: PluginFunction = (schema, documents) => {
       if (!node.name) return
 
       const type = node.operation === 'mutation' ? 'Mutation' : 'Query'
-      const name = `${node.name.value[0].toUpperCase()}${node.name.value.substr(
-        1,
-        node.name.value.length - 1
-      )}`
+
+      // Mimic the default naming convention.
+      // See https://www.graphql-code-generator.com/docs/getting-started/naming-convention#namingconvention
+      const name = pascalCase(`${node.name.value}${type}`)
 
       const fragments = getOperationFragments(node, allFragments)
       const fragmentsStr =
         fragments.size > 0 ? `${Array.from(fragments.values()).map(print)}\n` : ''
 
       lines.push(``)
-      lines.push(`export const ${name}${type}Source: string = \``)
+      lines.push(`export const ${name}Source: string = \``)
       lines.push(`${fragmentsStr}${print(node)}\`;`)
       lines.push(``)
-      lines.push(`export function test${name}${type}(`)
-      lines.push(`  graphqlRequester: (`)
-      lines.push(`    query: string,`)
-      lines.push(`    variables: ${name}${type}Variables`)
-      lines.push(`  ) => Promise<ExecutionResult<${name}${type}>>,`)
-      lines.push(`  variables: ${name}${type}Variables`)
+      lines.push(`export function test${name}(`)
+      lines.push(`  graphqlArgs: Args,`)
+      lines.push(`  variables?: ${name}Variables`)
       lines.push(`) {`)
-      lines.push(`  const query = ${name}${type}Source`)
-      lines.push(`  return graphqlRequester(query, variables)`)
+      lines.push(
+        `  return request<${name}>({ ...graphqlArgs, source: ${name}Source, variableValues: variables })`
+      )
       lines.push(`};`)
     },
   })
@@ -88,3 +91,11 @@ export const plugin: PluginFunction = (schema, documents) => {
     content: content,
   }
 }
+
+export type Args = { schema: GraphQLSchema } & Partial<GraphQLArgs>
+
+export async function request<TData extends Record<string, unknown> = Record<string, unknown>>(
+  graphqlArgs: GraphQLArgs
+): Promise<ExecutionResult<TData>> {
+  return graphql(graphqlArgs) as Promise<ExecutionResult<TData>>
+}

src/index.ts

@@ -1,5 +1,5 @@
-query getBooks {
-  books {
+query getBooks($var1: String!) {
+  books(var1: $var1) {
     title
     author {
       firstname

test/int/documents.graphql

@@ -10,5 +10,5 @@ type Book {
 }
 
 type Query {
-  books: [Book]
+  books(var1: String!): [Book]
 }

test/int/schema.graphql

@@ -1,27 +1,16 @@
 import { readFileSync } from 'fs'
-import { buildSchema, graphql, GraphQLSchema } from 'graphql'
+import { buildSchema } from 'graphql'
 import * as generated from './generated'
 
 const schema = buildSchema(readFileSync(`${__dirname}/schema.graphql`, { encoding: 'utf-8' }))
 
-function graphqlRequester(schema: GraphQLSchema) {
-  return async (query: string, variables?: null | undefined | Record<string, unknown>) => {
-    const res = await graphql({
-      variableValues: variables,
-      schema,
-      source: query,
-    })
-    return res
-  }
-}
-
 describe('Test generated file', () => {
   it('testGetBooksQuery should exist', async () => {
     expect(generated).toHaveProperty('testGetBooksQuery')
   })
 
   it('testGetBooksQuery should return something', async () => {
-    const res = await generated.testGetBooksQuery(graphqlRequester(schema), {})
+    const res = await generated.testGetBooksQuery({ schema }, { var1: 'hello' })
     expect(generated).toHaveProperty('testGetBooksQuery')
     expect(res.data?.books).toBeNull()
     expect(res.errors).toBeUndefined()

test/int/test.spec.ts

@@ -12,8 +12,8 @@
     // "allowJs": true,                       /* Allow javascript files to be compiled. */
     // "checkJs": true,                       /* Report errors in .js files. */
     // "jsx": "preserve",                     /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
-    // "declaration": true,                   /* Generates corresponding '.d.ts' file. */
-    // "declarationMap": true,                /* Generates a sourcemap for each corresponding '.d.ts' file. */
+    "declaration": true /* Generates corresponding '.d.ts' file. */,
+    "declarationMap": true /* Generates a sourcemap for each corresponding '.d.ts' file. */,
     "sourceMap": true /* Generates corresponding '.map' file. */,
     // "outFile": "./",                       /* Concatenate and emit output to single file. */
     "outDir": "dist" /* Redirect output structure to the directory. */,
@@ -46,7 +46,9 @@
     /* Module Resolution Options */
     // "moduleResolution": "node",            /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
     "baseUrl": "./" /* Base directory to resolve non-absolute module names. */,
-    // "paths": {},                           /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
+    "paths": {
+      "graphql-codegen-typescript-operations-tester": ["./src/index.ts"]
+    } /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */,
     // "rootDirs": [],                        /* List of root folders whose combined content represents the structure of the project at runtime. */
     // "typeRoots": [],                       /* List of folders to include type definitions from. */
     // "types": [],                           /* Type declaration files to be included in compilation. */