[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
Mike Vitousek committed
Jun 30, 2024 at 22:43 UTC
d6b1c488d41c1d69e099d5f15e6d3c0b38cc19b7
1 file changed
+5
-4
compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts
+5
-4
@@ -673,7 +673,7 @@ function codegenReactiveScope(
673
t.expressionStatement(
674
t.callExpression(t.identifier(detectionFunction), [
675
t.identifier(loadName),
676
- name,
676
+ t.cloneNode(name, true),
677
t.stringLiteral(name.name),
678
t.stringLiteral(cx.fnName),
679
t.stringLiteral("cached"),
@@ -684,8 +684,8 @@ function codegenReactiveScope(
684
idempotenceDetectionStatements.push(
685
t.expressionStatement(
686
t.callExpression(t.identifier(detectionFunction), [
687
- slot,
688
- name,
687
+ t.cloneNode(slot, true),
688
+ t.cloneNode(name, true),
689
t.stringLiteral(name.name),
690
t.stringLiteral(cx.fnName),
691
t.stringLiteral("recomputed"),
@@ -698,6 +698,7 @@ function codegenReactiveScope(
698
);
699
}
700
const condition = cx.synthesizeName("condition");
701
+ const recomputationBlock = t.cloneNode(computationBlock, true);
702
memoStatement = t.blockStatement([
703
...computationBlock.body,
704
t.variableDeclaration("let", [
@@ -714,7 +715,7 @@ function codegenReactiveScope(
715
t.ifStatement(
716
t.identifier(condition),
717
t.blockStatement([
717
- ...computationBlock.body,
718
+ ...recomputationBlock.body,
719
...idempotenceDetectionStatements,
720
])
721
),