Skip to content

Commit 524817a

Browse files
cameron-martinfreiksenet
cameron-martin
authored and
freiksenet
committed
fix(gatsby): Find identifiers only in the first argument when extracting queries from useStaticQuery (#14362)
* Find identifiers only in the first argument when extracting queries from useStaticQuery. Previously it traversed the whole CallExpression for identifiers and it was picking up identifiers used as type parameters. Fixes #14345. * Added unit tests for useStaticQuery when first argument is a variable. * Renamed tests to be consistent.
1 parent 56647bc commit 524817a

File tree

3 files changed

+340
-34
lines changed

3 files changed

+340
-34
lines changed

‎packages/gatsby/src/query/__tests__/__snapshots__/file-parser.js.snap

+268
Original file line numberDiff line numberDiff line change
@@ -972,6 +972,248 @@ Map {
972972
],
973973
"kind": "Document",
974974
},
975+
"static-query-hooks.js" => Object {
976+
"definitions": Array [
977+
Object {
978+
"directives": Array [],
979+
"hash": 407706182,
980+
"isHook": true,
981+
"isStaticQuery": true,
982+
"kind": "OperationDefinition",
983+
"loc": Object {
984+
"end": 29,
985+
"start": 0,
986+
},
987+
"name": Object {
988+
"kind": "Name",
989+
"loc": Object {
990+
"end": 21,
991+
"start": 6,
992+
},
993+
"value": "StaticQueryName",
994+
},
995+
"operation": "query",
996+
"selectionSet": Object {
997+
"kind": "SelectionSet",
998+
"loc": Object {
999+
"end": 29,
1000+
"start": 22,
1001+
},
1002+
"selections": Array [
1003+
Object {
1004+
"alias": undefined,
1005+
"arguments": Array [],
1006+
"directives": Array [],
1007+
"kind": "Field",
1008+
"loc": Object {
1009+
"end": 27,
1010+
"start": 24,
1011+
},
1012+
"name": Object {
1013+
"kind": "Name",
1014+
"loc": Object {
1015+
"end": 27,
1016+
"start": 24,
1017+
},
1018+
"value": "foo",
1019+
},
1020+
"selectionSet": undefined,
1021+
},
1022+
],
1023+
},
1024+
"text": "query StaticQueryName { foo }",
1025+
"variableDefinitions": Array [],
1026+
},
1027+
],
1028+
"kind": "Document",
1029+
},
1030+
"static-query-hooks-with-type-parameter.ts" => Object {
1031+
"definitions": Array [
1032+
Object {
1033+
"directives": Array [],
1034+
"hash": 407706182,
1035+
"isHook": true,
1036+
"isStaticQuery": true,
1037+
"kind": "OperationDefinition",
1038+
"loc": Object {
1039+
"end": 29,
1040+
"start": 0,
1041+
},
1042+
"name": Object {
1043+
"kind": "Name",
1044+
"loc": Object {
1045+
"end": 21,
1046+
"start": 6,
1047+
},
1048+
"value": "StaticQueryName",
1049+
},
1050+
"operation": "query",
1051+
"selectionSet": Object {
1052+
"kind": "SelectionSet",
1053+
"loc": Object {
1054+
"end": 29,
1055+
"start": 22,
1056+
},
1057+
"selections": Array [
1058+
Object {
1059+
"alias": undefined,
1060+
"arguments": Array [],
1061+
"directives": Array [],
1062+
"kind": "Field",
1063+
"loc": Object {
1064+
"end": 27,
1065+
"start": 24,
1066+
},
1067+
"name": Object {
1068+
"kind": "Name",
1069+
"loc": Object {
1070+
"end": 27,
1071+
"start": 24,
1072+
},
1073+
"value": "foo",
1074+
},
1075+
"selectionSet": undefined,
1076+
},
1077+
],
1078+
},
1079+
"text": "query StaticQueryName { foo }",
1080+
"variableDefinitions": Array [],
1081+
},
1082+
],
1083+
"kind": "Document",
1084+
},
1085+
"static-query-hooks-in-separate-variable.js" => Object {
1086+
"definitions": Array [
1087+
Object {
1088+
"directives": Array [],
1089+
"hash": 3748317405,
1090+
"isHook": true,
1091+
"isStaticQuery": true,
1092+
"kind": "OperationDefinition",
1093+
"loc": Object {
1094+
"end": 47,
1095+
"start": 0,
1096+
},
1097+
"name": Object {
1098+
"kind": "Name",
1099+
"value": "staticQueryHooksInSeparateVariableJs3748317405",
1100+
},
1101+
"operation": "query",
1102+
"selectionSet": Object {
1103+
"kind": "SelectionSet",
1104+
"loc": Object {
1105+
"end": 47,
1106+
"start": 0,
1107+
},
1108+
"selections": Array [
1109+
Object {
1110+
"alias": undefined,
1111+
"arguments": Array [],
1112+
"directives": Array [],
1113+
"kind": "Field",
1114+
"loc": Object {
1115+
"end": 46,
1116+
"start": 2,
1117+
},
1118+
"name": Object {
1119+
"kind": "Name",
1120+
"loc": Object {
1121+
"end": 19,
1122+
"start": 2,
1123+
},
1124+
"value": "allMarkdownRemark",
1125+
},
1126+
"selectionSet": Object {
1127+
"kind": "SelectionSet",
1128+
"loc": Object {
1129+
"end": 46,
1130+
"start": 20,
1131+
},
1132+
"selections": Array [
1133+
Object {
1134+
"alias": undefined,
1135+
"arguments": Array [],
1136+
"directives": Array [],
1137+
"kind": "Field",
1138+
"loc": Object {
1139+
"end": 45,
1140+
"start": 22,
1141+
},
1142+
"name": Object {
1143+
"kind": "Name",
1144+
"loc": Object {
1145+
"end": 26,
1146+
"start": 22,
1147+
},
1148+
"value": "blah",
1149+
},
1150+
"selectionSet": Object {
1151+
"kind": "SelectionSet",
1152+
"loc": Object {
1153+
"end": 45,
1154+
"start": 27,
1155+
},
1156+
"selections": Array [
1157+
Object {
1158+
"alias": undefined,
1159+
"arguments": Array [],
1160+
"directives": Array [],
1161+
"kind": "Field",
1162+
"loc": Object {
1163+
"end": 44,
1164+
"start": 29,
1165+
},
1166+
"name": Object {
1167+
"kind": "Name",
1168+
"loc": Object {
1169+
"end": 33,
1170+
"start": 29,
1171+
},
1172+
"value": "node",
1173+
},
1174+
"selectionSet": Object {
1175+
"kind": "SelectionSet",
1176+
"loc": Object {
1177+
"end": 44,
1178+
"start": 34,
1179+
},
1180+
"selections": Array [
1181+
Object {
1182+
"alias": undefined,
1183+
"arguments": Array [],
1184+
"directives": Array [],
1185+
"kind": "Field",
1186+
"loc": Object {
1187+
"end": 42,
1188+
"start": 36,
1189+
},
1190+
"name": Object {
1191+
"kind": "Name",
1192+
"loc": Object {
1193+
"end": 42,
1194+
"start": 36,
1195+
},
1196+
"value": "cheese",
1197+
},
1198+
"selectionSet": undefined,
1199+
},
1200+
],
1201+
},
1202+
},
1203+
],
1204+
},
1205+
},
1206+
],
1207+
},
1208+
},
1209+
],
1210+
},
1211+
"text": "{ allMarkdownRemark { blah { node { cheese }}}}",
1212+
"variableDefinitions": Array [],
1213+
},
1214+
],
1215+
"kind": "Document",
1216+
},
9751217
}
9761218
`;
9771219

@@ -994,6 +1236,24 @@ We were unable to find the declaration of variable \\"strangeQueryName\\", which
9941236
Perhaps the variable name has a typo?
9951237
9961238
Also note that we are currently unable to use queries defined in files other than the file where the <StaticQuery> is defined. If you're attempting to import the query, please move it into \\"query-imported.js\\". If being able to import queries from another file is an important capability for you, we invite your help fixing it.
1239+
",
1240+
],
1241+
Array [
1242+
"
1243+
We were unable to find the declaration of variable \\"strangeQueryName\\", which you passed as the \\"query\\" prop into the useStaticQuery declaration in \\"static-query-hooks-not-defined.js\\".
1244+
1245+
Perhaps the variable name has a typo?
1246+
1247+
Also note that we are currently unable to use queries defined in files other than the file where the useStaticQuery is defined. If you're attempting to import the query, please move it into \\"static-query-hooks-not-defined.js\\". If being able to import queries from another file is an important capability for you, we invite your help fixing it.
1248+
",
1249+
],
1250+
Array [
1251+
"
1252+
We were unable to find the declaration of variable \\"strangeQueryName\\", which you passed as the \\"query\\" prop into the useStaticQuery declaration in \\"static-query-hooks-imported.js\\".
1253+
1254+
Perhaps the variable name has a typo?
1255+
1256+
Also note that we are currently unable to use queries defined in files other than the file where the useStaticQuery is defined. If you're attempting to import the query, please move it into \\"static-query-hooks-imported.js\\". If being able to import queries from another file is an important capability for you, we invite your help fixing it.
9971257
",
9981258
],
9991259
],
@@ -1006,6 +1266,14 @@ Also note that we are currently unable to use queries defined in files other tha
10061266
"type": "return",
10071267
"value": undefined,
10081268
},
1269+
Object {
1270+
"type": "return",
1271+
"value": undefined,
1272+
},
1273+
Object {
1274+
"type": "return",
1275+
"value": undefined,
1276+
},
10091277
],
10101278
}
10111279
`;

