diff --git a/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts b/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts index d5c7d9e3f4193..8ed71b5e62a7e 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts +++ b/compiler/packages/babel-plugin-react-compiler/src/HIR/BuildHIR.ts @@ -2847,6 +2847,21 @@ function isReorderableExpression( allowLocalIdentifiers, ); } + case 'LogicalExpression': { + const logical = expr as NodePath; + return ( + isReorderableExpression( + builder, + logical.get('left'), + allowLocalIdentifiers, + ) && + isReorderableExpression( + builder, + logical.get('right'), + allowLocalIdentifiers, + ) + ); + } case 'ConditionalExpression': { const conditional = expr as NodePath; return ( diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/logical-reorder.flow.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/logical-reorder.flow.expect.md new file mode 100644 index 0000000000000..f07193ea9102b --- /dev/null +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/logical-reorder.flow.expect.md @@ -0,0 +1,39 @@ + +## Input + +```javascript +//@flow + +const foo = undefined; + +component C(...{scope = foo ?? null}: any) { + return scope; +} + +export const FIXTURE_ENTRYPOINT = { + fn: C, + params: [{scope: undefined}], +}; + +``` + +## Code + +```javascript +const foo = undefined; + +function C(t0) { + const { scope: t1 } = t0; + const scope = t1 === undefined ? (foo ?? null) : t1; + return scope; +} + +export const FIXTURE_ENTRYPOINT = { + fn: C, + params: [{ scope: undefined }], +}; + +``` + +### Eval output +(kind: ok) null \ No newline at end of file diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/logical-reorder.flow.js b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/logical-reorder.flow.js new file mode 100644 index 0000000000000..48b7b1d04f505 --- /dev/null +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/logical-reorder.flow.js @@ -0,0 +1,12 @@ +//@flow + +const foo = undefined; + +component C(...{scope = foo ?? null}: any) { + return scope; +} + +export const FIXTURE_ENTRYPOINT = { + fn: C, + params: [{scope: undefined}], +};