Add `@defer` directive support #9196

beerose · 2023-03-17T08:53:32Z

An extension PR to #8785. The main difference is that this PR generates a union of initial and deferred types instead of marking deferred types as optional. Reference: #8785 (comment)

Example in Hive: https://github.com/kamilkisiela/graphql-hive/compare/main...beerose:graphql-hive:add-defer?expand=1#diff-0defc8c1055b10af21b6f4dbf38e1ae168ce19de44dedb523676ce9034704782R173

Description

Found some legacy code and added more 🤡

Related #7885

Type of change

Please delete options that are not relevant.

Bug fix (non-breaking change which fixes an issue)
New feature (non-breaking change which adds functionality)
Breaking change (fix or feature that would cause existing functionality to not work as expected)
This change requires a documentation update

Screenshots/Sandbox (if appropriate/relevant):

Adding links to sandbox or providing screenshots can help us understand more about this PR and take action on it as appropriate

How Has This Been Tested?

Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration

Test A
Test B

Test Environment:

OS:
@graphql-codegen/...:
NodeJS:

Checklist:

I have followed the CONTRIBUTING doc and the style guidelines of this project
I have performed a self-review of my own code
I have commented my code, particularly in hard-to-understand areas
I have made corresponding changes to the documentation
My changes generate no new warnings
I have added tests that prove my fix is effective or that my feature works
New and existing unit tests pass locally with my changes
Any dependent changes have been merged and published in downstream modules

Further comments

If this is a relatively large or complex change, kick off the discussion by explaining why you chose the solution you did and what alternatives you considered, etc...

This commit takes a first pass at introducing `@defer` typescript codegen support. It follows a similar approach as the `@skip` / `@include` functionality introduced in #5017. Related issue: #7885

changeset-bot · 2023-03-17T08:53:35Z

🦋 Changeset detected

Latest commit: ccdac2a

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

github-actions · 2023-03-20T16:19:40Z

🚀 Snapshot Release (`alpha`)

The latest changes of this PR are available as alpha on npm (based on the declared changesets):

Package	Version	Info
`@graphql-codegen/visitor-plugin-common`	`3.2.0-alpha-20230501115039-7ad08f56b`	npm ↗︎ unpkg ↗︎
`@graphql-codegen/typescript-document-nodes`	`3.0.5-alpha-20230501115039-7ad08f56b`	npm ↗︎ unpkg ↗︎
`@graphql-codegen/gql-tag-operations`	`3.0.2-alpha-20230501115039-7ad08f56b`	npm ↗︎ unpkg ↗︎
`@graphql-codegen/typescript-operations`	`3.1.0-alpha-20230501115039-7ad08f56b`	npm ↗︎ unpkg ↗︎
`@graphql-codegen/typescript-resolvers`	`3.3.0-alpha-20230501115039-7ad08f56b`	npm ↗︎ unpkg ↗︎
`@graphql-codegen/typed-document-node`	`4.1.0-alpha-20230501115039-7ad08f56b`	npm ↗︎ unpkg ↗︎
`@graphql-codegen/typescript`	`3.1.0-alpha-20230501115039-7ad08f56b`	npm ↗︎ unpkg ↗︎
`@graphql-codegen/client-preset`	`3.1.0-alpha-20230501115039-7ad08f56b`	npm ↗︎ unpkg ↗︎
`@graphql-codegen/graphql-modules-preset`	`3.1.4-alpha-20230501115039-7ad08f56b`	npm ↗︎ unpkg ↗︎
`@graphql-codegen/plugin-helpers`	`4.2.1-alpha-20230501115039-7ad08f56b`	npm ↗︎ unpkg ↗︎

github-actions · 2023-03-20T16:26:57Z

💻 Website Preview

The latest changes are available as preview in: https://533e96b2.graphql-code-generator.pages.dev

examples/react/apollo-client-defer/src/App.tsx

github-actions · 2023-05-01T11:50:22Z

diff --git a/website/algolia-lockfile.json b/website/algolia-lockfile.json
index 0f7eb7c78..c7a013b40 100644
--- a/website/algolia-lockfile.json
+++ b/website/algolia-lockfile.json
@@ -2018,6 +2018,11 @@
                 "title": "Fragment Masking with nested Fragments",
                 "anchor": "fragment-masking-with-nested-fragments"
               },