‎packages/gatsby/src/query/__tests__/file-parser.js

+39
Original file line numberDiff line numberDiff line change
@@ -143,6 +143,45 @@ export default () => (
143143
render={data => <div>{data.pizza}</div>}
144144
/>
145145
)`,
146+
"static-query-hooks.js": `import { graphql, useStaticQuery } from 'gatsby'
147+
export default () => {
148+
const data = useStaticQuery(graphql\`query StaticQueryName { foo }\`);
149+
return <div>{data.doo}</div>;
150+
}`,
151+
"static-query-hooks-with-type-parameter.ts": `import { graphql, useStaticQuery } from 'gatsby'
152+
export default () => {
153+
const data = useStaticQuery<HomepageQuery>(graphql\`query StaticQueryName { foo }\`);
154+
return <div>{data.doo}</div>;
155+
}`,
156+
"static-query-hooks-missing-argument.js": `import { graphql, useStaticQuery } from 'gatsby'
157+
export default () => {
158+
const data = useStaticQuery();
159+
return <div>{data.doo}</div>;
160+
}`,
161+
"static-query-hooks-in-separate-variable.js": `import React from "react"
162+
import { useStaticQuery, graphql } from "gatsby"
163+
164+
const query = graphql\`{ allMarkdownRemark { blah { node { cheese }}}}\`
165+
166+
export default () => {
167+
const data = useStaticQuery(query);
168+
return <div>{data.doo}</div>;
169+
}`,
170+
"static-query-hooks-not-defined.js": `import React from "react"
171+
import { useStaticQuery, graphql } from "gatsby"
172+
173+
export default () => {
174+
const data = useStaticQuery(strangeQueryName);
175+
return <div>{data.pizza}</div>;
176+
}`,
177+
"static-query-hooks-imported.js": `import React from "react"
178+
import { useStaticQuery, graphql } from "gatsby"
179+
import strangeQueryName from "./another-file.js"
180+
181+
export default () => {
182+
const data = useStaticQuery(strangeQueryName);
183+
return <div>{data.pizza}</div>;
184+
}`,
146185
}
147186

148187
const parser = new FileParser()

0 commit comments

Comments
 (0)