Fix formatting for auto-accessors with comments

changelog_unreleased/javascript/14038.md

@@ -0,0 +1,32 @@
+#### Fix formatting for auto-accessors with comments (#14038 by @fisker)
+
+<!-- prettier-ignore -->
+```jsx
+// Input
+class A {
+  @dec()
+  // comment
+  accessor b;
+}
+
+// Prettier stable
+class A {
+  @dec()
+  accessor // comment
+  b;
+}
+
+// Prettier stable (second format)
+class A {
+  @dec()
+  accessor; // comment
+  b;
+}
+
+// Prettier main
+class A {
+  @dec()
+  // comment
+  accessor b;
+}
+```

src/language-js/comments.js

@@ -453,6 +453,9 @@ const propertyLikeNodeTypes = new Set([
   "TSAbstractMethodDefinition",
   "TSDeclareMethod",
   "MethodDefinition",
+  "ClassAccessorProperty",
+  "AccessorProperty",
+  "TSAbstractAccessorProperty",
 ]);
 function handleMethodNameComments({
   comment,

tests/config/format-test.js

@@ -72,6 +72,7 @@ const meriyahDisabledTests = new Set([
     "static.js",
     "with-semicolon-1.js",
     "with-semicolon-2.js",
+    "comments.js",
   ].map((filename) =>
     path.join(__dirname, "../format/js/decorator-auto-accessors", filename)
   ),

tests/format/js/decorator-auto-accessors/__snapshots__/jsfmt.spec.js.snap

@@ -73,6 +73,91 @@ class Foo {
 ================================================================================
 `;
 
+exports[`comments.js [acorn] format 1`] = `
+"Unexpected character '@' (2:3)
+  1 | class A {
+> 2 |   @dec()
+    |   ^
+  3 |   // comment
+  4 |   accessor b;
+  5 | }"
+`;
+
+exports[`comments.js [espree] format 1`] = `
+"Unexpected character '@' (2:3)
+  1 | class A {
+> 2 |   @dec()
+    |   ^
+  3 |   // comment
+  4 |   accessor b;
+  5 | }"
+`;
+
+exports[`comments.js - {"semi":false} [acorn] format 1`] = `
+"Unexpected character '@' (2:3)
+  1 | class A {
+> 2 |   @dec()
+    |   ^
+  3 |   // comment
+  4 |   accessor b;
+  5 | }"
+`;
+
+exports[`comments.js - {"semi":false} [espree] format 1`] = `
+"Unexpected character '@' (2:3)
+  1 | class A {
+> 2 |   @dec()
+    |   ^
+  3 |   // comment
+  4 |   accessor b;
+  5 | }"
+`;
+
+exports[`comments.js - {"semi":false} format 1`] = `
+====================================options=====================================
+parsers: ["babel", "typescript", "babel-flow"]
+printWidth: 80
+semi: false
+                                                                                | printWidth
+=====================================input======================================
+class A {
+  @dec()
+  // comment
+  accessor b;
+}
+
+=====================================output=====================================
+class A {
+  @dec()
+  // comment
+  accessor b
+}
+
+================================================================================
+`;
+
+exports[`comments.js format 1`] = `
+====================================options=====================================
+parsers: ["babel", "typescript", "babel-flow"]
+printWidth: 80
+                                                                                | printWidth
+=====================================input======================================
+class A {
+  @dec()
+  // comment
+  accessor b;
+}
+
+=====================================output=====================================
+class A {
+  @dec()
+  // comment
+  accessor b;
+}
+
+================================================================================
+`;
+
 exports[`computed.js [acorn] format 1`] = `
 "Unexpected token (2:12)
   1 | class Foo {

tests/format/js/decorator-auto-accessors/comments.js

@@ -0,0 +1,5 @@
+class A {
+  @dec()
+  // comment
+  accessor b;
+}

tests/format/js/decorator-auto-accessors/jsfmt.spec.js

@@ -9,6 +9,7 @@ const errors = {
     "static.js",
     "with-semicolon-1.js",
     "with-semicolon-2.js",
+    "comments.js",
   ],
   acorn: [
     "basic.js",
@@ -19,6 +20,7 @@ const errors = {
     "static.js",
     "with-semicolon-1.js",
     "with-semicolon-2.js",
+    "comments.js",
   ],
 };
 run_spec(__dirname, parsers, { errors });