Skip to content

Commit d359d0b

Browse files
ludusrussobeeroseeddeee888
authored
feat: allow deferredFields works with fragment (#9565)
Co-authored-by: Aleksandra <alexsandra.sikora@gmail.com> Co-authored-by: Eddy Nguyen <ch@eddeee888.me>
1 parent 135ce4d commit d359d0b

File tree

3 files changed

+72
-8
lines changed

3 files changed

+72
-8
lines changed

packages/plugins/other/visitor-plugin-common/src/client-side-base-visitor.ts

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -398,7 +398,7 @@ export class ClientSideBaseVisitor<
398398
}
399399

400400
let metaString = '';
401-
if (this._onExecutableDocumentNode && node.kind === Kind.OPERATION_DEFINITION) {
401+
if (this._onExecutableDocumentNode) {
402402
const meta = this._getGraphQLCodegenMetadata(node, definitions);
403403

404404
if (meta) {
@@ -415,7 +415,9 @@ export class ClientSideBaseVisitor<
415415

416416
if (this.config.documentMode === DocumentMode.string) {
417417
if (node.kind === Kind.FRAGMENT_DEFINITION) {
418-
return `new TypedDocumentString(\`${doc}\`, ${JSON.stringify({ fragmentName: node.name.value })})`;
418+
const meta = this._getGraphQLCodegenMetadata(node, gqlTag([doc]).definitions);
419+
420+
return `new TypedDocumentString(\`${doc}\`, ${JSON.stringify({ fragmentName: node.name.value, ...meta })})`;
419421
}
420422

421423
if (this._onExecutableDocumentNode && node.kind === Kind.OPERATION_DEFINITION) {
@@ -438,15 +440,17 @@ export class ClientSideBaseVisitor<
438440
}
439441

440442
protected _getGraphQLCodegenMetadata(
441-
node: OperationDefinitionNode,
443+
node: OperationDefinitionNode | FragmentDefinitionNode,
442444
definitions?: ReadonlyArray<DefinitionNode>
443445
): Record<string, any> | void | undefined {
444446
let meta: Record<string, any> | void | undefined;
445447

446-
meta = this._onExecutableDocumentNode({
447-
kind: Kind.DOCUMENT,
448-
definitions,
449-
});
448+
if (node.kind === Kind.OPERATION_DEFINITION) {
449+
meta = this._onExecutableDocumentNode({
450+
kind: Kind.DOCUMENT,
451+
definitions,
452+
});
453+
}
450454

451455
const deferredFields = this._findDeferredFields(node);
452456
if (Object.keys(deferredFields).length) {
@@ -459,7 +463,9 @@ export class ClientSideBaseVisitor<
459463
return meta;
460464
}
461465

462-
protected _findDeferredFields(node: OperationDefinitionNode): { [fargmentName: string]: string[] } {
466+
protected _findDeferredFields(node: OperationDefinitionNode | FragmentDefinitionNode): {
467+
[fargmentName: string]: string[];
468+
} {
463469
const deferredFields: { [fargmentName: string]: string[] } = {};
464470
const queue: SelectionNode[] = [...node.selectionSet.selections];
465471
while (queue.length) {

packages/presets/client/tests/client-preset.spec.ts

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2289,8 +2289,14 @@ export * from "./gql.js";`);
22892289
22902290
export type FooFragment = { __typename?: 'Foo', id?: string | null } & ({ __typename?: 'Foo', value?: string | null } | { __typename?: 'Foo', value?: never }) & { ' $fragmentName'?: 'FooFragment' };
22912291
2292+
export type FooNestedFragment = { __typename?: 'Foo', id?: string | null } & (
2293+
{ __typename?: 'Foo' }
2294+
& { ' $fragmentRefs'?: { 'FooFragment': Incremental<FooFragment> } }
2295+
) & { ' $fragmentName'?: 'FooNestedFragment' };
2296+
22922297
export const FooFragmentDoc = {"kind":"Document","definitions":[{"kind":"FragmentDefinition","name":{"kind":"Name","value":"Foo"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"value"}}]}}]} as unknown as DocumentNode<FooFragment, unknown>;
22932298
export const FooFragmentDoc = {"kind":"Document","definitions":[{"kind":"FragmentDefinition","name":{"kind":"Name","value":"foo"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"directives":[{"kind":"Directive","name":{"kind":"Name","value":"defer"}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"value"}}]}}]}}]} as unknown as DocumentNode<FooFragment, unknown>;
2299+
export const FooNestedFragmentDoc = {"__meta__":{"deferredFields":{"foo":["id"]}},"kind":"Document","definitions":[{"kind":"FragmentDefinition","name":{"kind":"Name","value":"fooNested"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"FragmentSpread","name":{"kind":"Name","value":"foo"},"directives":[{"kind":"Directive","name":{"kind":"Name","value":"defer"}}]}]}},{"kind":"FragmentDefinition","name":{"kind":"Name","value":"foo"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"directives":[{"kind":"Directive","name":{"kind":"Name","value":"defer"}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"value"}}]}}]}}]} as unknown as DocumentNode<FooNestedFragment, unknown>;
22942300
export const FooDocument = {"__meta__":{"deferredFields":{"Foo":["value"]}},"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"Foo"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"foo"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"FragmentSpread","name":{"kind":"Name","value":"Foo"},"directives":[{"kind":"Directive","name":{"kind":"Name","value":"defer"}}]}]}}]}},{"kind":"FragmentDefinition","name":{"kind":"Name","value":"Foo"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"value"}}]}}]} as unknown as DocumentNode<FooQuery, FooQueryVariables>;
22952301
export const FoosDocument = {"__meta__":{"deferredFields":{"Foo":["value"]}},"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"Foos"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"foos"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"FragmentSpread","name":{"kind":"Name","value":"Foo"},"directives":[{"kind":"Directive","name":{"kind":"Name","value":"defer"}}]}]}}]}},{"kind":"FragmentDefinition","name":{"kind":"Name","value":"Foo"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"value"}}]}}]} as unknown as DocumentNode<FoosQuery, FoosQueryVariables>;"
22962302
`);
@@ -2374,8 +2380,14 @@ export * from "./gql.js";`);
23742380
23752381
export type FooFragment = { __typename?: 'Foo', id?: string | null } & ({ __typename?: 'Foo', value?: string | null } | { __typename?: 'Foo', value?: never }) & { ' $fragmentName'?: 'FooFragment' };
23762382
2383+
export type FooNestedFragment = { __typename?: 'Foo', id?: string | null } & (
2384+
{ __typename?: 'Foo' }
2385+
& { ' $fragmentRefs'?: { 'FooFragment': Incremental<FooFragment> } }
2386+
) & { ' $fragmentName'?: 'FooNestedFragment' };
2387+
23772388
export const FooFragmentDoc = {"kind":"Document","definitions":[{"kind":"FragmentDefinition","name":{"kind":"Name","value":"Foo"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"value"}}]}}]} as unknown as DocumentNode<FooFragment, unknown>;
23782389
export const FooFragmentDoc = {"kind":"Document","definitions":[{"kind":"FragmentDefinition","name":{"kind":"Name","value":"foo"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"directives":[{"kind":"Directive","name":{"kind":"Name","value":"defer"}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"value"}}]}}]}}]} as unknown as DocumentNode<FooFragment, unknown>;
2390+
export const FooNestedFragmentDoc = {"__meta__":{"deferredFields":{"foo":["id"]}},"kind":"Document","definitions":[{"kind":"FragmentDefinition","name":{"kind":"Name","value":"fooNested"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"FragmentSpread","name":{"kind":"Name","value":"foo"},"directives":[{"kind":"Directive","name":{"kind":"Name","value":"defer"}}]}]}},{"kind":"FragmentDefinition","name":{"kind":"Name","value":"foo"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"InlineFragment","typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"directives":[{"kind":"Directive","name":{"kind":"Name","value":"defer"}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"value"}}]}}]}}]} as unknown as DocumentNode<FooNestedFragment, unknown>;
23792391
export const FooDocument = {"__meta__":{"hash":"39c47d2da0fb0e6867abbe2ec942d9858f2d76c7","deferredFields":{"Foo":["value"]}},"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"Foo"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"foo"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"FragmentSpread","name":{"kind":"Name","value":"Foo"},"directives":[{"kind":"Directive","name":{"kind":"Name","value":"defer"}}]}]}}]}},{"kind":"FragmentDefinition","name":{"kind":"Name","value":"Foo"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"value"}}]}}]} as unknown as DocumentNode<FooQuery, FooQueryVariables>;
23802392
export const FoosDocument = {"__meta__":{"hash":"8aba765173b2302b9857334e9959d97a2168dbc8","deferredFields":{"Foo":["value"]}},"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"Foos"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"foos"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"FragmentSpread","name":{"kind":"Name","value":"Foo"},"directives":[{"kind":"Directive","name":{"kind":"Name","value":"defer"}}]}]}}]}},{"kind":"FragmentDefinition","name":{"kind":"Name","value":"Foo"},"typeCondition":{"kind":"NamedType","name":{"kind":"Name","value":"Foo"}},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"value"}}]}}]} as unknown as DocumentNode<FoosQuery, FoosQueryVariables>;"
23812393
`);
@@ -2459,6 +2471,11 @@ export * from "./gql.js";`);
24592471
24602472
export type FooFragment = { __typename?: 'Foo', id?: string | null } & ({ __typename?: 'Foo', value?: string | null } | { __typename?: 'Foo', value?: never }) & { ' $fragmentName'?: 'FooFragment' };
24612473
2474+
export type FooNestedFragment = { __typename?: 'Foo', id?: string | null } & (
2475+
{ __typename?: 'Foo' }
2476+
& { ' $fragmentRefs'?: { 'FooFragment': Incremental<FooFragment> } }
2477+
) & { ' $fragmentName'?: 'FooNestedFragment' };
2478+
24622479
export class TypedDocumentString<TResult, TVariables>
24632480
extends String
24642481
implements DocumentTypeDecoration<TResult, TVariables>
@@ -2490,6 +2507,20 @@ export * from "./gql.js";`);
24902507
}
24912508
}
24922509
\`, {"fragmentName":"foo"}) as unknown as TypedDocumentString<FooFragment, unknown>;
2510+
export const FooNestedFragmentDoc = new TypedDocumentString(\`
2511+
fragment fooNested on Foo {
2512+
id
2513+
...foo @defer
2514+
}
2515+
fragment Foo on Foo {
2516+
value
2517+
}
2518+
fragment foo on Foo {
2519+
id
2520+
... on Foo @defer {
2521+
value
2522+
}
2523+
}\`, {"fragmentName":"fooNested","deferredFields":{"foo":["id"]}}) as unknown as TypedDocumentString<FooNestedFragment, unknown>;
24932524
export const FooDocument = new TypedDocumentString(\`
24942525
query Foo {
24952526
foo {
@@ -2604,6 +2635,11 @@ export * from "./gql.js";`);
26042635
26052636
export type FooFragment = { __typename?: 'Foo', id?: string | null } & ({ __typename?: 'Foo', value?: string | null } | { __typename?: 'Foo', value?: never }) & { ' $fragmentName'?: 'FooFragment' };
26062637
2638+
export type FooNestedFragment = { __typename?: 'Foo', id?: string | null } & (
2639+
{ __typename?: 'Foo' }
2640+
& { ' $fragmentRefs'?: { 'FooFragment': Incremental<FooFragment> } }
2641+
) & { ' $fragmentName'?: 'FooNestedFragment' };
2642+
26072643
export class TypedDocumentString<TResult, TVariables>
26082644
extends String
26092645
implements DocumentTypeDecoration<TResult, TVariables>
@@ -2635,6 +2671,20 @@ export * from "./gql.js";`);
26352671
}
26362672
}
26372673
\`, {"fragmentName":"foo"}) as unknown as TypedDocumentString<FooFragment, unknown>;
2674+
export const FooNestedFragmentDoc = new TypedDocumentString(\`
2675+
fragment fooNested on Foo {
2676+
id
2677+
...foo @defer
2678+
}
2679+
fragment Foo on Foo {
2680+
value
2681+
}
2682+
fragment foo on Foo {
2683+
id
2684+
... on Foo @defer {
2685+
value
2686+
}
2687+
}\`, {"fragmentName":"fooNested","deferredFields":{"foo":["id"]}}) as unknown as TypedDocumentString<FooNestedFragment, unknown>;
26382688
export const FooDocument = new TypedDocumentString(\`
26392689
query Foo {
26402690
foo {

packages/presets/client/tests/fixtures/with-deferred-fragment.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,3 +34,11 @@ const NestedFragment = gql(/* GraphQL */ `
3434
}
3535
}
3636
`);
37+
38+
//@ts-ignore
39+
const NestedFragmentWithFragment = gql(/* GraphQL */ `
40+
fragment fooNested on Foo {
41+
id
42+
...foo @defer
43+
}
44+
`);

0 commit comments

Comments
 (0)