ts: fix optional computed methods (#6673)

CHANGELOG.unreleased.md

@@ -958,6 +958,26 @@ class A {
 }
 ```
 
+#### TypeScript: Fix optional computed methods ([#6673] by [@thorn0])
+
+<!-- prettier-ignore -->
+```ts
+// Input
+class A {
+  protected [s]?() {}
+}
+
+// Output (Prettier stable)
+class A {
+  protected [s?]() {}
+}
+
+// Output (Prettier master)
+class A {
+  protected [s]?() {}
+}
+```
+
 [#5910]: https://github.com/prettier/prettier/pull/5910
 [#6033]: https://github.com/prettier/prettier/pull/6033
 [#6186]: https://github.com/prettier/prettier/pull/6186
@@ -991,6 +1011,7 @@ class A {
 [#6605]: https://github.com/prettier/prettier/pull/6605
 [#6640]: https://github.com/prettier/prettier/pull/6640
 [#6646]: https://github.com/prettier/prettier/pull/6646
+[#6673]: https://github.com/prettier/prettier/pull/6673
 [@brainkim]: https://github.com/brainkim
 [@duailibe]: https://github.com/duailibe
 [@gavinjoyce]: https://github.com/gavinjoyce

src/language-js/printer-estree.js

@@ -3632,15 +3632,9 @@ function printPropertyKey(path, options, print) {
 function printMethod(path, options, print) {
   const node = path.getNode();
   const kind = node.kind;
+  const value = node.value || node;
   const parts = [];
 
-  const value =
-    node.type === "ObjectMethod" ||
-    node.type === "ClassMethod" ||
-    node.type === "ClassPrivateMethod"
-      ? node
-      : node.value;
-
   if (!kind || kind === "init" || kind === "method" || kind === "constructor") {
     if (value.async) {
       parts.push("async ");
@@ -3656,6 +3650,7 @@ function printMethod(path, options, print) {
 
   parts.push(
     printPropertyKey(path, options, print),
+    node.optional || node.key.optional ? "?" : "",
     node === value
       ? printMethodInternal(path, options, print)
       : path.call(path => printMethodInternal(path, options, print), "value")
@@ -4592,7 +4587,12 @@ function printClass(path, options, print) {
 
 function printOptionalToken(path) {
   const node = path.getValue();
-  if (!node.optional) {
+  if (
+    !node.optional ||
+    // It's an optional computed method parsed by typescript-estree.
+    // "?" is printed in `printMethod`.
+    (node.type === "Identifier" && node === path.getParentNode().key)
+  ) {
     return "";
   }
   if (

tests/typescript_class/__snapshots__/jsfmt.spec.js.snap

@@ -205,12 +205,20 @@ class X {
   "a-prop"?: boolean;
 }
 
+class A {
+  protected [s]?() {}
+}
+
 =====================================output=====================================
 class X {
   private foo? = undefined;
   "a-prop"?: boolean;
 }
 
+class A {
+  protected [s]?() {}
+}
+
 ================================================================================
 `;
 

tests/typescript_class/optional.ts

@@ -2,3 +2,7 @@ class X {
   private foo? = undefined;
   "a-prop"?: boolean;
 }
+
+class A {
+  protected [s]?() {}
+}