From 4aeca27cfc28ba3a807d52b2c7649ed10cbd3527 Mon Sep 17 00:00:00 2001
From: fisker Cheung <lionkay@gmail.com>
Date: Tue, 7 Feb 2023 15:13:14 +0800
Subject: [PATCH] Fix leading comments in mapped types with `readonly`
 (Cherry-pick #13427)

---
 changelog_unreleased/typescript/13427.md      |  22 ++++
 src/language-js/print/type-parameters.js      |   1 +
 src/language-js/print/typescript.js           |   7 --
 .../__snapshots__/jsfmt.spec.js.snap          | 113 ++++++++++++++++++
 .../typescript/mapped-type/issue-11098.ts     |  51 ++++++++
 5 files changed, 187 insertions(+), 7 deletions(-)
 create mode 100644 changelog_unreleased/typescript/13427.md
 create mode 100644 tests/format/typescript/mapped-type/issue-11098.ts

diff --git a/changelog_unreleased/typescript/13427.md b/changelog_unreleased/typescript/13427.md
new file mode 100644
index 000000000000..96f9b91da401
--- /dev/null
+++ b/changelog_unreleased/typescript/13427.md
@@ -0,0 +1,22 @@
+#### Fix leading comments in mapped types with `readonly` (#13427 by @thorn0, @sosukesuzuki)
+
+<!-- prettier-ignore -->
+```tsx
+// Input
+type Type = {
+  // comment
+  readonly [key in Foo];
+};
+
+// Prettier stable
+type Type = {
+  readonly // comment
+  [key in Foo];
+};
+
+// Prettier main
+type Type = {
+  // comment
+  readonly [key in Foo];
+};
+```
diff --git a/src/language-js/print/type-parameters.js b/src/language-js/print/type-parameters.js
index 154ffb161a5a..c533981d33fe 100644
--- a/src/language-js/print/type-parameters.js
+++ b/src/language-js/print/type-parameters.js
@@ -12,6 +12,7 @@ const {
   shouldPrintComma,
   getFunctionParameters,
   isObjectType,
+  getTypeScriptMappedTypeModifier,
 } = require("../utils/index.js");
 const { createGroupIdMapper } = require("../../common/util.js");
 const { shouldHugType } = require("./type-annotation.js");
diff --git a/src/language-js/print/typescript.js b/src/language-js/print/typescript.js
index 68defeffe4e3..f03ad7b2adcd 100644
--- a/src/language-js/print/typescript.js
+++ b/src/language-js/print/typescript.js
@@ -307,13 +307,6 @@ function printTypescript(path, options, print) {
           "{",
           indent([
             options.bracketSpacing ? line : softline,
-            node.readonly
-              ? [
-                  getTypeScriptMappedTypeModifier(node.readonly, "readonly"),
-                  " ",
-                ]
-              : "",
-            printTypeScriptModifiers(path, options, print),
             print("typeParameter"),
             node.optional
               ? getTypeScriptMappedTypeModifier(node.optional, "?")
diff --git a/tests/format/typescript/mapped-type/__snapshots__/jsfmt.spec.js.snap b/tests/format/typescript/mapped-type/__snapshots__/jsfmt.spec.js.snap
index 18ffc4528d72..fe565652cc5f 100644
--- a/tests/format/typescript/mapped-type/__snapshots__/jsfmt.spec.js.snap
+++ b/tests/format/typescript/mapped-type/__snapshots__/jsfmt.spec.js.snap
@@ -22,6 +22,119 @@ type Example = {
 ================================================================================
 `;
 
+exports[`issue-11098.ts format 1`] = `
+====================================options=====================================
+parsers: ["typescript"]
+printWidth: 80
+                                                                                | printWidth
+=====================================input======================================
+type Type = {
+  // comment
+  readonly [T in number];
+};
+
+type Type = {
+  // comment1
+  // comment2
+  readonly [T in number];
+};
+
+type Type = {
+  // comment
+  +readonly [T in number];
+};
+
+type Type = {
+  // comment
+  -readonly [T in number];
+};
+
+type Type = {
+  // comment
+  +    readonly [T in number];
+};
+
+type Type = {
+  // comment
+  +readonly     [T in number];
+};
+
+type Type = {
+  // comment
+  readonly       [T in number];
+};
+
+type Type = {
+  // comment
+  [T in number];
+};
+
+type Type = {
+  readonly
+  // comment
+  [T in number];
+};
+
+type Type = {
+  readonly // foo
+  /* bar */ [T in number];
+};
+
+=====================================output=====================================
+type Type = {
+  // comment
+  readonly [T in number];
+};
+
+type Type = {
+  // comment1
+  // comment2
+  readonly [T in number];
+};
+
+type Type = {
+  // comment
+  +readonly [T in number];
+};
+
+type Type = {
+  // comment
+  -readonly [T in number];
+};
+
+type Type = {
+  // comment
+  +readonly [T in number];
+};
+
+type Type = {
+  // comment
+  +readonly [T in number];
+};
+
+type Type = {
+  // comment
+  readonly [T in number];
+};
+
+type Type = {
+  // comment
+  [T in number];
+};
+
+type Type = {
+  // comment
+  readonly [T in number];
+};
+
+type Type = {
+  // foo
+  /* bar */ readonly [T in number];
+};
+
+================================================================================
+`;
+
 exports[`mapped-type.ts format 1`] = `
 ====================================options=====================================
 parsers: ["typescript"]
diff --git a/tests/format/typescript/mapped-type/issue-11098.ts b/tests/format/typescript/mapped-type/issue-11098.ts
new file mode 100644
index 000000000000..2024b8eaf49f
--- /dev/null
+++ b/tests/format/typescript/mapped-type/issue-11098.ts
@@ -0,0 +1,51 @@
+type Type = {
+  // comment
+  readonly [T in number];
+};
+
+type Type = {
+  // comment1
+  // comment2
+  readonly [T in number];
+};
+
+type Type = {
+  // comment
+  +readonly [T in number];
+};
+
+type Type = {
+  // comment
+  -readonly [T in number];
+};
+
+type Type = {
+  // comment
+  +    readonly [T in number];
+};
+
+type Type = {
+  // comment
+  +readonly     [T in number];
+};
+
+type Type = {
+  // comment
+  readonly       [T in number];
+};
+
+type Type = {
+  // comment
+  [T in number];
+};
+
+type Type = {
+  readonly
+  // comment
+  [T in number];
+};
+
+type Type = {
+  readonly // foo
+  /* bar */ [T in number];
+};