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

[2snEM6]

Which packages are impacted by your issue?

@graphql-codegen/visitor-plugin-common

Describe the bug

I am testing the upcoming release candidate (#9355) which merges #9196 as part of its new features.

When using the @defer directive, codegen generates a [object Object] instead of correct types.

Your Example Website or App

I can't disclose it

Steps to Reproduce the Bug or Issue

1. Given the following fragment

fragment TestFragment on InterviewType {
    id
    ... on InterviewType @defer {
      thumbnail
    }
  }

2. Generate types using the cli and the client-preset with the following settings:

const config: CodegenConfig = {
    ignoreNoDocuments: true, // for better experience with the watcher
    generates: {
        './src/generated/graphql/': {
            documents: ['src/shared/**/*.graphql', 'src/shared/**/*.ts*'],
            preset: 'client',
            presetConfig: {
                fragmentMasking: { unmaskFunctionName: 'getFragmentData'},
            },
            config: {
                scalars: {
                    JSON: 'Record<string, unknown>',
                    Upload: 'File',
                },
                useTypeImports: true,
                strictScalars: true,
            }
        },
    },
}

3. Check the generated type:

export type TestFragmentFragment = { __typename?: 'InterviewType', id?: string | null } & [object Object] & { ' $fragmentName'?: 'TestFragmentFragment' };

Expected behavior

As a user I expected correct generated types when using the @defer directive, but instead the following is being generated:

export type TestFragmentFragment = { __typename?: 'InterviewType', id?: string | null } & [object Object] & { ' $fragmentName'?: 'TestFragmentFragment' };

Screenshots or Videos

No response

Platform

• OS: macOS
• NodeJS: 18
• graphql version: 16.6.0
• @graphql-codegen/* version(s):
  @graphql-codegen/cli@3.3.0
@graphql-codegen/client-preset@3.1.0-rc-20230509132732-3d0b5feb2

Codegen Config File

import { CodegenConfig } from '@graphql-codegen/cli'


const config: CodegenConfig = {
    schema: "", // whatever
    ignoreNoDocuments: true, // for better experience with the watcher
    generates: {
        './src/shared/generated/graphql/': {
            documents: ['src/shared/**/*.graphql', 'src/shared/**/*.ts*'],
            preset: 'client',
            presetConfig: {
                fragmentMasking: { unmaskFunctionName: 'getFragmentData'},
            },
            config: {
                scalars: {
                    JSON: 'Record<string, unknown>',
                    Upload: 'File',
                },
                useTypeImports: true,
                strictScalars: true,
            }
        },
    },
}

export default config;

Additional context

No response

[charpeni]

I've been able to reproduce it.

It is working fine within a query, but as soon as the @defer directive is used within a fragment, it produces [object Object].

[beerose]

Fixed in #9384