TypeScript: avoid trailing commas on index signatures with only one p…

…arameter (#7836)

changelog_unreleased/typescript/pr-7836.md

@@ -0,0 +1,33 @@
+#### Avoid trailing commas on index signatures with only one parameter ([#7836](https://github.com/prettier/prettier/pull/7836) by [@bakkot](https://github.com/bakkot))
+
+TypeScript index signatures technically allow multiple parameters and trailing commas, but it's an error to have multiple parameters there, and Babel's TypeScript parser does not accept them. So Prettier now avoids putting a trailing comma there when you have only one parameter.
+
+<!-- prettier-ignore -->
+```ts
+// Input
+export type A = {
+  a?: {
+    [
+      x: string
+    ]: typeof SomeLongLongLongTypeName[keyof typeof SomeLongLongLongTypeName];
+  } | null;
+};
+
+// Prettier stable
+export type A = {
+  a?: {
+    [
+      x: string,
+    ]: typeof SomeLongLongLongTypeName[keyof typeof SomeLongLongLongTypeName];
+  } | null;
+};
+
+// Prettier master
+export type A = {
+  a?: {
+    [
+      x: string
+    ]: typeof SomeLongLongLongTypeName[keyof typeof SomeLongLongLongTypeName];
+  } | null;
+};
+```

src/language-js/printer-estree.js

@@ -3259,6 +3259,15 @@ function printPathNoParens(path, options, print, args) {
     case "TSIndexSignature": {
       const parent = path.getParentNode();
 
+      // The typescript parser accepts multiple parameters here. If you're
+      // using them, it makes sense to have a trailing comma. But if you
+      // aren't, this is more like a computed property name than an array.
+      // So we leave off the trailing comma when there's just one parameter.
+      const trailingComma =
+        n.parameters.length > 1
+          ? ifBreak(shouldPrintComma(options) ? "," : "")
+          : "";
+
       const parametersGroup = group(
         concat([
           indent(
@@ -3267,7 +3276,7 @@ function printPathNoParens(path, options, print, args) {
               join(concat([", ", softline]), path.map(print, "parameters")),
             ])
           ),
-          ifBreak(shouldPrintComma(options) ? "," : ""),
+          trailingComma,
           softline,
         ])
       );

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

@@ -173,6 +173,11 @@ type TooLong = {
 type TooLong81 = { [loooooooooooooooooooooooooong: string, loooooooooooooooooong: string]: string; }
 type TooLong80 = { [loooooooooooooooooooooooooong: string, looooooooooooooooong: string]: string; }
 
+// note lack of trailing comma in the index signature
+type TooLongSingleParam = {
+  [looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong: string]: string;
+}
+
 =====================================output=====================================
 type A = { [key: string] };
 
@@ -199,6 +204,13 @@ type TooLong80 = {
   [loooooooooooooooooooooooooong: string, looooooooooooooooong: string]: string;
 };
 
+// note lack of trailing comma in the index signature
+type TooLongSingleParam = {
+  [
+    looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong: string
+  ]: string;
+};
+
 ================================================================================
 `;
 
@@ -224,6 +236,11 @@ type TooLong = {
 type TooLong81 = { [loooooooooooooooooooooooooong: string, loooooooooooooooooong: string]: string; }
 type TooLong80 = { [loooooooooooooooooooooooooong: string, looooooooooooooooong: string]: string; }
 
+// note lack of trailing comma in the index signature
+type TooLongSingleParam = {
+  [looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong: string]: string;
+}
+
 =====================================output=====================================
 type A = { [key: string] };
 
@@ -250,6 +267,13 @@ type TooLong80 = {
   [loooooooooooooooooooooooooong: string, looooooooooooooooong: string]: string;
 };
 
+// note lack of trailing comma in the index signature
+type TooLongSingleParam = {
+  [
+    looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong: string
+  ]: string;
+};
+
 ================================================================================
 `;
 
@@ -275,6 +299,11 @@ type TooLong = {
 type TooLong81 = { [loooooooooooooooooooooooooong: string, loooooooooooooooooong: string]: string; }
 type TooLong80 = { [loooooooooooooooooooooooooong: string, looooooooooooooooong: string]: string; }
 
+// note lack of trailing comma in the index signature
+type TooLongSingleParam = {
+  [looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong: string]: string;
+}
+
 =====================================output=====================================
 type A = { [key: string] };
 
@@ -301,6 +330,13 @@ type TooLong80 = {
   [loooooooooooooooooooooooooong: string, looooooooooooooooong: string]: string;
 };
 
+// note lack of trailing comma in the index signature
+type TooLongSingleParam = {
+  [
+    looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong: string
+  ]: string;
+};
+
 ================================================================================
 `;
 

tests/typescript_error_recovery/index-signature.ts

@@ -12,3 +12,8 @@ type TooLong = {
 }
 type TooLong81 = { [loooooooooooooooooooooooooong: string, loooooooooooooooooong: string]: string; }
 type TooLong80 = { [loooooooooooooooooooooooooong: string, looooooooooooooooong: string]: string; }
+
+// note lack of trailing comma in the index signature
+type TooLongSingleParam = {
+  [looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong: string]: string;
+}