From d6b1c488d41c1d69e099d5f15e6d3c0b38cc19b7 Mon Sep 17 00:00:00 2001 From: Mike Vitousek Date: Sun, 30 Jun 2024 22:43:32 -0700 Subject: [PATCH 1/2] [compiler] Clone computation block in change detection mode Summary: In change-detection mode, we previously were spreading the contents of the computation block into the result twice. Other babel passes that cause in-place mutations of the AST would then be causing action at a distance and breaking the overall transform result. This pr creates clones of the nodes instead, so that mutations aren't reflected in both places where the block is used. ghstack-source-id: b78def8d8d1b8f9978df0a231f64fdeda786a3a3 Pull Request resolved: https://github.com/facebook/react/pull/30148 --- .../src/ReactiveScopes/CodegenReactiveFunction.ts | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts b/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts index 809f773ebda37..606d778e69301 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts +++ b/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts @@ -673,7 +673,7 @@ function codegenReactiveScope( t.expressionStatement( t.callExpression(t.identifier(detectionFunction), [ t.identifier(loadName), - name, + t.cloneNode(name, true), t.stringLiteral(name.name), t.stringLiteral(cx.fnName), t.stringLiteral("cached"), @@ -684,8 +684,8 @@ function codegenReactiveScope( idempotenceDetectionStatements.push( t.expressionStatement( t.callExpression(t.identifier(detectionFunction), [ - slot, - name, + t.cloneNode(slot, true), + t.cloneNode(name, true), t.stringLiteral(name.name), t.stringLiteral(cx.fnName), t.stringLiteral("recomputed"), @@ -698,6 +698,7 @@ function codegenReactiveScope( ); } const condition = cx.synthesizeName("condition"); + const recomputationBlock = t.cloneNode(computationBlock, true); memoStatement = t.blockStatement([ ...computationBlock.body, t.variableDeclaration("let", [ @@ -714,7 +715,7 @@ function codegenReactiveScope( t.ifStatement( t.identifier(condition), t.blockStatement([ - ...computationBlock.body, + ...recomputationBlock.body, ...idempotenceDetectionStatements, ]) ), From b20d2327d634a1f102926859512b8667e2870741 Mon Sep 17 00:00:00 2001 From: Hendrik Liebau Date: Mon, 1 Jul 2024 10:01:28 +0200 Subject: [PATCH 2/2] Update `react-refresh-webpack-plugin` in Flight fixture (#30156) --- fixtures/flight/package.json | 2 +- fixtures/flight/playwright.config.js | 2 +- fixtures/flight/yarn.lock | 64 ++++++++++++++++++---------- 3 files changed, 43 insertions(+), 25 deletions(-) diff --git a/fixtures/flight/package.json b/fixtures/flight/package.json index cb0f77c8ea5a9..c0d8b4fea25db 100644 --- a/fixtures/flight/package.json +++ b/fixtures/flight/package.json @@ -10,7 +10,7 @@ "@babel/core": "^7.16.0", "@babel/plugin-proposal-private-property-in-object": "^7.18.6", "@babel/preset-react": "^7.22.5", - "@pmmmwh/react-refresh-webpack-plugin": "0.5.7", + "@pmmmwh/react-refresh-webpack-plugin": "0.5.15", "@svgr/webpack": "^5.5.0", "@testing-library/jest-dom": "^5.14.1", "@testing-library/react": "^13.0.0", diff --git a/fixtures/flight/playwright.config.js b/fixtures/flight/playwright.config.js index faecd8219acd4..40d86c37c9464 100644 --- a/fixtures/flight/playwright.config.js +++ b/fixtures/flight/playwright.config.js @@ -24,7 +24,7 @@ export default defineConfig({ }, ], webServer: { - command: 'FAST_REFRESH=false yarn dev', + command: 'yarn dev', url: 'http://localhost:3000', reuseExistingServer: !isCI, }, diff --git a/fixtures/flight/yarn.lock b/fixtures/flight/yarn.lock index f007e75761d73..927f680a6ca10 100644 --- a/fixtures/flight/yarn.lock +++ b/fixtures/flight/yarn.lock @@ -2696,19 +2696,17 @@ dependencies: playwright "1.41.2" -"@pmmmwh/react-refresh-webpack-plugin@0.5.7": - version "0.5.7" - resolved "https://registry.yarnpkg.com/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.7.tgz#58f8217ba70069cc6a73f5d7e05e85b458c150e2" - integrity sha512-bcKCAzF0DV2IIROp9ZHkRJa6O4jy7NlnHdWL3GmcUxYWNjLXkK5kfELELwEfSP5hXPfVL/qOGMAROuMQb9GG8Q== +"@pmmmwh/react-refresh-webpack-plugin@0.5.15": + version "0.5.15" + resolved "https://registry.yarnpkg.com/@pmmmwh/react-refresh-webpack-plugin/-/react-refresh-webpack-plugin-0.5.15.tgz#f126be97c30b83ed777e2aeabd518bc592e6e7c4" + integrity sha512-LFWllMA55pzB9D34w/wXUCf8+c+IYKuJDgxiZ3qMhl64KRMBHYM1I3VdGaD2BV5FNPV2/S2596bppxHbv2ZydQ== dependencies: - ansi-html-community "^0.0.8" - common-path-prefix "^3.0.0" - core-js-pure "^3.8.1" + ansi-html "^0.0.9" + core-js-pure "^3.23.3" error-stack-parser "^2.0.6" - find-up "^5.0.0" html-entities "^2.1.0" - loader-utils "^2.0.0" - schema-utils "^3.0.0" + loader-utils "^2.0.4" + schema-utils "^4.2.0" source-map "^0.7.3" "@sinclair/typebox@^0.24.1": @@ -3323,7 +3321,7 @@ ajv-keywords@^3.5.2: resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-3.5.2.tgz#31f29da5ab6e00d1c2d329acf7b5929614d5014d" integrity sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ== -ajv-keywords@^5.0.0: +ajv-keywords@^5.0.0, ajv-keywords@^5.1.0: version "5.1.0" resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-5.1.0.tgz#69d4d385a4733cdbeab44964a1170a88f87f0e16" integrity sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw== @@ -3350,6 +3348,16 @@ ajv@^8.0.0, ajv@^8.8.0: require-from-string "^2.0.2" uri-js "^4.2.2" +ajv@^8.9.0: + version "8.16.0" + resolved "https://registry.yarnpkg.com/ajv/-/ajv-8.16.0.tgz#22e2a92b94f005f7e0f9c9d39652ef0b8f6f0cb4" + integrity sha512-F0twR8U1ZU67JIEtekUcLkXkoO5mMMmgGD8sK/xUFzJ805jxHQl92hImFAqqXMyMYjSPOyUPAwHYhB72g5sTXw== + dependencies: + fast-deep-equal "^3.1.3" + json-schema-traverse "^1.0.0" + require-from-string "^2.0.2" + uri-js "^4.4.1" + ansi-escapes@^4.2.1: version "4.2.1" resolved "https://registry.yarnpkg.com/ansi-escapes/-/ansi-escapes-4.2.1.tgz#4dccdb846c3eee10f6d64dea66273eab90c37228" @@ -3363,11 +3371,16 @@ ansi-escapes@^4.3.1: dependencies: type-fest "^0.11.0" -ansi-html-community@0.0.8, ansi-html-community@^0.0.8: +ansi-html-community@0.0.8: version "0.0.8" resolved "https://registry.yarnpkg.com/ansi-html-community/-/ansi-html-community-0.0.8.tgz#69fbc4d6ccbe383f9736934ae34c3f8290f1bf41" integrity sha512-1APHAyr3+PCamwNw3bXCPp4HFLONZt/yIH0sZp0/469KWNTEy+qN5jQ3GVX6DMZ1UXAi34yVwtTeaG/HpBuuzw== +ansi-html@^0.0.9: + version "0.0.9" + resolved "https://registry.yarnpkg.com/ansi-html/-/ansi-html-0.0.9.tgz#6512d02342ae2cc68131952644a129cb734cd3f0" + integrity sha512-ozbS3LuenHVxNRh/wdnN16QapUHzauqSomAl1jwwJRRsGwFwtj644lIhxfWu0Fy0acCij2+AEgHvjscq3dlVXg== + ansi-regex@^4.1.0: version "4.1.0" resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-4.1.0.tgz#8b9f8f08cf1acb843756a839ca8c7e3168c51997" @@ -3978,11 +3991,6 @@ commander@^8.3.0: resolved "https://registry.yarnpkg.com/commander/-/commander-8.3.0.tgz#4837ea1b2da67b9c616a67afbb0fafee567bca66" integrity sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww== -common-path-prefix@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/common-path-prefix/-/common-path-prefix-3.0.0.tgz#7d007a7e07c58c4b4d5f433131a19141b29f11e0" - integrity sha512-QE33hToZseCH3jS0qN96O/bSh3kaw/h+Tq7ngyY9eWDUnTlTNUyqfqvCXioLe5Na5jFsL78ra/wuBU4iuEgd4w== - commondir@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/commondir/-/commondir-1.0.1.tgz#ddd800da0c66127393cca5950ea968a3aaf1253b" @@ -4057,10 +4065,10 @@ core-js-compat@^3.30.1, core-js-compat@^3.30.2: dependencies: browserslist "^4.21.5" -core-js-pure@^3.8.1: - version "3.36.0" - resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.36.0.tgz#ffb34330b14e594d6a9835cf5843b4123f1d95db" - integrity sha512-cN28qmhRNgbMZZMc/RFu5w8pK9VJzpb2rJVR/lHuZJKwmXnoWOpXmMkxqBB514igkp1Hu8WGROsiOAzUcKdHOQ== +core-js-pure@^3.23.3: + version "3.37.1" + resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.37.1.tgz#2b4b34281f54db06c9a9a5bd60105046900553bd" + integrity sha512-J/r5JTHSmzTxbiYYrzXg9w1VpqrYt+gexenBE9pugeyhwPZTAEJddyiReJWsLO6uNQ8xJZFbod6XC7KKwatCiA== cosmiconfig@^6.0.0: version "6.0.0" @@ -6031,7 +6039,7 @@ loader-runner@^4.2.0: resolved "https://registry.yarnpkg.com/loader-runner/-/loader-runner-4.3.0.tgz#c1b4a163b99f614830353b16755e7149ac2314e1" integrity sha512-3R/1M+yS3j5ou80Me59j7F9IMs4PXs3VqRrm0TU3AbKPxlmpoY1TNscJV/oGJXo8qCatFGTfDbY6W6ipGOYXfg== -loader-utils@^2.0.0: +loader-utils@^2.0.0, loader-utils@^2.0.4: version "2.0.4" resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-2.0.4.tgz#8b5cb38b5c34a9a018ee1fc0e6a066d1dfcc528c" integrity sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw== @@ -7705,6 +7713,16 @@ schema-utils@^4.0.0: ajv-formats "^2.1.1" ajv-keywords "^5.0.0" +schema-utils@^4.2.0: + version "4.2.0" + resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-4.2.0.tgz#70d7c93e153a273a805801882ebd3bff20d89c8b" + integrity sha512-L0jRsrPpjdckP3oPug3/VxNKt2trR8TcabrM6FOAAlvC/9Phcmm+cuAgTlxBqdBR1WJx7Naj9WHw+aOmheSVbw== + dependencies: + "@types/json-schema" "^7.0.9" + ajv "^8.9.0" + ajv-formats "^2.1.1" + ajv-keywords "^5.1.0" + semver@7.0.0, semver@~7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/semver/-/semver-7.0.0.tgz#5f3ca35761e47e05b206c6daff2cf814f0316b8e" @@ -8368,7 +8386,7 @@ update-browserslist-db@^1.0.5: escalade "^3.1.1" picocolors "^1.0.0" -uri-js@^4.2.2: +uri-js@^4.2.2, uri-js@^4.4.1: version "4.4.1" resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.4.1.tgz#9b1a52595225859e55f669d928f88c6c57f2a77e" integrity sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==