+              {
+                "children": [],
+                "title": "Fragment Masking with @defer directive",
+                "anchor": "fragment-masking-with-defer-directive"
+              },
               {
                 "children": [],
                 "title": "Fragment Masking and testing",

2snEM6 · 2023-05-10T13:08:40Z

dev-test/gql-tag-operations-urql/gql/fragment-masking.ts

+  const fragName = fragDef?.name?.value;
+
+  const fields = fragName ? deferredFields[fragName] : [];
+  return fields.length > 0 && fields.every(field => data && field in data);


While testing the release candidate which includes this PR, I realised that if an user has noUncheckedIndexedAccess turned on in their tsconfig.son, the fields variable might be undefined, hence doing fields.length or fields.every fails and TS complains about it. Not sure how to fix this. Should I open an issue? Also apologies if this is not the place to comment about this.

@beerose

Thanks for the feedback! You can open an issue and I'll improve this function to work with noUncheckedIndexedAccess.

Here: #9383. Thanks @beerose! I am happy to help testing this if needed. Cheers!

Here's a fix: #9385

Here's a fix: #9385

Thanks!!

hwillson and others added 3 commits March 16, 2023 11:38

Add initial typescript @defer support

b2f1fe6

This commit takes a first pass at introducing `@defer` typescript codegen support. It follows a similar approach as the `@skip` / `@include` functionality introduced in #5017. Related issue: #7885

Add defer apollo example

9696d7e

Add union of initial and deferred fields

6658aaa

beerose added 2 commits March 20, 2023 17:11

Merge branch 'master' into defer-support

d03e08d

Update cypress version in example

b5443b1

beerose added 2 commits March 20, 2023 17:39

Fix ternary order

162269d

Refactor code a bit

65694a5

beerose force-pushed the defer-support branch from 29c7f95 to 7d24783 Compare March 20, 2023 18:08

Update tests

0d8a6b9

beerose force-pushed the defer-support branch from 7d24783 to 0d8a6b9 Compare March 20, 2023 18:12

beerose added 4 commits March 20, 2023 19:30

Fix handling __typename

982c511

Support avoidOptionals: true

0ccb06b

Update example

969e979

Merge branch 'master' into defer-support

4d56086

beerose force-pushed the defer-support branch 2 times, most recently from 6a733d6 to 3a8577e Compare March 21, 2023 17:33

Add MakeEmpty type

9e225d3

beerose force-pushed the defer-support branch from 3a8577e to 9e225d3 Compare March 21, 2023 17:41

Change test names

d68995d

beerose changed the title ~~WIP: Defer support~~ Add @defer directive support Mar 21, 2023

beerose changed the title ~~Add @defer directive support~~ Add @defer directive support Mar 21, 2023

Update example

43402e8

beerose marked this pull request as ready for review March 21, 2023 18:07

n1ru4l requested review from n1ru4l and saihaj March 22, 2023 08:03

beerose added 2 commits March 22, 2023 15:45

Add failing test

4fe8ca0

Modify example to contain a failing test

7b7e0a6

n1ru4l reviewed Apr 4, 2023

View reviewed changes

examples/react/apollo-client-defer/src/App.tsx Show resolved Hide resolved

beerose added 10 commits April 4, 2023 11:14

Use DocumentType in example

166708d

Merge branch 'master' into defer-support

ec9ac54

Renegrate example after merging master

c13d589

Update deps in new example

e530d34

Minor changes to defer related types

b435f6d

Add missing import

2cbe236

Fix type

c5d0247

Update examples

bd97073

Change isFragmentReady condition

1d451a8

Merge branch 'master' into defer-support

ce1e328

beerose requested a review from n1ru4l April 10, 2023 13:29

n1ru4l approved these changes Apr 11, 2023

View reviewed changes

beerose force-pushed the defer-support branch from 391f5cb to ce1e328 Compare April 20, 2023 20:19

beerose added 5 commits April 20, 2023 16:22

Merge branch 'master' into defer-support

82620d4

Merge branch 'master' into defer-support

8591cb8

Changeset

7af1241

changeset 2

ccdac2a

Add docs

7ad08f5

saihaj approved these changes May 1, 2023

View reviewed changes

beerose merged commit 3848a2b into master May 2, 2023

beerose deleted the defer-support branch May 2, 2023 08:20

beerose mentioned this pull request May 2, 2023

Add initial typescript @defer support #8785

Closed

theguild-bot mentioned this pull request May 2, 2023

Upcoming Release Changes #9355

Merged

2snEM6 mentioned this pull request May 9, 2023

[object Object] being generated when trying to use @defer on upcoming RC #9355 which merges #9196 #9381

Closed

2snEM6 reviewed May 10, 2023

View reviewed changes

2snEM6 mentioned this pull request May 10, 2023

Generated fragment-masking.ts is not compatible with noUncheckedIndexedAccess on upcoming RC #9383

Closed

alesso-x mentioned this pull request May 16, 2023

Support @defer and @stream in operations plugin #7885

Closed

beerose mentioned this pull request May 24, 2023

Update docs on @defer directive usage with GraphQL Code Generator apollographql/apollo-client#10910

Merged

3 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add `@defer` directive support #9196

Add `@defer` directive support #9196

beerose commented Mar 17, 2023 •

edited

Loading

changeset-bot bot commented Mar 17, 2023 •

edited

Loading

github-actions bot commented Mar 20, 2023 •

edited

Loading

github-actions bot commented Mar 20, 2023 •

edited

Loading

github-actions bot commented May 1, 2023

2snEM6 May 10, 2023

beerose May 10, 2023

2snEM6 May 10, 2023

beerose May 10, 2023

2snEM6 May 10, 2023

Add @defer directive support #9196

Add @defer directive support #9196

Conversation

beerose commented Mar 17, 2023 • edited Loading

Description

Type of change

Screenshots/Sandbox (if appropriate/relevant):

How Has This Been Tested?

Checklist:

Further comments

changeset-bot bot commented Mar 17, 2023 • edited Loading

🦋 Changeset detected

github-actions bot commented Mar 20, 2023 • edited Loading

🚀 Snapshot Release (alpha)

github-actions bot commented Mar 20, 2023 • edited Loading

💻 Website Preview

github-actions bot commented May 1, 2023

2snEM6 May 10, 2023

Choose a reason for hiding this comment

beerose May 10, 2023

Choose a reason for hiding this comment

2snEM6 May 10, 2023

Choose a reason for hiding this comment

beerose May 10, 2023

Choose a reason for hiding this comment

2snEM6 May 10, 2023

Choose a reason for hiding this comment

Add `@defer` directive support #9196

Add `@defer` directive support #9196

beerose commented Mar 17, 2023 •

edited

Loading

changeset-bot bot commented Mar 17, 2023 •

edited

Loading

github-actions bot commented Mar 20, 2023 •

edited

Loading

🚀 Snapshot Release (`alpha`)

github-actions bot commented Mar 20, 2023 •

edited

Loading