Print as instead of : for babel-ts parser

changelog_unreleased/typescript/12706.md

@@ -0,0 +1,13 @@
+#### Print `as` instead of `:` for `babel-ts` parser (#12706 by @HosokawaR)
+
+<!-- prettier-ignore -->
+```tsx
+// Input
+[x as any] = x;
+
+// Prettier stable
+[x: any] = x;
+
+// Prettier main
+[x as any] = x;
+```

src/language-js/print/misc.js

@@ -55,6 +55,11 @@ function printTypeAnnotation(path, options, print) {
 
   const parentNode = path.getParentNode();
 
+  // Workaround for https://github.com/babel/babel/issues/14498
+  if (parentNode.type === "ArrayPattern" && options.parser === "babel-ts") {
+    return [" as ", print("typeAnnotation")];
+  }
+
   const isFunctionDeclarationIdentifier =
     parentNode.type === "DeclareFunction" && parentNode.id === node;
 

tests/format/typescript/as/__snapshots__/jsfmt.spec.js.snap

@@ -1,5 +1,19 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`array-pattern.ts format 1`] = `
+====================================options=====================================
+parsers: ["typescript"]
+printWidth: 80
+                                                                                | printWidth
+=====================================input======================================
+[x as any] = x;
+
+=====================================output=====================================
+[x as any] = x;
+
+================================================================================
+`;
+
 exports[`as.ts format 1`] = `
 ====================================options=====================================
 parsers: ["typescript"]

tests/format/typescript/as/array-pattern.ts

@@ -0,0 +1 @@
+[x as any] = x;