From 8789c7a12f76457638a01e883e50c987b79d602e Mon Sep 17 00:00:00 2001 From: sam585456525 Date: Thu, 12 Oct 2023 17:50:59 +0800 Subject: [PATCH] refactor: queryHook --- .../react-query/src/fetcher-custom-mapper.ts | 20 +- .../src/fetcher-fetch-hardcoded.ts | 20 +- .../react-query/src/fetcher-fetch.ts | 39 +-- .../src/fetcher-graphql-request.ts | 20 +- .../typescript/react-query/src/fetcher.ts | 72 +++++- .../typescript/react-query/src/visitor.ts | 4 +- .../__snapshots__/react-query.spec.ts.snap | 232 ++++++++++++++++-- .../react-query/tests/react-query.spec.ts | 173 +------------ 8 files changed, 329 insertions(+), 251 deletions(-) diff --git a/packages/plugins/typescript/react-query/src/fetcher-custom-mapper.ts b/packages/plugins/typescript/react-query/src/fetcher-custom-mapper.ts index c8447e024..11cd6eb5d 100644 --- a/packages/plugins/typescript/react-query/src/fetcher-custom-mapper.ts +++ b/packages/plugins/typescript/react-query/src/fetcher-custom-mapper.ts @@ -6,7 +6,7 @@ import { parseMapper, } from '@graphql-codegen/visitor-plugin-common'; import { CustomFetch } from './config.js'; -import { FetcherRenderer } from './fetcher.js'; +import { FetcherRenderer, type GenerateQueryHookConfig } from './fetcher.js'; import { ReactQueryVisitor } from './visitor.js'; export class CustomMapperFetcher extends FetcherRenderer { @@ -90,14 +90,16 @@ export class CustomMapperFetcher extends FetcherRenderer { )};`; } - generateQueryHook( - node: OperationDefinitionNode, - documentVariableName: string, - operationName: string, - operationResultType: string, - operationVariablesTypes: string, - hasRequiredVariables: boolean, - ): string { + generateQueryHook(config: GenerateQueryHookConfig): string { + const { + node, + documentVariableName, + operationName, + operationResultType, + operationVariablesTypes, + hasRequiredVariables, + } = config; + const variables = `variables${hasRequiredVariables ? '' : '?'}: ${operationVariablesTypes}`; const hookConfig = this.visitor.queryMethodMap; diff --git a/packages/plugins/typescript/react-query/src/fetcher-fetch-hardcoded.ts b/packages/plugins/typescript/react-query/src/fetcher-fetch-hardcoded.ts index 21772ff2c..c0c15c356 100644 --- a/packages/plugins/typescript/react-query/src/fetcher-fetch-hardcoded.ts +++ b/packages/plugins/typescript/react-query/src/fetcher-fetch-hardcoded.ts @@ -1,7 +1,7 @@ import autoBind from 'auto-bind'; import { OperationDefinitionNode } from 'graphql'; import { HardcodedFetch } from './config.js'; -import { FetcherRenderer } from './fetcher.js'; +import { FetcherRenderer, type GenerateQueryHookConfig } from './fetcher.js'; import { ReactQueryVisitor } from './visitor.js'; export class HardcodedFetchFetcher extends FetcherRenderer { @@ -93,14 +93,16 @@ ${this.getFetchParams()} );`; } - generateQueryHook( - node: OperationDefinitionNode, - documentVariableName: string, - operationName: string, - operationResultType: string, - operationVariablesTypes: string, - hasRequiredVariables: boolean, - ): string { + generateQueryHook(config: GenerateQueryHookConfig): string { + const { + node, + documentVariableName, + operationName, + operationResultType, + operationVariablesTypes, + hasRequiredVariables, + } = config; + const variables = this.generateQueryVariablesSignature( hasRequiredVariables, operationVariablesTypes, diff --git a/packages/plugins/typescript/react-query/src/fetcher-fetch.ts b/packages/plugins/typescript/react-query/src/fetcher-fetch.ts index 84a05c678..530beb4ab 100644 --- a/packages/plugins/typescript/react-query/src/fetcher-fetch.ts +++ b/packages/plugins/typescript/react-query/src/fetcher-fetch.ts @@ -1,6 +1,6 @@ import autoBind from 'auto-bind'; import { OperationDefinitionNode } from 'graphql'; -import { FetcherRenderer } from './fetcher.js'; +import { FetcherRenderer, type GenerateQueryHookConfig } from './fetcher.js'; import { ReactQueryVisitor } from './visitor.js'; export class FetchFetcher extends FetcherRenderer { @@ -69,38 +69,17 @@ function fetcher(endpoint: string, requestInit: RequestInit, );`; } - generateQueryHook( - node: OperationDefinitionNode, - documentVariableName: string, - operationName: string, - operationResultType: string, - operationVariablesTypes: string, - hasRequiredVariables: boolean, - ): string { - const variables = this.generateQueryVariablesSignature( - hasRequiredVariables, - operationVariablesTypes, - ); - const hookConfig = this.visitor.queryMethodMap; - this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.query.hook); - this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.query.options); + generateQueryHook(config: GenerateQueryHookConfig): string { + const { generateBaseQueryHook, variables, options } = this.generateQueryHelper(config); - const options = `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`; + const { documentVariableName, operationResultType, operationVariablesTypes } = config; - return `export const use${operationName} = < - TData = ${operationResultType}, - TError = ${this.visitor.config.errorType} - >( - dataSource: { endpoint: string, fetchParams?: RequestInit }, + return generateBaseQueryHook({ + implArguments: `dataSource: { endpoint: string, fetchParams?: RequestInit }, ${variables}, - ${options} - ) => - ${hookConfig.query.hook}<${operationResultType}, TError, TData>( - ${this.generateQueryFormattedParameters( - this.generateQueryKey(node, hasRequiredVariables), - `fetcher<${operationResultType}, ${operationVariablesTypes}>(dataSource.endpoint, dataSource.fetchParams || {}, ${documentVariableName}, variables)`, - )} - );`; + ${options}`, + implFetcher: `fetcher<${operationResultType}, ${operationVariablesTypes}>(dataSource.endpoint, dataSource.fetchParams || {}, ${documentVariableName}, variables)`, + }); } generateMutationHook( diff --git a/packages/plugins/typescript/react-query/src/fetcher-graphql-request.ts b/packages/plugins/typescript/react-query/src/fetcher-graphql-request.ts index ebfe56494..69cebcff3 100644 --- a/packages/plugins/typescript/react-query/src/fetcher-graphql-request.ts +++ b/packages/plugins/typescript/react-query/src/fetcher-graphql-request.ts @@ -1,7 +1,7 @@ import autoBind from 'auto-bind'; import { OperationDefinitionNode } from 'graphql'; import { GraphQlRequest } from './config.js'; -import { FetcherRenderer } from './fetcher.js'; +import { FetcherRenderer, type GenerateQueryHookConfig } from './fetcher.js'; import { ReactQueryVisitor } from './visitor.js'; export class GraphQLRequestClientFetcher extends FetcherRenderer { @@ -92,14 +92,16 @@ function fetcher(client: Graph );`; } - generateQueryHook( - node: OperationDefinitionNode, - documentVariableName: string, - operationName: string, - operationResultType: string, - operationVariablesTypes: string, - hasRequiredVariables: boolean, - ): string { + generateQueryHook(config: GenerateQueryHookConfig): string { + const { + node, + documentVariableName, + operationName, + operationResultType, + operationVariablesTypes, + hasRequiredVariables, + } = config; + const variables = this.generateQueryVariablesSignature( hasRequiredVariables, operationVariablesTypes, diff --git a/packages/plugins/typescript/react-query/src/fetcher.ts b/packages/plugins/typescript/react-query/src/fetcher.ts index 6c25b76d6..467c030a9 100644 --- a/packages/plugins/typescript/react-query/src/fetcher.ts +++ b/packages/plugins/typescript/react-query/src/fetcher.ts @@ -2,12 +2,72 @@ import autoBind from 'auto-bind'; import { OperationDefinitionNode } from 'graphql'; import { ReactQueryVisitor } from './visitor.js'; +export interface GenerateQueryHookConfig { + node: OperationDefinitionNode; + documentVariableName: string; + operationName: string; + operationResultType: string; + operationVariablesTypes: string; + hasRequiredVariables: boolean; +} + export class BaseFetcherRenderer { constructor(protected visitor: ReactQueryVisitor) { autoBind(this); } - generateQueryHelper() {} + generateQueryHelper(config: GenerateQueryHookConfig) { + const { + node, + operationName, + operationResultType, + operationVariablesTypes, + hasRequiredVariables, + } = config; + + const variables = this.generateQueryVariablesSignature( + hasRequiredVariables, + operationVariablesTypes, + ); + const hookConfig = this.visitor.queryMethodMap; + this.visitor.reactQueryHookIdentifiersInUse.add(hookConfig.query.hook); + this.visitor.reactQueryOptionsIdentifiersInUse.add(hookConfig.query.options); + + const options = `options?: ${hookConfig.query.options}<${operationResultType}, TError, TData>`; + + const generateBaseQueryHook = (config: { + implArguments?: string; + implHookOuter?: string; + implFetcher: string; + }) => { + const { implArguments = '', implHookOuter = '', implFetcher = '' } = config; + + const argumentsResult = + implArguments ?? + `${variables}, + ${options}`; + + return `export const use${operationName} = < + TData = ${operationResultType}, + TError = ${this.visitor.config.errorType} + >( + ${argumentsResult} + ) => { + ${implHookOuter} + return ${hookConfig.query.hook}<${operationResultType}, TError, TData>( + ${this.generateQueryFormattedParameters( + this.generateQueryKey(node, hasRequiredVariables), + implFetcher, + )} + )};`; + }; + + return { + generateBaseQueryHook, + variables, + options, + }; + } generateQueryVariablesSignature( hasRequiredVariables: boolean, @@ -143,16 +203,10 @@ export class BaseFetcherRenderer { }`; } } + export abstract class FetcherRenderer extends BaseFetcherRenderer { abstract generateFetcherImplementation(): string; - abstract generateQueryHook( - node: OperationDefinitionNode, - documentVariableName: string, - operationName: string, - operationResultType: string, - operationVariablesTypes: string, - hasRequiredVariables: boolean, - ): string; + abstract generateQueryHook(config: GenerateQueryHookConfig): string; abstract generateInfiniteQueryHook( node: OperationDefinitionNode, documentVariableName: string, diff --git a/packages/plugins/typescript/react-query/src/visitor.ts b/packages/plugins/typescript/react-query/src/visitor.ts index e38d190ac..65a7ed745 100644 --- a/packages/plugins/typescript/react-query/src/visitor.ts +++ b/packages/plugins/typescript/react-query/src/visitor.ts @@ -188,14 +188,14 @@ export class ReactQueryVisitor extends ClientSideBaseVisitor< operationVariablesTypes = this._externalImportPrefix + operationVariablesTypes; if (operationType === 'Query') { - let query = this.fetcher.generateQueryHook( + let query = this.fetcher.generateQueryHook({ node, documentVariableName, operationName, operationResultType, operationVariablesTypes, hasRequiredVariables, - ); + }); if (this.config.exposeDocument) { query += `\nuse${operationName}.document = ${documentVariableName};\n`; } diff --git a/packages/plugins/typescript/react-query/tests/__snapshots__/react-query.spec.ts.snap b/packages/plugins/typescript/react-query/tests/__snapshots__/react-query.spec.ts.snap index e0f3591d0..bf8a778b8 100644 --- a/packages/plugins/typescript/react-query/tests/__snapshots__/react-query.spec.ts.snap +++ b/packages/plugins/typescript/react-query/tests/__snapshots__/react-query.spec.ts.snap @@ -24,12 +24,13 @@ export const useTestQuery = < dataSource: { endpoint: string, fetchParams?: RequestInit }, variables?: TestQueryVariables, options?: UseQueryOptions - ) => - useQuery( + ) => { + + return useQuery( variables === undefined ? ['test'] : ['test', variables], fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables), options - ); + )}; useTestQuery.getKey = (variables?: TestQueryVariables) => variables === undefined ? ['test'] : ['test', variables]; @@ -79,12 +80,13 @@ export const useTestQuery = < dataSource: { endpoint: string, fetchParams?: RequestInit }, variables?: TestQueryVariables, options?: UseQueryOptions - ) => - useQuery( + ) => { + + return useQuery( variables === undefined ? ['test'] : ['test', variables], fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables), options - ); + )}; useTestQuery.getKey = (variables?: TestQueryVariables) => variables === undefined ? ['test'] : ['test', variables]; @@ -152,12 +154,13 @@ export const useTestQuery = < dataSource: { endpoint: string, fetchParams?: RequestInit }, variables?: TestQueryVariables, options?: UseQueryOptions - ) => - useQuery( + ) => { + + return useQuery( variables === undefined ? ['test'] : ['test', variables], fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables), options - ); + )}; useTestQuery.rootKey = 'test'; @@ -206,12 +209,13 @@ export const useTestQuery = < dataSource: { endpoint: string, fetchParams?: RequestInit }, variables?: TestQueryVariables, options?: UseQueryOptions - ) => - useQuery( + ) => { + + return useQuery( variables === undefined ? ['test'] : ['test', variables], fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables), options - ); + )}; useTestQuery.rootKey = 'test'; @@ -350,7 +354,7 @@ export const useInfiniteTestQuery = < variables?: TTestQueryVariables, options?: UseInfiniteQueryOptions ) =>{ - + return useInfiniteQuery( variables === undefined ? ['test.infinite'] : ['test.infinite', variables], (metaData) => myCustomFetcher(TestDocument, {...variables, ...(metaData.pageParam ?? {})})(), @@ -422,7 +426,7 @@ export const useTestMutation = < );" `; -exports[`React-Query fetcher: fetch Should generate query and mutation correctly 1`] = ` +exports[`React-Query fetcher: fetch Should generate query and mutation correctly: content 1`] = ` " export const TestDocument = \` query test { @@ -446,12 +450,13 @@ export const useTestQuery = < dataSource: { endpoint: string, fetchParams?: RequestInit }, variables?: TTestQueryVariables, options?: UseQueryOptions - ) => - useQuery( + ) => { + + return useQuery( variables === undefined ? ['test'] : ['test', variables], fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables), options - ); + )}; export const TestDocument = \` mutation test($name: String) { submitRepository(repoFullName: $name) { @@ -473,6 +478,32 @@ export const useTestMutation = < );" `; +exports[`React-Query fetcher: fetch Should generate query and mutation correctly: prepend 1`] = ` +[ + "import { useQuery, useMutation, UseQueryOptions, UseMutationOptions } from 'react-query';", + " +function fetcher(endpoint: string, requestInit: RequestInit, query: string, variables?: TVariables) { + return async (): Promise => { + const res = await fetch(endpoint, { + method: 'POST', + ...requestInit, + body: JSON.stringify({ query, variables }), + }); + + const json = await res.json(); + + if (json.errors) { + const { message } = json.errors[0]; + + throw new Error(message); + } + + return json.data; + } +}", +] +`; + exports[`React-Query fetcher: graphql-request Should generate query correctly with client 1`] = ` " export const TestDocument = \` @@ -811,3 +842,170 @@ export const useTestMutation = < options );" `; + +exports[`React-Query support v4 syntax: content 1`] = ` +" +export const TestDocument = \` + query test { + feed { + id + commentCount + repository { + full_name + html_url + owner { + avatar_url + } + } + } +} + \`; +export const useTestQuery = < + TData = TestQuery, + TError = unknown + >( + dataSource: { endpoint: string, fetchParams?: RequestInit }, + variables?: TestQueryVariables, + options?: UseQueryOptions + ) => { + + return useQuery( + variables === undefined ? ['test'] : ['test', variables], + fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables), + options + )}; +export const useInfiniteTestQuery = < + TData = TestQuery, + TError = unknown + >( + dataSource: { endpoint: string, fetchParams?: RequestInit }, + variables?: TestQueryVariables, + options?: UseInfiniteQueryOptions + ) => + useInfiniteQuery( + variables === undefined ? ['test.infinite'] : ['test.infinite', variables], + (metaData) => fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, {...variables, ...(metaData.pageParam ?? {})})(), + options + ); + +export const TestDocument = \` + mutation test($name: String) { + submitRepository(repoFullName: $name) { + id + } +} + \`; +export const useTestMutation = < + TError = unknown, + TContext = unknown + >( + dataSource: { endpoint: string, fetchParams?: RequestInit }, + options?: UseMutationOptions + ) => + useMutation( + ['test'], + (variables?: TestMutationVariables) => fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables)(), + options + );" +`; + +exports[`React-Query support v4 syntax: prepend 1`] = ` +[ + "import { useQuery, useInfiniteQuery, useMutation, type UseQueryOptions, type UseInfiniteQueryOptions, type UseMutationOptions } from '@tanstack/react-query';", + " +function fetcher(endpoint: string, requestInit: RequestInit, query: string, variables?: TVariables) { + return async (): Promise => { + const res = await fetch(endpoint, { + method: 'POST', + ...requestInit, + body: JSON.stringify({ query, variables }), + }); + + const json = await res.json(); + + if (json.errors) { + const { message } = json.errors[0]; + + throw new Error(message); + } + + return json.data; + } +}", +] +`; + +exports[`React-Query support v5 syntax 1`] = ` +" +export const TestDocument = \` + query test { + feed { + id + commentCount + repository { + full_name + html_url + owner { + avatar_url + } + } + } +} + \`; +export const useTestQuery = < + TData = TestQuery, + TError = unknown + >( + dataSource: { endpoint: string, fetchParams?: RequestInit }, + variables?: TestQueryVariables, + options?: UseQueryOptions + ) => { + + return useQuery( + { + queryKey: variables === undefined ? ['test'] : ['test', variables], + queryFn: fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables), + ...options + } + )}; +export const useInfiniteTestQuery = < + TData = TestQuery, + TError = unknown + >( + dataSource: { endpoint: string, fetchParams?: RequestInit }, + variables: TestQueryVariables, + options: Omit, 'queryKey'> & { queryKey?: UseInfiniteQueryOptions['queryKey'] } + ) => + useInfiniteQuery( + (() => { + const { queryKey: optionsQueryKey, ...restOptions } = options; + return { + queryKey: optionsQueryKey ?? variables === undefined ? ['test.infinite'] : ['test.infinite', variables], + queryFn: (metaData) => fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, {...variables, ...(metaData.pageParam ?? {})})(), + ...restOptions + } + })() + ); + +export const TestDocument = \` + mutation test($name: String) { + submitRepository(repoFullName: $name) { + id + } +} + \`; +export const useTestMutation = < + TError = unknown, + TContext = unknown + >( + dataSource: { endpoint: string, fetchParams?: RequestInit }, + options?: UseMutationOptions + ) => + useMutation( + { + mutationKey: ['test'], + mutationFn: (variables?: TestMutationVariables) => fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables)(), + ...options + } + );" +`; diff --git a/packages/plugins/typescript/react-query/tests/react-query.spec.ts b/packages/plugins/typescript/react-query/tests/react-query.spec.ts index 45d7c17f4..184a74442 100644 --- a/packages/plugins/typescript/react-query/tests/react-query.spec.ts +++ b/packages/plugins/typescript/react-query/tests/react-query.spec.ts @@ -32,91 +32,9 @@ describe('React-Query', () => { const out = (await plugin(schema, docs, config)) as Types.ComplexPluginOutput; - expect(out.prepend).toEqual([ - `import { useQuery, useInfiniteQuery, useMutation, type UseQueryOptions, type UseInfiniteQueryOptions, type UseMutationOptions } from '@tanstack/react-query';`, - ` -function fetcher(endpoint: string, requestInit: RequestInit, query: string, variables?: TVariables) { - return async (): Promise => { - const res = await fetch(endpoint, { - method: 'POST', - ...requestInit, - body: JSON.stringify({ query, variables }), - }); - - const json = await res.json(); - - if (json.errors) { - const { message } = json.errors[0]; - - throw new Error(message); - } - - return json.data; - } -}`, - ]); - expect(out.content).toEqual(` -export const TestDocument = \` - query test { - feed { - id - commentCount - repository { - full_name - html_url - owner { - avatar_url - } - } - } -} - \`; -export const useTestQuery = < - TData = TestQuery, - TError = unknown - >( - dataSource: { endpoint: string, fetchParams?: RequestInit }, - variables?: TestQueryVariables, - options?: UseQueryOptions - ) => - useQuery( - variables === undefined ? ['test'] : ['test', variables], - fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables), - options - ); -export const useInfiniteTestQuery = < - TData = TestQuery, - TError = unknown - >( - dataSource: { endpoint: string, fetchParams?: RequestInit }, - variables?: TestQueryVariables, - options?: UseInfiniteQueryOptions - ) => - useInfiniteQuery( - variables === undefined ? ['test.infinite'] : ['test.infinite', variables], - (metaData) => fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, {...variables, ...(metaData.pageParam ?? {})})(), - options - ); - -export const TestDocument = \` - mutation test($name: String) { - submitRepository(repoFullName: $name) { - id - } -} - \`; -export const useTestMutation = < - TError = unknown, - TContext = unknown - >( - dataSource: { endpoint: string, fetchParams?: RequestInit }, - options?: UseMutationOptions - ) => - useMutation( - ['test'], - (variables?: TestMutationVariables) => fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables)(), - options - );`); + expect(out.prepend).toMatchSnapshot('prepend'); + expect(out.content).toMatchSnapshot('content'); + await validateTypeScript(mergeOutputs(out), schema, docs, config); }); it('should throw when using v5 config with legacyMode', async () => { @@ -140,55 +58,8 @@ export const useTestMutation = < const out = (await plugin(schema, docs, config)) as Types.ComplexPluginOutput; - expect(out.content).toBeSimilarStringTo(`export const useTestQuery = < - TData = TestQuery, - TError = unknown - >( - dataSource: { endpoint: string, fetchParams?: RequestInit }, - variables?: TestQueryVariables, - options?: UseQueryOptions - ) => - useQuery( - { - queryKey: variables === undefined ? ['test'] : ['test', variables], - queryFn: fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables), - ...options -} - );`); - - expect(out.content).toBeSimilarStringTo(`export const useInfiniteTestQuery = < - TData = TestQuery, - TError = unknown - >( - dataSource: { endpoint: string, fetchParams?: RequestInit }, - variables: TestQueryVariables, - options: Omit, 'queryKey'> & { queryKey?: UseInfiniteQueryOptions['queryKey'] } - ) => - useInfiniteQuery( - (() => { - const { queryKey: optionsQueryKey, ...restOptions } = options; - return { - queryKey: optionsQueryKey ?? variables === undefined ? ['test.infinite'] : ['test.infinite', variables], - queryFn: (metaData) => fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, {...variables, ...(metaData.pageParam ?? {})})(), - ...restOptions - } -})() - );`); - - expect(out.content).toBeSimilarStringTo(`export const useTestMutation = < - TError = unknown, - TContext = unknown - >( - dataSource: { endpoint: string, fetchParams?: RequestInit }, - options?: UseMutationOptions - ) => - useMutation( - { - mutationKey: ['test'], - mutationFn: (variables?: TestMutationVariables) => fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables)(), - ...options -} - );`); + expect(out.content).toMatchSnapshot(); + await validateTypeScript(mergeOutputs(out), schema, docs, config); }); it('Duplicated nested fragments are removed', async () => { @@ -1247,38 +1118,8 @@ export const useTestMutation = < const out = (await plugin(schema, docs, config)) as Types.ComplexPluginOutput; - expect(out.prepend).toContain( - `import { useQuery, useMutation, UseQueryOptions, UseMutationOptions } from 'react-query';`, - ); - - expect(out.content).toBeSimilarStringTo(`export const useTestQuery = < - TData = TTestQuery, - TError = unknown - >( - dataSource: { endpoint: string, fetchParams?: RequestInit }, - variables?: TTestQueryVariables, - options?: UseQueryOptions - ) => - useQuery( - variables === undefined ? ['test'] : ['test', variables], - fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables), - options - );`); - - expect(out.content).toBeSimilarStringTo(`export const useTestMutation = < - TError = unknown, - TContext = unknown - >( - dataSource: { endpoint: string, fetchParams?: RequestInit }, - options?: UseMutationOptions - ) => - useMutation( - ['test'], - (variables?: TTestMutationVariables) => fetcher(dataSource.endpoint, dataSource.fetchParams || {}, TestDocument, variables)(), - options - );`); - - expect(out.content).toMatchSnapshot(); + expect(out.prepend).toMatchSnapshot('prepend'); + expect(out.content).toMatchSnapshot('content'); await validateTypeScript(mergeOutputs(out), schema, docs, config); });