From 5c925f01c948f2a63a07fb69b8f84400c5f28af6 Mon Sep 17 00:00:00 2001 From: Jan Kassens Date: Wed, 24 Jul 2024 11:00:49 -0400 Subject: [PATCH] Enable prettier for some blocklisted fixtures with invalid GraphQL 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. --- .prettierignore | 9 ------- ...and-local-variables-with-default.expect.md | 15 +++++++++-- ...-scope-and-local-variables-with-default.js | 9 ++++++- ...ed-scope-declarations-and-locals.expect.md | 18 +++++++++++-- ...ing-mixed-scope-declarations-and-locals.js | 9 ++++++- .../hook-inside-logical-expression.expect.md | 20 ++++++++++++-- .../hook-inside-logical-expression.js | 10 ++++++- .../compiler/optional-call-logical.expect.md | 18 +++++++++++-- .../compiler/optional-call-logical.js | 9 ++++++- ...ject-method-calls-mutable-lambda.expect.md | 12 +++++++-- ...only-object-method-calls-mutable-lambda.js | 6 ++++- .../readonly-object-method-calls.expect.md | 12 +++++++-- .../compiler/readonly-object-method-calls.js | 6 ++++- .../tagged-template-in-hook.expect.md | 18 +++++++++++-- .../compiler/tagged-template-in-hook.js | 9 ++++++- .../tagged-template-literal.expect.md | 26 +++++-------------- .../compiler/tagged-template-literal.js | 13 +++------- 17 files changed, 159 insertions(+), 60 deletions(-) diff --git a/.prettierignore b/.prettierignore index 8d05ed88916ca..ecb518e4f0f6e 100644 --- a/.prettierignore +++ b/.prettierignore @@ -22,15 +22,6 @@ compiler/**/.next # contains invalid graphql`...` which results in a promise rejection error from `yarn prettier-all`. compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.js -compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-and-local-variables-with-default.js -compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-declarations-and-locals.js -compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/error.todo-kitchensink.js -compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hook-inside-logical-expression.js -compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-call-logical.js -compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls-mutable-lambda.js -compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls.js -compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-in-hook.js -compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-literal.js compiler/crates compiler/apps/playground/public diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-and-local-variables-with-default.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-and-local-variables-with-default.expect.md index ff9948f087cfe..5e8f199206f58 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-and-local-variables-with-default.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-and-local-variables-with-default.expect.md @@ -13,7 +13,14 @@ function useFragment(_arg1, _arg2) { } function Component(props) { - const post = useFragment(graphql`...`, props.post); + const post = useFragment( + graphql` + fragment F on T { + id + } + `, + props.post + ); const allUrls = []; // `media` and `urls` are exported from the scope that will wrap this code, // but `comments` is not (it doesn't need to be memoized, bc the callback @@ -59,7 +66,11 @@ function Component(props) { const $ = _c(9); let t0; if ($[0] === Symbol.for("react.memo_cache_sentinel")) { - t0 = graphql`...`; + t0 = graphql` + fragment F on T { + id + } + `; $[0] = t0; } else { t0 = $[0]; diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-and-local-variables-with-default.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-and-local-variables-with-default.js index d9a6307557f71..3aa47dca46f4f 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-and-local-variables-with-default.js +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-and-local-variables-with-default.js @@ -9,7 +9,14 @@ function useFragment(_arg1, _arg2) { } function Component(props) { - const post = useFragment(graphql`...`, props.post); + const post = useFragment( + graphql` + fragment F on T { + id + } + `, + props.post + ); const allUrls = []; // `media` and `urls` are exported from the scope that will wrap this code, // but `comments` is not (it doesn't need to be memoized, bc the callback diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-declarations-and-locals.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-declarations-and-locals.expect.md index 5b8ed7e28a787..ed566a605fd5a 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-declarations-and-locals.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-declarations-and-locals.expect.md @@ -3,7 +3,14 @@ ```javascript function Component(props) { - const post = useFragment(graphql`...`, props.post); + const post = useFragment( + graphql` + fragment F on T { + id + } + `, + props.post + ); const allUrls = []; // `media` and `urls` are exported from the scope that will wrap this code, // but `comments` is not (it doesn't need to be memoized, bc the callback @@ -31,7 +38,14 @@ function Component(props) { import { c as _c } from "react/compiler-runtime"; function Component(props) { const $ = _c(4); - const post = useFragment(graphql`...`, props.post); + const post = useFragment( + graphql` + fragment F on T { + id + } + `, + props.post, + ); let t0; if ($[0] !== post) { const allUrls = []; diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-declarations-and-locals.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-declarations-and-locals.js index ab90ed9ee515c..f44fe5c57baf3 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-declarations-and-locals.js +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/destructuring-mixed-scope-declarations-and-locals.js @@ -1,5 +1,12 @@ function Component(props) { - const post = useFragment(graphql`...`, props.post); + const post = useFragment( + graphql` + fragment F on T { + id + } + `, + props.post + ); const allUrls = []; // `media` and `urls` are exported from the scope that will wrap this code, // but `comments` is not (it doesn't need to be memoized, bc the callback diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hook-inside-logical-expression.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hook-inside-logical-expression.expect.md index 1d42ecf1720e8..51a94698c6d51 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hook-inside-logical-expression.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hook-inside-logical-expression.expect.md @@ -3,7 +3,15 @@ ```javascript function Component(props) { - const user = useFragment(graphql`...`, props.user) ?? {}; + const user = + useFragment( + graphql` + fragment F on T { + id + } + `, + props.user + ) ?? {}; return user.name; } @@ -13,7 +21,15 @@ function Component(props) { ```javascript function Component(props) { - const user = useFragment(graphql`...`, props.user) ?? {}; + const user = + useFragment( + graphql` + fragment F on T { + id + } + `, + props.user, + ) ?? {}; return user.name; } diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hook-inside-logical-expression.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hook-inside-logical-expression.js index 483edd58bb12b..81a52e8f871fc 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hook-inside-logical-expression.js +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/hook-inside-logical-expression.js @@ -1,4 +1,12 @@ function Component(props) { - const user = useFragment(graphql`...`, props.user) ?? {}; + const user = + useFragment( + graphql` + fragment F on T { + id + } + `, + props.user + ) ?? {}; return user.name; } diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-call-logical.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-call-logical.expect.md index 734f809c1e325..4dc011c85f420 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-call-logical.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-call-logical.expect.md @@ -3,7 +3,14 @@ ```javascript function Component(props) { - const item = useFragment(graphql`...`, props.item); + const item = useFragment( + graphql` + fragment F on T { + id + } + `, + props.item + ); return item.items?.map(item => renderItem(item)) ?? []; } @@ -15,7 +22,14 @@ function Component(props) { import { c as _c } from "react/compiler-runtime"; function Component(props) { const $ = _c(2); - const item = useFragment(graphql`...`, props.item); + const item = useFragment( + graphql` + fragment F on T { + id + } + `, + props.item, + ); let t0; if ($[0] !== item.items) { t0 = item.items?.map(_temp) ?? []; diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-call-logical.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-call-logical.js index 9bb8bf5c63fd0..fac4efc9ba90b 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-call-logical.js +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/optional-call-logical.js @@ -1,4 +1,11 @@ function Component(props) { - const item = useFragment(graphql`...`, props.item); + const item = useFragment( + graphql` + fragment F on T { + id + } + `, + props.item + ); return item.items?.map(item => renderItem(item)) ?? []; } diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls-mutable-lambda.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls-mutable-lambda.expect.md index 7eaaab6cf0816..0cbd9caf169f0 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls-mutable-lambda.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls-mutable-lambda.expect.md @@ -5,7 +5,11 @@ function Component(props) { const x = makeObject(); const user = useFragment( - graphql`fragment Component_user on User { ... }`, + graphql` + fragment Component_user on User { + name + } + `, props.user ); const posts = user.timeline.posts.edges.nodes.map(node => { @@ -28,7 +32,11 @@ function Component(props) { const $ = _c(3); const x = makeObject(); const user = useFragment( - graphql`fragment Component_user on User { ... }`, + graphql` + fragment Component_user on User { + name + } + `, props.user, ); const posts = user.timeline.posts.edges.nodes.map((node) => { diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls-mutable-lambda.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls-mutable-lambda.js index f4b2a5643e95f..d78be74ac9957 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls-mutable-lambda.js +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls-mutable-lambda.js @@ -1,7 +1,11 @@ function Component(props) { const x = makeObject(); const user = useFragment( - graphql`fragment Component_user on User { ... }`, + graphql` + fragment Component_user on User { + name + } + `, props.user ); const posts = user.timeline.posts.edges.nodes.map(node => { diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls.expect.md index bd0c829aa4c8d..1a5f49631f661 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls.expect.md @@ -4,7 +4,11 @@ ```javascript function Component(props) { const user = useFragment( - graphql`fragment Component_user on User { ... }`, + graphql` + fragment Component_user on User { + name + } + `, props.user ); const posts = user.timeline.posts.edges.nodes.map(node => ( @@ -25,7 +29,11 @@ import { c as _c } from "react/compiler-runtime"; function Component(props) { const $ = _c(5); const user = useFragment( - graphql`fragment Component_user on User { ... }`, + graphql` + fragment Component_user on User { + name + } + `, props.user, ); let posts; diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls.js index 45e6f1bf9766e..7cccb397cabb2 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls.js +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/readonly-object-method-calls.js @@ -1,6 +1,10 @@ function Component(props) { const user = useFragment( - graphql`fragment Component_user on User { ... }`, + graphql` + fragment Component_user on User { + name + } + `, props.user ); const posts = user.timeline.posts.edges.nodes.map(node => ( diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-in-hook.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-in-hook.expect.md index a7db7906f2000..3ffc93ada58ea 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-in-hook.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-in-hook.expect.md @@ -3,7 +3,14 @@ ```javascript function Component(props) { - const user = useFragment(graphql`fragment on User { name }`, props.user); + const user = useFragment( + graphql` + fragment F on User { + name + } + `, + props.user + ); return user.name; } @@ -13,7 +20,14 @@ function Component(props) { ```javascript function Component(props) { - const user = useFragment(graphql`fragment on User { name }`, props.user); + const user = useFragment( + graphql` + fragment F on User { + name + } + `, + props.user, + ); return user.name; } diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-in-hook.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-in-hook.js index 54e712f8e519b..cb31d2978a610 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-in-hook.js +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-in-hook.js @@ -1,4 +1,11 @@ function Component(props) { - const user = useFragment(graphql`fragment on User { name }`, props.user); + const user = useFragment( + graphql` + fragment F on User { + name + } + `, + props.user + ); return user.name; } diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-literal.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-literal.expect.md index 11aadbbf16709..3993926f9f6ff 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-literal.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-literal.expect.md @@ -4,16 +4,9 @@ ```javascript function component() { let t = graphql` - fragment List_viewer on Viewer - @argumentDefinitions( - count: { - type: "Int" - defaultValue: 10 - directives: ["@int_max_value(logged_in: 10)"] - } - cursor: { type: "ID" } - ) - + fragment F on T { + id + } `; return t; @@ -30,17 +23,10 @@ function component() { let t0; if ($[0] === Symbol.for("react.memo_cache_sentinel")) { t0 = graphql` - fragment List_viewer on Viewer - @argumentDefinitions( - count: { - type: "Int" - defaultValue: 10 - directives: ["@int_max_value(logged_in: 10)"] + fragment F on T { + id } - cursor: { type: "ID" } - ) - - `; + `; $[0] = t0; } else { t0 = $[0]; diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-literal.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-literal.js index bfabc7ddbf03c..7126e331f8abe 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-literal.js +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/tagged-template-literal.js @@ -1,15 +1,8 @@ function component() { let t = graphql` - fragment List_viewer on Viewer - @argumentDefinitions( - count: { - type: "Int" - defaultValue: 10 - directives: ["@int_max_value(logged_in: 10)"] - } - cursor: { type: "ID" } - ) - + fragment F on T { + id + } `; return t;