convert @babel/plugin-transform-classes to typescript (#13220)

* babel-plugin-transform-classes flowts rename

* babel-plugin-transform-classes flowts convert

* babel-plugin-transform-classes

* babel-plugin-transform-classes add optional paramter

* babel-plugin-transform-classes

* babel-plugin-transform-classes

* make generate-tsconfig

* yarn install

* Fix type checking

Co-authored-by: Nicolò Ribaudo <nicolo.ribaudo@gmail.com>

lib/babel-packages.js.flow

@@ -212,3 +212,7 @@ declare module "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining"
 declare module "@babel/helper-module-transforms" {
   declare module.exports: any;
 }
+
+declare module "@babel/plugin-transform-classes" {
+  declare module.exports: any;
+}

packages/babel-plugin-transform-classes/package.json

@@ -30,6 +30,7 @@
   },
   "devDependencies": {
     "@babel/core": "workspace:*",
-    "@babel/helper-plugin-test-runner": "workspace:*"
+    "@babel/helper-plugin-test-runner": "workspace:*",
+    "@babel/traverse": "workspace:*"
   }
 }

packages/babel-plugin-transform-classes/src/index.ts

@@ -1,12 +1,11 @@
-// @flow
 import { declare } from "@babel/helper-plugin-utils";
 import annotateAsPure from "@babel/helper-annotate-as-pure";
 import nameFunction from "@babel/helper-function-name";
 import splitExportDeclaration from "@babel/helper-split-export-declaration";
 import { types as t } from "@babel/core";
-import type { NodePath } from "@babel/traverse";
 import globals from "globals";
 import transformClass from "./transformClass";
+import type { Visitor, NodePath } from "@babel/traverse";
 
 const getBuiltinClasses = category =>
   Object.keys(globals[category]).filter(name => /^[A-Z]/.test(name));
