Enable prettier for some blocklisted fixtures with invalid GraphQL (#30425)
The invalid GraphQL in these fixtures somehow causes an unhandled promise rejection error when running `yarn prettier-all`. This fixes that issue by making the GraphQL valid.
Jan Kassens committed
Jul 30, 2024 at 14:23 UTC
41ecbada0e05f1dd40f8b94c6fa98dbdaabca211
17 files changed
+159
-60
.prettierignore
-9
@@ -22,15 +22,6 @@ compiler/**/.next
22
23
# contains invalid graphql`...` which results in a promise rejection error from `yarn prettier-all`.
24
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.js
25
-compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-and-local-variables-with-default.js
26
-compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-declarations-and-locals.js
27
-compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.js
28
-compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hook-inside-logical-expression.js
29
-compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-call-logical.js
30
-compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls-mutable-lambda.js
31
-compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls.js
32
-compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-in-hook.js
33
-compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-literal.js
25
26
compiler/crates
27
compiler/apps/playground/public
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-and-local-variables-with-default.expect.md
+13
-2
@@ -13,7 +13,14 @@ function useFragment(_arg1, _arg2) {
13
}
14
15
function Component(props) {
16
- const post = useFragment(graphql`...`, props.post);
16
+ const post = useFragment(
17
+ graphql`
18
+ fragment F on T {
19
+ id
20
+ }
21
+ `,
22
+ props.post
23
+ );
24
const allUrls = [];
25
// `media` and `urls` are exported from the scope that will wrap this code,
26
// but `comments` is not (it doesn't need to be memoized, bc the callback
@@ -59,7 +66,11 @@ function Component(props) {
66
const $ = _c(9);
67
let t0;
68
if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
62
- t0 = graphql`...`;
69
+ t0 = graphql`
70
+ fragment F on T {
71
+ id
72
+ }
73
+ `;
74
$[0] = t0;
75
} else {
76
t0 = $[0];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-and-local-variables-with-default.js
+8
-1
@@ -9,7 +9,14 @@ function useFragment(_arg1, _arg2) {
9
}
10
11
function Component(props) {
12
- const post = useFragment(graphql`...`, props.post);
12
+ const post = useFragment(
13
+ graphql`
14
+ fragment F on T {
15
+ id
16
+ }
17
+ `,
18
+ props.post
19
+ );
20
const allUrls = [];
21
// `media` and `urls` are exported from the scope that will wrap this code,
22
// but `comments` is not (it doesn't need to be memoized, bc the callback
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-declarations-and-locals.expect.md
+16
-2
@@ -3,7 +3,14 @@
3
4
```javascript
5
function Component(props) {
6
- const post = useFragment(graphql`...`, props.post);
6
+ const post = useFragment(
7
+ graphql`
8
+ fragment F on T {
9
+ id
10
+ }
11
+ `,
12
+ props.post
13
+ );
14
const allUrls = [];
15
// `media` and `urls` are exported from the scope that will wrap this code,
16
// but `comments` is not (it doesn't need to be memoized, bc the callback
@@ -31,7 +38,14 @@ function Component(props) {
38
import { c as _c } from "react/compiler-runtime";
39
function Component(props) {
40
const $ = _c(4);
34
- const post = useFragment(graphql`...`, props.post);
41
+ const post = useFragment(
42
+ graphql`
43
+ fragment F on T {
44
+ id
45
+ }
46
+ `,
47
+ props.post,
48
+ );
49
let t0;
50
if ($[0] !== post) {
51
const allUrls = [];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-declarations-and-locals.js
+8
-1
@@ -1,5 +1,12 @@
1
function Component(props) {
2
- const post = useFragment(graphql`...`, props.post);
2
+ const post = useFragment(
3
+ graphql`
4
+ fragment F on T {
5
+ id
6
+ }
7
+ `,
8
+ props.post
9
+ );
10
const allUrls = [];
11
// `media` and `urls` are exported from the scope that will wrap this code,
12
// but `comments` is not (it doesn't need to be memoized, bc the callback
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hook-inside-logical-expression.expect.md
+18
-2
@@ -3,7 +3,15 @@
3
4
```javascript
5
function Component(props) {
6
- const user = useFragment(graphql`...`, props.user) ?? {};
6
+ const user =
7
+ useFragment(
8
+ graphql`
9
+ fragment F on T {
10
+ id
11
+ }
12
+ `,
13
+ props.user
14
+ ) ?? {};
15
return user.name;
16
}
17
@@ -13,7 +21,15 @@ function Component(props) {
21
22
```javascript
23
function Component(props) {
16
- const user = useFragment(graphql`...`, props.user) ?? {};
24
+ const user =
25
+ useFragment(
26
+ graphql`
27
+ fragment F on T {
28
+ id
29
+ }
30
+ `,
31
+ props.user,
32
+ ) ?? {};
33
return user.name;
34
}
35
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hook-inside-logical-expression.js
+9
-1
@@ -1,4 +1,12 @@
1
function Component(props) {
2
- const user = useFragment(graphql`...`, props.user) ?? {};
2
+ const user =
3
+ useFragment(
4
+ graphql`
5
+ fragment F on T {
6
+ id
7
+ }
8
+ `,
9
+ props.user
10
+ ) ?? {};
11
return user.name;
12
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-call-logical.expect.md
+16
-2
@@ -3,7 +3,14 @@
3
4
```javascript
5
function Component(props) {
6
- const item = useFragment(graphql`...`, props.item);
6
+ const item = useFragment(
7
+ graphql`
8
+ fragment F on T {
9
+ id
10
+ }
11
+ `,
12
+ props.item
13
+ );
14
return item.items?.map(item => renderItem(item)) ?? [];
15
}
16
@@ -15,7 +22,14 @@ function Component(props) {
22
import { c as _c } from "react/compiler-runtime";
23
function Component(props) {
24
const $ = _c(2);
18
- const item = useFragment(graphql`...`, props.item);
25
+ const item = useFragment(
26
+ graphql`
27
+ fragment F on T {
28
+ id
29
+ }
30
+ `,
31
+ props.item,
32
+ );
33
let t0;
34
if ($[0] !== item.items) {
35
t0 = item.items?.map(_temp) ?? [];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-call-logical.js
+8
-1
@@ -1,4 +1,11 @@
1
function Component(props) {
2
- const item = useFragment(graphql`...`, props.item);
2
+ const item = useFragment(
3
+ graphql`
4
+ fragment F on T {
5
+ id
6
+ }
7
+ `,
8
+ props.item
9
+ );
10
return item.items?.map(item => renderItem(item)) ?? [];
11
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls-mutable-lambda.expect.md
+10
-2
@@ -5,7 +5,11 @@
5
function Component(props) {
6
const x = makeObject();
7
const user = useFragment(
8
- graphql`fragment Component_user on User { ... }`,
8
+ graphql`
9
+ fragment Component_user on User {
10
+ name
11
+ }
12
+ `,
13
props.user
14
);
15
const posts = user.timeline.posts.edges.nodes.map(node => {
@@ -28,7 +32,11 @@ function Component(props) {
32
const $ = _c(3);
33
const x = makeObject();
34
const user = useFragment(
31
- graphql`fragment Component_user on User { ... }`,
35
+ graphql`
36
+ fragment Component_user on User {
37
+ name
38
+ }
39
+ `,
40
props.user,
41
);
42
const posts = user.timeline.posts.edges.nodes.map((node) => {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls-mutable-lambda.js
+5
-1
@@ -1,7 +1,11 @@
1
function Component(props) {
2
const x = makeObject();
3
const user = useFragment(
4
- graphql`fragment Component_user on User { ... }`,
4
+ graphql`
5
+ fragment Component_user on User {
6
+ name
7
+ }
8
+ `,
9
props.user
10
);
11
const posts = user.timeline.posts.edges.nodes.map(node => {
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls.expect.md
+10
-2
@@ -4,7 +4,11 @@
4
```javascript
5
function Component(props) {
6
const user = useFragment(
7
- graphql`fragment Component_user on User { ... }`,
7
+ graphql`
8
+ fragment Component_user on User {
9
+ name
10
+ }
11
+ `,
12
props.user
13
);
14
const posts = user.timeline.posts.edges.nodes.map(node => (
@@ -25,7 +29,11 @@ import { c as _c } from "react/compiler-runtime";
29
function Component(props) {
30
const $ = _c(5);
31
const user = useFragment(
28
- graphql`fragment Component_user on User { ... }`,
32
+ graphql`
33
+ fragment Component_user on User {
34
+ name
35
+ }
36
+ `,
37
props.user,
38
);
39
let posts;
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls.js
+5
-1
@@ -1,6 +1,10 @@
1
function Component(props) {
2
const user = useFragment(
3
- graphql`fragment Component_user on User { ... }`,
3
+ graphql`
4
+ fragment Component_user on User {
5
+ name
6
+ }
7
+ `,
8
props.user
9
);
10
const posts = user.timeline.posts.edges.nodes.map(node => (
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-in-hook.expect.md
+16
-2
@@ -3,7 +3,14 @@
3
4
```javascript
5
function Component(props) {
6
- const user = useFragment(graphql`fragment on User { name }`, props.user);
6
+ const user = useFragment(
7
+ graphql`
8
+ fragment F on User {
9
+ name
10
+ }
11
+ `,
12
+ props.user
13
+ );
14
return user.name;
15
}
16
@@ -13,7 +20,14 @@ function Component(props) {
20
21
```javascript
22
function Component(props) {
16
- const user = useFragment(graphql`fragment on User { name }`, props.user);
23
+ const user = useFragment(
24
+ graphql`
25
+ fragment F on User {
26
+ name
27
+ }
28
+ `,
29
+ props.user,
30
+ );
31
return user.name;
32
}
33
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-in-hook.js
+8
-1
@@ -1,4 +1,11 @@
1
function Component(props) {
2
- const user = useFragment(graphql`fragment on User { name }`, props.user);
2
+ const user = useFragment(
3
+ graphql`
4
+ fragment F on User {
5
+ name
6
+ }
7
+ `,
8
+ props.user
9
+ );
10
return user.name;
11
}
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-literal.expect.md
+6
-20
@@ -4,16 +4,9 @@
4
```javascript
5
function component() {
6
let t = graphql`
7
- fragment List_viewer on Viewer
8
- @argumentDefinitions(
9
- count: {
10
- type: "Int"
11
- defaultValue: 10
12
- directives: ["@int_max_value(logged_in: 10)"]
13
- }
14
- cursor: { type: "ID" }
15
- )
16
-
7
+ fragment F on T {
8
+ id
9
+ }
10
`;
11
12
return t;
@@ -30,17 +23,10 @@ function component() {
23
let t0;
24
if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
25
t0 = graphql`
33
- fragment List_viewer on Viewer
34
- @argumentDefinitions(
35
- count: {
36
- type: "Int"
37
- defaultValue: 10
38
- directives: ["@int_max_value(logged_in: 10)"]
26
+ fragment F on T {
27
+ id
28
}
40
- cursor: { type: "ID" }
41
- )
42
-
43
- `;
29
+ `;
30
$[0] = t0;
31
} else {
32
t0 = $[0];
compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-literal.js
+3
-10
@@ -1,15 +1,8 @@
1
function component() {
2
let t = graphql`
3
- fragment List_viewer on Viewer
4
- @argumentDefinitions(
5
- count: {
6
- type: "Int"
7
- defaultValue: 10
8
- directives: ["@int_max_value(logged_in: 10)"]
9
- }
10
- cursor: { type: "ID" }
11
- )
12
-
3
+ fragment F on T {
4
+ id
5
+ }
6
`;
7
8
return t;