diff --git a/README.md b/README.md index a310ee7..6676220 100644 --- a/README.md +++ b/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(options: Options = {}) { + return async ( + query: string, + variables?: Record + ): Promise> => { + 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`. + return result as ExecutionResult + } +} + +describe('Test something cool', () => { + it('testGetBooksQuery should return something', async () => { + const res = await testGetBooksQuery(graphqlRequester()) + expect(res.data?.books).toBeAwesome() + }) +}) +``` diff --git a/package-lock.json b/package-lock.json index e083044..3bba1c4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3608,7 +3608,6 @@ "version": "1.0.4", "resolved": "https://registry.npmjs.org/capital-case/-/capital-case-1.0.4.tgz", "integrity": "sha512-ds37W8CytHgwnhGGTi88pcPyR15qoNkOpYwmMMfnWqqWgESapLqvDx6huFjQ5vqWSn2Z06173XNA7LtMOeUh1A==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -3685,7 +3684,6 @@ "version": "4.1.2", "resolved": "https://registry.npmjs.org/change-case/-/change-case-4.1.2.tgz", "integrity": "sha512-bSxY2ws9OtviILG1EiY5K7NNxkqg/JnRnFxLtKQ96JaviiIxi7djMrSd0ECT9AC+lttClmYwKw53BWpOMblo7A==", - "dev": true, "requires": { "camel-case": "^4.1.2", "capital-case": "^1.0.4", @@ -3705,7 +3703,6 @@ "version": "1.0.14", "resolved": "https://registry.npmjs.org/change-case-all/-/change-case-all-1.0.14.tgz", "integrity": "sha512-CWVm2uT7dmSHdO/z1CXT/n47mWonyypzBbuCy5tN7uMg22BsfkhwT6oHmFCAk+gL1LOOxhdbB9SZz3J1KTY3gA==", - "dev": true, "requires": { "change-case": "^4.1.2", "is-lower-case": "^2.0.2", @@ -3967,7 +3964,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/constant-case/-/constant-case-3.0.4.tgz", "integrity": "sha512-I2hSBi7Vvs7BEuJDr5dDHfzb/Ruj3FyvFyh7KLilAjNQw3Be+xgqUBA2W6scVEcL0hL1dwPRtIqEPVUCKkSsyQ==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -4305,7 +4301,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/dot-case/-/dot-case-3.0.4.tgz", "integrity": "sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3" @@ -5766,7 +5761,6 @@ "version": "2.0.4", "resolved": "https://registry.npmjs.org/header-case/-/header-case-2.0.4.tgz", "integrity": "sha512-H/vuk5TEEVZwrR0lp2zed9OCo1uAILMlx0JEMgC26rzyJJ3N1v6XkwHHXJQdR2doSjcGPM6OKPYoJgf0plJ11Q==", - "dev": true, "requires": { "capital-case": "^1.0.4", "tslib": "^2.0.3" @@ -6137,7 +6131,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/is-lower-case/-/is-lower-case-2.0.2.tgz", "integrity": "sha512-bVcMJy4X5Og6VZfdOZstSexlEy20Sr0k/p/b2IlQJlfdKAQuMpiv5w2Ccxb8sKdRUNAG1PnHVHjFSdRDVS6NlQ==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -6263,7 +6256,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/is-upper-case/-/is-upper-case-2.0.2.tgz", "integrity": "sha512-44pxmxAvnnAOwBg4tHPnkfvgjPwbc5QIsSstNU+YcJ1ovxVzCWpSGosPJOZh/a1tdl81fbgnLc9LLv+x2ywbPQ==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -7776,7 +7768,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case-first/-/lower-case-first-2.0.2.tgz", "integrity": "sha512-EVm/rR94FJTZi3zefZ82fLWab+GX14LJN4HrWBcuo6Evmsl9hEfnqxgcHCKb9q+mNf6EVdsjx/qucYFIIB84pg==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -8408,7 +8399,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/param-case/-/param-case-3.0.4.tgz", "integrity": "sha512-RXlj7zCYokReqWpOPH9oYivUzLYZ5vAPIfEmCTNViosC78F8F0H9y7T7gG2M39ymgutxF5gcFEsyZQSph9Bp3A==", - "dev": true, "requires": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -8471,7 +8461,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/path-case/-/path-case-3.0.4.tgz", "integrity": "sha512-qO4qCFjXqVTrcbPt/hQfhTQ+VhFsqNKOPtytgNKkKxSoEp3XPUQ8ObFuePylOIok5gjn69ry8XiULxCwot3Wfg==", - "dev": true, "requires": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -9404,7 +9393,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/sentence-case/-/sentence-case-3.0.4.tgz", "integrity": "sha512-8LS0JInaQMCRoQ7YUytAo/xUu5W2XnQxV2HI/6uM6U7CITS1RqPElr30V6uIqyMKM9lJGRVFy5/4CuzcixNYSg==", - "dev": true, "requires": { "no-case": "^3.0.4", "tslib": "^2.0.3", @@ -9502,7 +9490,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/snake-case/-/snake-case-3.0.4.tgz", "integrity": "sha512-LAOh4z89bGQvl9pFfNF8V146i7o7/CqFPbqzYgP+yYzDIDeS9HaNFtXABamRW+AQzEVODcvE79ljJ+8a9YSdMg==", - "dev": true, "requires": { "dot-case": "^3.0.4", "tslib": "^2.0.3" @@ -9724,7 +9711,6 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/sponge-case/-/sponge-case-1.0.1.tgz", "integrity": "sha512-dblb9Et4DAtiZ5YSUZHLl4XhH4uK80GhAZrVXdN4O2P4gQ40Wa5UIOPUHlA/nFd2PLblBZWUioLMMAVrgpoYcA==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -9929,7 +9915,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/swap-case/-/swap-case-2.0.2.tgz", "integrity": "sha512-kc6S2YS/2yXbtkSMunBtKdah4VFETZ8Oh6ONSmSd9bRxhqTrtARUCBUiWXH3xVPpvR7tz2CSnkuXVE42EcGnMw==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -10068,7 +10053,6 @@ "version": "3.0.3", "resolved": "https://registry.npmjs.org/title-case/-/title-case-3.0.3.tgz", "integrity": "sha512-e1zGYRvbffpcHIrnuqT0Dh+gEJtDaxDSoG4JAIpq4oDFyooziLBIiYQv0GBT4FUAnUop5uZ1hiIAj7oAF6sOCA==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -10405,7 +10389,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/upper-case/-/upper-case-2.0.2.tgz", "integrity": "sha512-KgdgDGJt2TpuwBUIjgG6lzw2GWFRCW9Qkfkiv0DxqHHLYJHmtmdUIKcZd8rHgFSjopVTlw6ggzCm1b8MFQwikg==", - "dev": true, "requires": { "tslib": "^2.0.3" } @@ -10414,7 +10397,6 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/upper-case-first/-/upper-case-first-2.0.2.tgz", "integrity": "sha512-514ppYHBaKwfJRK/pNC6c/OxfGa0obSnAl106u97Ed0I625Nin96KAjttZF6ZL3e1XLtphxnqrOi9iWgm+u+bg==", - "dev": true, "requires": { "tslib": "^2.0.3" } diff --git a/package.json b/package.json index 86051c3..5ee83fc 100644 --- a/package.json +++ b/package.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" } } diff --git a/src/index.ts b/src/index.ts index 9ef5a63..c5f1eb8 100644 --- a/src/index.ts +++ b/src/index.ts @@ -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((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>,`) - 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 + +export async function request = Record>( + graphqlArgs: GraphQLArgs +): Promise> { + return graphql(graphqlArgs) as Promise> +} diff --git a/test/int/documents.graphql b/test/int/documents.graphql index c82adcc..40c7099 100644 --- a/test/int/documents.graphql +++ b/test/int/documents.graphql @@ -1,5 +1,5 @@ -query getBooks { - books { +query getBooks($var1: String!) { + books(var1: $var1) { title author { firstname diff --git a/test/int/schema.graphql b/test/int/schema.graphql index 5f86019..1943e0a 100644 --- a/test/int/schema.graphql +++ b/test/int/schema.graphql @@ -10,5 +10,5 @@ type Book { } type Query { - books: [Book] + books(var1: String!): [Book] } diff --git a/test/int/test.spec.ts b/test/int/test.spec.ts index 6c8b133..9349099 100644 --- a/test/int/test.spec.ts +++ b/test/int/test.spec.ts @@ -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) => { - 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() diff --git a/tsconfig.json b/tsconfig.json index 82503e4..0500f05 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -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. */