Fix unstable trailing comment on a nested parenthesized assignment (#19893)

Co-authored-by: fisker <lionkay@gmail.com>

changelog_unreleased/javascript/19893.md

@@ -0,0 +1,16 @@
+#### Fix unstable trailing comment on a nested parenthesized assignment (#19893 by @Kjubikstronk)
+
+<!-- prettier-ignore -->
+```jsx
+// Input
+assigned = (a = c /* comment */);
+
+// Prettier stable (First format)
+assigned = a = c /* comment */;
+
+// Prettier stable (Second format)
+assigned = a = c; /* comment */
+
+// Prettier main
+assigned = a = c; /* comment */
+```

src/language-js/comments/handle-comments.js

@@ -55,6 +55,7 @@ import {
   precedingNode: Node,
   enclosingNode: Node,
   followingNode: Node,
+  ancestors: readonly Node[],
   text: string,
   options: any,
   ast: NodeMap["File"] | NodeMap["Program"],
@@ -1177,6 +1178,22 @@ function handleArrowExpressionComments({
   return false;
 }
 
+function getEnclosingAssignmentChainExpressionStatement(node, ancestors) {
+  let child = node;
+
+  for (const ancestor of ancestors) {
+    if (ancestor.type === "AssignmentExpression" && ancestor.right === child) {
+      child = ancestor;
+      continue;
+    }
+
+    return ancestor.type === "ExpressionStatement" &&
+      ancestor.expression === child
+      ? ancestor
+      : undefined;
+  }
+}
+
 function handleSequenceExpressionLeadingComment({
   comment,
   enclosingNode,
@@ -1200,6 +1217,7 @@ function handleParenthesizedExpressionTrailingComment({
   enclosingNode,
   precedingNode,
   followingNode,
+  ancestors,
 }) {
   if (!followingNode && enclosingNode && precedingNode) {
     if (
@@ -1210,9 +1228,30 @@ function handleParenthesizedExpressionTrailingComment({
       return true;
     }
 
-    const isSequence = precedingNode.type === "SequenceExpression";
     const isAssignment = precedingNode.type === "AssignmentExpression";
 
+    // `a = (b = c /* comment */);` drops the parentheses, so the comment ends
+    // up trailing the whole statement anyway. Attach it there right away
+    // instead of leaving it on `c` for the next format to move.
+    if (
+      isAssignment &&
+      enclosingNode.type === "AssignmentExpression" &&
+      enclosingNode.right === precedingNode
+    ) {
+      const expressionStatement =
+        getEnclosingAssignmentChainExpressionStatement(
+          enclosingNode,
+          ancestors.slice(1),
+        );
+
+      if (expressionStatement) {
+        addTrailingComment(expressionStatement, comment);
+        return true;
+      }
+    }
+
+    const isSequence = precedingNode.type === "SequenceExpression";
+
     if (
       (isSequence || isAssignment) &&
       ((enclosingNode.type === "ArrowFunctionExpression" &&

src/main/comments/attach.js

@@ -106,7 +106,7 @@ function decorateComment(
     }
   }
 
-  return { enclosingNode, precedingNode, followingNode };
+  return { enclosingNode, precedingNode, followingNode, ancestors };
 }
 
 const returnFalse = () => false;

tests/config/format-test/failed-format-tests.js

@@ -30,7 +30,6 @@ const unstableTests = new Map(
     "typescript/call/callee-comments.ts",
     "js/arrows/arrow-chain-with-trailing-comments.js",
     "typescript/as/comments/18160.ts",
-    "js/sequence-expression/parenthesized-trailing-comment-unstable.js",
     "typescript/union/consistent-with-flow/single-type.ts",
   ].map((fixture) => {
     const [file, isUnstable = () => true] = Array.isArray(fixture)

tests/format/js/sequence-expression/__snapshots__/format.test.js.snap

@@ -168,7 +168,10 @@ const x22 = (a = c) /* comment */;
 
 assigned = (a, b, c /* comment */);
 assigned = (a, b, c) /* comment */;
-// assigned = (a = c /* comment */);
+assigned = (a = c /* comment */);
+x = y = (a = c /* comment */);
+obj.p = (a = c /* comment */);
+assigned = ((a = c) /* comment */);
 
 function f() {
   return (a, b, c /* comment */);
@@ -205,7 +208,10 @@ foo(); /* comment */
 
 assigned = (a, b, c /* comment */);
 assigned = (a, b, c); /* comment */
-// assigned = (a = c /* comment */);
+assigned = a = c; /* comment */
+x = y = a = c; /* comment */
+obj.p = a = c; /* comment */
+assigned = a = c; /* comment */
 
 function f() {
   return (a, b, c /* comment */);
@@ -216,23 +222,6 @@ function f() {
 ================================================================================
 `;
 
-exports[`parenthesized-trailing-comment-unstable.js format 1`] = `
-====================================options=====================================
-parsers: ["babel", "flow", "typescript"]
-                                                      printWidth: 80 (default) |
-=====================================input======================================
-// TODO: Enable tests in parenthesized-trailing-comment.js when they are stable
-
-assigned = (a = c /* comment */);
-
-=====================================output=====================================
-// TODO: Enable tests in parenthesized-trailing-comment.js when they are stable
-
-assigned = a = c /* comment */;
-
-================================================================================
-`;
-
 exports[`return.js format 1`] = `
 ====================================options=====================================
 parsers: ["babel", "flow", "typescript"]

tests/format/js/sequence-expression/parenthesized-trailing-comment-unstable.js

@@ -1,3 +0,0 @@
-// TODO: Enable tests in parenthesized-trailing-comment.js when they are stable
-
-assigned = (a = c /* comment */);

tests/format/js/sequence-expression/parenthesized-trailing-comment.js

@@ -34,7 +34,10 @@ const x22 = (a = c) /* comment */;
 
 assigned = (a, b, c /* comment */);
 assigned = (a, b, c) /* comment */;
-// assigned = (a = c /* comment */);
+assigned = (a = c /* comment */);
+x = y = (a = c /* comment */);
+obj.p = (a = c /* comment */);
+assigned = ((a = c) /* comment */);
 
 function f() {
   return (a, b, c /* comment */);