Recognize @satisfies in Closure-style type casts

changelog_unreleased/javascript/14262.md

@@ -0,0 +1,16 @@
+#### Recognize `@satisfies` in Closure-style type casts (#14262 by @fisker)
+
+<!-- prettier-ignore -->
+```jsx
+// Input
+const a = /** @satisfies {Record<string, string>} */ ({hello: 1337});
+const b = /** @type {Record<string, string>} */ ({hello: 1337});
+
+// Prettier stable
+const a = /** @satisfies {Record<string, string>} */ { hello: 1337 };
+const b = /** @type {Record<string, string>} */ ({ hello: 1337 });
+
+// Prettier main
+const a = /** @satisfies {Record<string, string>} */ ({hello: 1337});
+const b = /** @type {Record<string, string>} */ ({hello: 1337});
+```

src/language-js/comments.js

@@ -31,6 +31,7 @@ const {
 } = require("./utils/index.js");
 const { locStart, locEnd } = require("./loc.js");
 const isBlockComment = require("./utils/is-block-comment.js");
+const isTypeCastComment = require("./utils/is-type-cast-comment.js");
 
 /**
  * @typedef {import("./types/estree").Node} Node
@@ -955,21 +956,6 @@ function getCommentChildNodes(node, options) {
   }
 }
 
-/**
- * @param {Comment} comment
- * @returns {boolean}
- */
-function isTypeCastComment(comment) {
-  return (
-    isBlockComment(comment) &&
-    comment.value[0] === "*" &&
-    // TypeScript expects the type to be enclosed in curly brackets, however
-    // Closure Compiler accepts types in parens and even without any delimiters at all.
-    // That's why we just search for "@type".
-    /@type\b/.test(comment.value)
-  );
-}
-
 /**
  * @param {AstPath} path
  * @returns {boolean}
@@ -1005,7 +991,6 @@ module.exports = {
   handleOwnLineComment,
   handleEndOfLineComment,
   handleRemainingComment,
-  isTypeCastComment,
   getCommentChildNodes,
   willPrintOwnComments,
 };

src/language-js/utils/is-type-cast-comment.js

@@ -16,8 +16,8 @@ function isTypeCastComment(comment) {
     comment.value[0] === "*" &&
     // TypeScript expects the type to be enclosed in curly brackets, however
     // Closure Compiler accepts types in parens and even without any delimiters at all.
-    // That's why we just search for "@type".
-    /@type\b/.test(comment.value)
+    // That's why we just search for "@type" and "@satisfies".
+    /@(?:type|satisfies)\b/.test(comment.value)
   );
 }
 

tests/format/js/comments-closure-typecast/__snapshots__/jsfmt.spec.js.snap

@@ -571,6 +571,24 @@ const objectWithComment2 = /** @type MyType */ (
 ================================================================================
 `;
 
+exports[`satisfies.js format 1`] = `
+====================================options=====================================
+parsers: ["babel"]
+printWidth: 80
+                                                                                | printWidth
+=====================================input======================================
+module.exports = /** @satisfies {Record<string, string>} */ ({
+  hello: 1337,
+});
+
+=====================================output=====================================
+module.exports = /** @satisfies {Record<string, string>} */ ({
+  hello: 1337,
+});
+
+================================================================================
+`;
+
 exports[`styled-components.js format 1`] = `
 ====================================options=====================================
 parsers: ["babel"]

tests/format/js/comments-closure-typecast/satisfies.js

@@ -0,0 +1,3 @@
+module.exports = /** @satisfies {Record<string, string>} */ ({
+  hello: 1337,
+});