@@ -34,12 +33,12 @@ export default declare((api, options) => {
     name: "transform-classes",
 
     visitor: {
-      ExportDefaultDeclaration(path: NodePath) {
+      ExportDefaultDeclaration(path) {
         if (!path.get("declaration").isClassDeclaration()) return;
         splitExportDeclaration(path);
       },
 
-      ClassDeclaration(path: NodePath) {
+      ClassDeclaration(path) {
         const { node } = path;
 
         const ref = node.id || path.scope.generateUidIdentifier("class");
@@ -51,7 +50,7 @@ export default declare((api, options) => {
         );
       },
 
-      ClassExpression(path: NodePath, state: any) {
+      ClassExpression(path, state) {
         const { node } = path;
         if (node[VISITED]) return;
 
@@ -74,12 +73,14 @@ export default declare((api, options) => {
 
         if (path.isCallExpression()) {
           annotateAsPure(path);
-          if (path.get("callee").isArrowFunctionExpression()) {
+          // todo: improve babel types
+          const callee = path.get("callee") as unknown as NodePath;
+          if (callee.isArrowFunctionExpression()) {
             // This is an IIFE, so we don't need to worry about the noNewArrows assumption
-            path.get("callee").arrowFunctionToExpression();
+            callee.arrowFunctionToExpression();
           }
         }
       },
-    },
+    } as Visitor<any>,
   };
 });

packages/babel-plugin-transform-classes/src/transformClass.ts

@@ -1,4 +1,4 @@
-import type { NodePath } from "@babel/traverse";
+import type { NodePath, Visitor } from "@babel/traverse";
 import nameFunction from "@babel/helper-function-name";
 import ReplaceSupers, {
   environmentVisitor,
@@ -9,13 +9,11 @@ import annotateAsPure from "@babel/helper-annotate-as-pure";
 
 import addCreateSuperHelper from "./inline-createSuper-helpers";
 
-type ReadonlySet<T> = Set<T> | { has(val: T): boolean };
-
 type ClassAssumptions = {
-  setClassMethods: boolean,
-  constantSuper: boolean,
-  superIsCallableConstructor: boolean,
-  noClassCalls: boolean,
+  setClassMethods: boolean;
+  constantSuper: boolean;
+  superIsCallableConstructor: boolean;
+  noClassCalls: boolean;
 };
 
 function buildConstructor(classRef, constructorBody, node) {
@@ -113,7 +111,7 @@ export default function transformClass(
         (function () {
           super(...arguments);
         })
-      `;
+      ` as t.FunctionExpression;
       params = constructor.params;
       body = constructor.body;
     } else {
@@ -147,7 +145,7 @@ export default function transformClass(
   }
 
   function pushBody() {
-    const classBodyPaths: Array<Object> = classState.path.get("body.body");
+    const classBodyPaths: Array<any> = classState.path.get("body.body");
 
     for (const path of classBodyPaths) {
       const node = path.node;
@@ -282,6 +280,7 @@ export default function transformClass(
         t.cloneNode(classState.superFnId),
         t.thisExpression(),
         bareSuperNode.arguments,
+        false,
       );
     }
 
@@ -330,7 +329,7 @@ export default function transformClass(
       );
     }
 
-    const bareSupers = new Set();
+    const bareSupers = new Set<NodePath<t.CallExpression>>();
     path.traverse(
       traverse.visitors.merge([
         environmentVisitor,
@@ -341,7 +340,7 @@ export default function transformClass(
               bareSupers.add(parentPath);
             }
           },
-        },
+        } as Visitor,
       ]),
     );
 
@@ -411,7 +410,7 @@ export default function transformClass(
   /**
    * Push a method to its respective mutatorMap.
    */
-  function pushMethod(node: { type: "ClassMethod" }, path?: NodePath) {
+  function pushMethod(node: t.ClassMethod, path?: NodePath) {
     const scope = path ? path.scope : classState.scope;
 
     if (node.kind === "method") {
@@ -435,12 +434,16 @@ export default function transformClass(
         fn = nameFunction({ id: key, node: node, scope });
       }
     } else {
+      // todo(flow->ts) find a way to avoid "key as t.StringLiteral" below which relies on this assignment
       methods.hasComputed = true;
     }
 
     let descriptor;
-    if (!methods.hasComputed && methods.map.has(key.value)) {
-      descriptor = methods.map.get(key.value);
+    if (
+      !methods.hasComputed &&
+      methods.map.has((key as t.StringLiteral).value)
+    ) {
+      descriptor = methods.map.get((key as t.StringLiteral).value);
       descriptor[descKey] = fn;
 
       if (descKey === "value") {
@@ -454,7 +457,7 @@ export default function transformClass(
       methods.list.push(descriptor);
 
       if (!methods.hasComputed) {
-        methods.map.set(key.value, descriptor);
+        methods.map.set((key as t.StringLiteral).value, descriptor);
       }
     }
   }
@@ -522,7 +525,7 @@ export default function transformClass(
    */
   function pushConstructor(
     superReturns,
-    method: { type: "ClassMethod" },
+    method: t.ClassMethod,
     path: NodePath,
   ) {
     setState({
@@ -549,6 +552,7 @@ export default function transformClass(
     classState.pushedConstructor = true;
 
     // we haven't pushed any descriptors yet
+    // @ts-expect-error todo(flow->ts) maybe remove this block - properties from condition are not used anywhere esle
     if (classState.hasInstanceDescriptors || classState.hasStaticDescriptors) {
       pushDescriptors();
     }

tsconfig.json

@@ -26,6 +26,7 @@
     "./packages/babel-plugin-bugfix-v8-spread-parameters-in-optional-chaining/src/**/*.ts",
     "./packages/babel-plugin-proposal-async-do-expressions/src/**/*.ts",
     "./packages/babel-plugin-syntax-async-do-expressions/src/**/*.ts",
+    "./packages/babel-plugin-transform-classes/src/**/*.ts",
     "./packages/babel-plugin-transform-react-jsx/src/**/*.ts",
     "./packages/babel-plugin-transform-runtime/src/**/*.ts",
     "./packages/babel-plugin-transform-typescript/src/**/*.ts",
@@ -108,6 +109,9 @@
       "@babel/plugin-syntax-async-do-expressions": [
         "./packages/babel-plugin-syntax-async-do-expressions/src"
       ],
+      "@babel/plugin-transform-classes": [
+        "./packages/babel-plugin-transform-classes/src"
+      ],
       "@babel/plugin-transform-react-jsx": [
         "./packages/babel-plugin-transform-react-jsx/src"
       ],

yarn.lock

@@ -2089,6 +2089,7 @@ __metadata:
     "@babel/helper-plugin-utils": "workspace:^7.13.0"
     "@babel/helper-replace-supers": "workspace:^7.13.12"
     "@babel/helper-split-export-declaration": "workspace:^7.12.13"
+    "@babel/traverse": "workspace:*"
     globals: "condition:BABEL_8_BREAKING ? ^13.5.0 : ^11.1.0"
   peerDependencies:
     "@babel/core": ^7.0.0-0