diff --git a/changelog_unreleased/javascript/12088.md b/changelog_unreleased/javascript/12088.md index 2ebd84743..ba6004dfe 100644 --- a/changelog_unreleased/javascript/12088.md +++ b/changelog_unreleased/javascript/12088.md @@ -1,4 +1,4 @@ -#### Inline `await` expressions in JSX (#12088 by @j-f1) +#### Inline `await` expressions in JSX (#12088 & #12109 by @j-f1) `await` expressions in JSX are now inlined if their argument would be inlined. @@ -9,6 +9,11 @@ someVeryLongExpression )} +{await ( +
Lorem ipsum ...
+)} + + // Prettier stable { await Promise.all( @@ -16,8 +21,20 @@ ) } +{ + await ( +
Lorem ipsum ...
+ ) +} + + // Prettier main {await Promise.all( someVeryLongExpression )} + +{await ( +
Lorem ipsum ...
+)} + ``` diff --git a/src/language-js/print/jsx.js b/src/language-js/print/jsx.js index bd9dc2bad..f20ac180d 100644 --- a/src/language-js/print/jsx.js +++ b/src/language-js/print/jsx.js @@ -510,7 +510,8 @@ function printJsxExpressionContainer(path, options, print) { node.type === "ObjectExpression" || node.type === "ArrowFunctionExpression" || (node.type === "AwaitExpression" && - shouldInline(node.argument, node)) || + (shouldInline(node.argument, node) || + node.argument.type === "JSXElement")) || isCallExpression(node) || node.type === "FunctionExpression" || node.type === "TemplateLiteral" || diff --git a/tests/format/jsx/jsx/__snapshots__/jsfmt.spec.js.snap b/tests/format/jsx/jsx/__snapshots__/jsfmt.spec.js.snap index f8eacf98c..764b7cf2e 100644 --- a/tests/format/jsx/jsx/__snapshots__/jsfmt.spec.js.snap +++ b/tests/format/jsx/jsx/__snapshots__/jsfmt.spec.js.snap @@ -652,6 +652,12 @@ async function testFunction() { {hierarchyCriticism.IncongruousCooperate.MaterialEducation.OriginalArticulate.Parameter} {hierarchyCriticismIncongruousCooperateMaterialEducationOriginalArticulateParameter} + + const jsx = <> + {await ( + material education original articulate parameter + )} + } =====================================output===================================== @@ -693,6 +699,16 @@ async function testFunction() { } ); + + const jsx = ( + <> + {await ( + + material education original articulate parameter + + )} + + ); } ================================================================================ @@ -734,6 +750,12 @@ async function testFunction() { {hierarchyCriticism.IncongruousCooperate.MaterialEducation.OriginalArticulate.Parameter} {hierarchyCriticismIncongruousCooperateMaterialEducationOriginalArticulateParameter} + + const jsx = <> + {await ( + material education original articulate parameter + )} + } =====================================output===================================== @@ -775,6 +797,16 @@ async function testFunction() { } ); + + const jsx = ( + <> + {await ( + + material education original articulate parameter + + )} + + ); } ================================================================================ @@ -816,6 +848,12 @@ async function testFunction() { {hierarchyCriticism.IncongruousCooperate.MaterialEducation.OriginalArticulate.Parameter} {hierarchyCriticismIncongruousCooperateMaterialEducationOriginalArticulateParameter} + + const jsx = <> + {await ( + material education original articulate parameter + )} + } =====================================output===================================== @@ -857,6 +895,16 @@ async function testFunction() { } ); + + const jsx = ( + <> + {await ( + + material education original articulate parameter + + )} + + ); } ================================================================================ @@ -898,6 +946,12 @@ async function testFunction() { {hierarchyCriticism.IncongruousCooperate.MaterialEducation.OriginalArticulate.Parameter} {hierarchyCriticismIncongruousCooperateMaterialEducationOriginalArticulateParameter} + + const jsx = <> + {await ( + material education original articulate parameter + )} + } =====================================output===================================== @@ -939,6 +993,16 @@ async function testFunction() { } ); + + const jsx = ( + <> + {await ( + + material education original articulate parameter + + )} + + ); } ================================================================================ diff --git a/tests/format/jsx/jsx/await.js b/tests/format/jsx/jsx/await.js index 3eb1f3296..bf4d9ad1c 100644 --- a/tests/format/jsx/jsx/await.js +++ b/tests/format/jsx/jsx/await.js @@ -26,4 +26,10 @@ async function testFunction() { {hierarchyCriticism.IncongruousCooperate.MaterialEducation.OriginalArticulate.Parameter} {hierarchyCriticismIncongruousCooperateMaterialEducationOriginalArticulateParameter} + + const jsx = <> + {await ( + material education original articulate parameter + )} + }