commit 034628ec3b728a8928eeb512704c145b95525343 · kitten.sh/graphqlsp

.changeset/swift-ghosts-end.md

···

       1
       1
       +
       ---

     

       2
       2
       +
       '@0no-co/graphqlsp': patch

     

       3
       3
       +
       ---

     

       4
       4
       +
       

     

       5
       5
       +
       Correctly identify missing fragments for gql.tada graphql call-expressions

+1 -1

.github/workflows/release.yaml

···

       30
       30
        
             - name: Setup pnpm

     

       31
       31
        
               uses: pnpm/action-setup@v3

     

       32
       32
        
               with:

     

       33
       33
       -
                 version: 9

     

       33
       33
       +
                 version: 8.6.1

     

       34
       34
        
                 run_install: false

     

       35
       35
        
       

     

       36
       36
        
             - name: Get pnpm store directory

+10 -1

packages/example-tada/src/index.tsx

···

       32
       32
        
         }

     

       33
       33
        
       `, [PokemonFields, Fields.Pokemon])

     

       34
       34
        
       

     

       35
       35
       -
       const persisted = graphql.persisted<typeof PokemonQuery>("sha256:78c769ed6cfef67e17e579a2abfe4da27bd51e09ed832a88393148bcce4c5a7d")

     

       35
       35
       +
       const Test = graphql(`

     

       36
       36
       +
         query Po($id: ID!) {

     

       37
       37
       +
           pokemon(id: $id) {

     

       38
       38
       +
             id

     

       39
       39
       +
             fleeRate

     

       40
       40
       +
             ...Pok

     

       41
       41
       +
             ...pokemonFields

     

       42
       42
       +
           }

     

       43
       43
       +
         }

     

       44
       44
       +
       `, [])

     

       36
       45
        
       

     

       37
       46
        
       const Pokemons = () => {

     

       38
       47
        
         const [result] = useQuery({

+19 -5

packages/graphqlsp/src/ast/index.ts

···

       68
       68
        
         return checks.isGraphQLCall(value, checker) ? value : null;

     

       69
       69
        
       }

     

       70
       70
        
       

     

       71
       71
       -
       function unrollFragment(

     

       71
       71
       +
       export function unrollFragment(

     

       72
       72
        
         element: ts.Identifier,

     

       73
       73
        
         info: ts.server.PluginCreateInfo,

     

       74
       74
        
         checker: ts.TypeChecker | undefined

     
···

       135
       135
        
         nodes: Array<{

     

       136
       136
        
           node: ts.StringLiteralLike;

     

       137
       137
        
           schema: string | null;

     

       138
       138
       +
           // For gql.tada call-expressions, this contains the identifiers of explicitly declared fragments

     

       139
       139
       +
           tadaFragmentRefs?: readonly ts.Identifier[] | null;

     

       138
       140
        
         }>;

     

       139
       141
        
         fragments: Array<FragmentDefinitionNode>;

     

       140
       142
        
       } {

     
···

       142
       144
        
         const result: Array<{

     

       143
       145
        
           node: ts.StringLiteralLike;

     

       144
       146
        
           schema: string | null;

     

       147
       147
       +
           tadaFragmentRefs?: readonly ts.Identifier[];

     

       145
       148
        
         }> = [];

     

       146
       149
        
         let fragments: Array<FragmentDefinitionNode> = [];

     

       147
       150
        
         let hasTriedToFindFragments = shouldSearchFragments ? false : true;

     
···

       160
       163
        
           const name = checks.getSchemaName(node, typeChecker);

     

       161
       164
        
           const text = node.arguments[0];

     

       162
       165
        
           const fragmentRefs = resolveTadaFragmentArray(node.arguments[1]);

     

       166
       166
       +
           const isTadaCall = checks.isTadaGraphQLCall(node, typeChecker);

     

       163
       167
        
       

     

       164
       168
        
           if (!hasTriedToFindFragments && !fragmentRefs) {

     

       165
       165
       -
             hasTriedToFindFragments = true;

     

       166
       166
       -
             fragments.push(...getAllFragments(sourceFile.fileName, node, info));

     

       169
       169
       +
             // Only collect global fragments if this is NOT a gql.tada call

     

       170
       170
       +
             if (!isTadaCall) {

     

       171
       171
       +
               hasTriedToFindFragments = true;

     

       172
       172
       +
               fragments.push(...getAllFragments(node, info));

     

       173
       173
       +
             }

     

       167
       174
        
           } else if (fragmentRefs) {

     

       168
       175
        
             for (const identifier of fragmentRefs) {

     

       169
       176
        
               fragments.push(...unrollFragment(identifier, info, typeChecker));

     
···

       171
       178
        
           }

     

       172
       179
        
       

     

       173
       180
        
           if (text && ts.isStringLiteralLike(text)) {

     

       174
       174
       -
             result.push({ node: text, schema: name });

     

       181
       181
       +
             result.push({

     

       182
       182
       +
               node: text,

     

       183
       183
       +
               schema: name,

     

       184
       184
       +
               tadaFragmentRefs: isTadaCall

     

       185
       185
       +
                 ? fragmentRefs === undefined

     

       186
       186
       +
                   ? []

     

       187
       187
       +
                   : fragmentRefs

     

       188
       188
       +
                 : undefined,

     

       189
       189
       +
             });

     

       175
       190
        
           }

     

       176
       191
        
         }

     

       177
       192
        
         find(sourceFile);

     
···

       213
       228
        
       }

     

       214
       229
        
       

     

       215
       230
        
       export function getAllFragments(

     

       216
       216
       -
         fileName: string,

     

       217
       231
        
         node: ts.Node,

     

       218
       232
        
         info: ts.server.PluginCreateInfo

     

       219
       233
        
       ) {

+1 -1

packages/graphqlsp/src/autoComplete.ts

···

       66
       66
        
             return undefined;

     

       67
       67
        
       

     

       68
       68
        
           const queryText = node.arguments[0].getText().slice(1, -1);

     

       69
       69
       -
           const fragments = getAllFragments(filename, node, info);

     

       69
       69
       +
           const fragments = getAllFragments(node, info);

     

       70
       70
        
       

     

       71
       71
        
           text = `${queryText}\n${fragments.map(x => print(x)).join('\n')}`;

     

       72
       72
        
           cursor = new Cursor(foundToken.line, foundToken.start - 1);

+17

packages/graphqlsp/src/diagnostics.ts

···

       16
       16
        
         findAllPersistedCallExpressions,

     

       17
       17
        
         findAllTaggedTemplateNodes,

     

       18
       18
        
         getSource,

     

       19
       19
       +
         unrollFragment,

     

       19
       20
        
       } from './ast';

     

       20
       21
        
       import { resolveTemplate } from './ast/resolve';

     

       21
       22
        
       import { UNUSED_FIELD_CODE, checkFieldUsageInFile } from './fieldUsage';

     
···

       344
       345
        
           nodes: {

     

       345
       346
        
             node: ts.TaggedTemplateExpression | ts.StringLiteralLike;

     

       346
       347
        
             schema: string | null;

     

       348
       348
       +
             tadaFragmentRefs?: readonly ts.Identifier[];

     

       347
       349
        
           }[];

     

       348
       350
        
           fragments: FragmentDefinitionNode[];

     

       349
       351
        
         },

     
···

       352
       354
        
       ): ts.Diagnostic[] => {

     

       353
       355
        
         const filename = source.fileName;

     

       354
       356
        
         const isCallExpression = info.config.templateIsCallExpression ?? true;

     

       357
       357
       +
         const typeChecker = info.languageService.getProgram()?.getTypeChecker();

     

       355
       358
        
       

     

       356
       359
        
         const diagnostics = nodes

     

       357
       360
        
           .map(originalNode => {

     
···

       394
       397
        
                   (isExpression ? 2 : 0));

     

       395
       398
        
             const endPosition = startingPosition + node.getText().length;

     

       396
       399
        
             let docFragments = [...fragments];

     

       400
       400
       +
       

     

       401
       401
       +
             if (originalNode.tadaFragmentRefs !== undefined) {

     

       402
       402
       +
               const fragmentNames = new Set<string>();

     

       403
       403
       +
               for (const identifier of originalNode.tadaFragmentRefs) {

     

       404
       404
       +
                 const unrolled = unrollFragment(identifier, info, typeChecker);

     

       405
       405
       +
                 unrolled.forEach((frag: FragmentDefinitionNode) =>

     

       406
       406
       +
                   fragmentNames.add(frag.name.value)

     

       407
       407
       +
                 );

     

       408
       408
       +
               }

     

       409
       409
       +
               docFragments = docFragments.filter(frag =>

     

       410
       410
       +
                 fragmentNames.has(frag.name.value)

     

       411
       411
       +
               );

     

       412
       412
       +
             }

     

       413
       413
       +
       

     

       397
       414
        
             if (isCallExpression) {

     

       398
       415
        
               try {

     

       399
       416
        
                 const documentFragments = parse(text, {

+33

test/e2e/fixture-project-tada/fixtures/missing-fragment-dep.ts

···

       1
       1
       +
       import { graphql } from './graphql';

     

       2
       2
       +
       

     

       3
       3
       +
       const pokemonFragment = graphql(`

     

       4
       4
       +
         fragment PokemonBasicInfo on Pokemon {

     

       5
       5
       +
           id

     

       6
       6
       +
           name

     

       7
       7
       +
         }

     

       8
       8
       +
       `);

     

       9
       9
       +
       

     

       10
       10
       +
       // This query correctly includes the fragment as a dep

     

       11
       11
       +
       const FirstQuery = graphql(

     

       12
       12
       +
         `

     

       13
       13
       +
           query FirstQuery {

     

       14
       14
       +
             pokemons(limit: 1) {

     

       15
       15
       +
               ...PokemonBasicInfo

     

       16
       16
       +
             }

     

       17
       17
       +
           }

     

       18
       18
       +
         `,

     

       19
       19
       +
         [pokemonFragment]

     

       20
       20
       +
       );

     

       21
       21
       +
       

     

       22
       22
       +
       // This query uses the fragment but DOES NOT include it as a dep

     

       23
       23
       +
       // It should show an error, but currently doesn't because the fragment

     

       24
       24
       +
       // was already added as a dep in FirstQuery above

     

       25
       25
       +
       const SecondQuery = graphql(`

     

       26
       26
       +
         query SecondQuery {

     

       27
       27
       +
           pokemons(limit: 2) {

     

       28
       28
       +
             ...PokemonBasicInfo

     

       29
       29
       +
           }

     

       30
       30
       +
         }

     

       31
       31
       +
       `);

     

       32
       32
       +
       

     

       33
       33
       +
       export { FirstQuery, SecondQuery };

+71

test/e2e/tada.test.ts

···

       619
       619
        
           `);

     

       620
       620
        
         }, 30000);

     

       621
       621
        
       });

     

       622
       622
       +
       

     

       623
       623
       +
       describe('Fragment dependencies - Issue #494', () => {

     

       624
       624
       +
         const projectPath = path.resolve(__dirname, 'fixture-project-tada');

     

       625
       625
       +
         const outfileMissingFragmentDep = path.join(

     

       626
       626
       +
           projectPath,

     

       627
       627
       +
           'missing-fragment-dep.ts'

     

       628
       628
       +
         );

     

       629
       629
       +
       

     

       630
       630
       +
         let server: TSServer;

     

       631
       631
       +
         beforeAll(async () => {

     

       632
       632
       +
           server = new TSServer(projectPath, { debugLog: false });

     

       633
       633
       +
       

     

       634
       634
       +
           server.sendCommand('open', {

     

       635
       635
       +
             file: outfileMissingFragmentDep,

     

       636
       636
       +
             fileContent: '// empty',

     

       637
       637
       +
             scriptKindName: 'TS',

     

       638
       638
       +
           } satisfies ts.server.protocol.OpenRequestArgs);

     

       639
       639
       +
       

     

       640
       640
       +
           server.sendCommand('updateOpen', {

     

       641
       641
       +
             openFiles: [

     

       642
       642
       +
               {

     

       643
       643
       +
                 file: outfileMissingFragmentDep,

     

       644
       644
       +
                 fileContent: fs.readFileSync(

     

       645
       645
       +
                   path.join(projectPath, 'fixtures/missing-fragment-dep.ts'),

     

       646
       646
       +
                   'utf-8'

     

       647
       647
       +
                 ),

     

       648
       648
       +
               },

     

       649
       649
       +
             ],

     

       650
       650
       +
           } satisfies ts.server.protocol.UpdateOpenRequestArgs);

     

       651
       651
       +
       

     

       652
       652
       +
           server.sendCommand('saveto', {

     

       653
       653
       +
             file: outfileMissingFragmentDep,

     

       654
       654
       +
             tmpfile: outfileMissingFragmentDep,

     

       655
       655
       +
           } satisfies ts.server.protocol.SavetoRequestArgs);

     

       656
       656
       +
         });

     

       657
       657
       +
       

     

       658
       658
       +
         afterAll(() => {

     

       659
       659
       +
           try {

     

       660
       660
       +
             fs.unlinkSync(outfileMissingFragmentDep);

     

       661
       661
       +
           } catch {}

     

       662
       662
       +
         });

     

       663
       663
       +
       

     

       664
       664
       +
         it('warns about missing fragment dep even when fragment is used in another query in same file', async () => {

     

       665
       665
       +
           await server.waitForResponse(

     

       666
       666
       +
             e =>

     

       667
       667
       +
               e.type === 'event' &&

     

       668
       668
       +
               e.event === 'semanticDiag' &&

     

       669
       669
       +
               e.body?.file === outfileMissingFragmentDep

     

       670
       670
       +
           );

     

       671
       671
       +
       

     

       672
       672
       +
           const res = server.responses.filter(

     

       673
       673
       +
             resp =>

     

       674
       674
       +
               resp.type === 'event' &&

     

       675
       675
       +
               resp.event === 'semanticDiag' &&

     

       676
       676
       +
               resp.body?.file === outfileMissingFragmentDep

     

       677
       677
       +
           );

     

       678
       678
       +
       

     

       679
       679
       +
           // Should have a diagnostic about the unknown fragment in SecondQuery

     

       680
       680
       +
           expect(res.length).toBeGreaterThan(0);

     

       681
       681
       +
           expect(res[0].body.diagnostics.length).toBeGreaterThan(0);

     

       682
       682
       +
       

     

       683
       683
       +
           const fragmentError = res[0].body.diagnostics.find((diag: any) =>

     

       684
       684
       +
             diag.text.includes('PokemonBasicInfo')

     

       685
       685
       +
           );

     

       686
       686
       +
       

     

       687
       687
       +
           expect(fragmentError).toBeDefined();

     

       688
       688
       +
           expect(fragmentError.text).toBe('Unknown fragment "PokemonBasicInfo".');

     

       689
       689
       +
           expect(fragmentError.code).toBe(52001);

     

       690
       690
       +
           expect(fragmentError.category).toBe('error');

     

       691
       691
       +
         }, 30000);

     

       692
       692
       +
       });