[2021-12] Support class decorators in export declarations (#14396)

packages/babel-plugin-proposal-decorators/package.json

@@ -23,6 +23,7 @@
     "@babel/helper-create-class-features-plugin": "workspace:^",
     "@babel/helper-plugin-utils": "workspace:^",
     "@babel/helper-replace-supers": "workspace:^",
+    "@babel/helper-split-export-declaration": "workspace:^",
     "@babel/plugin-syntax-decorators": "workspace:^",
     "charcodes": "^0.2.0"
   },

packages/babel-plugin-proposal-decorators/src/transformer-2021-12.ts

@@ -2,6 +2,7 @@ import type { NodePath, Scope } from "@babel/traverse";
 import { types as t, template } from "@babel/core";
 import syntaxDecorators from "@babel/plugin-syntax-decorators";
 import ReplaceSupers from "@babel/helper-replace-supers";
+import splitExportDeclaration from "@babel/helper-split-export-declaration";
 import * as charCodes from "charcodes";
 
 type ClassDecoratableElement =
@@ -1009,24 +1010,23 @@ export default function ({ assertVersion, assumption }, { loose }) {
     inherits: syntaxDecorators,
 
     visitor: {
-      ClassDeclaration(path: NodePath<t.ClassDeclaration>, state: any) {
-        if (VISITED.has(path)) return;
-
-        const newPath = transformClass(path, state, constantSuper);
-
-        if (newPath) {
-          VISITED.add(newPath);
+      "ExportNamedDeclaration|ExportDefaultDeclaration"(path) {
+        const { declaration } = path.node;
+        if (
+          declaration?.type === "ClassDeclaration" &&
+          // When compiling class decorators we need to replace the class
+          // binding, so we must split it in two separate declarations.
+          declaration.decorators?.length > 0
+        ) {
+          splitExportDeclaration(path);
         }
       },
 
-      ClassExpression(path: NodePath<t.ClassExpression>, state: any) {
+      Class(path: NodePath<t.Class>, state: any) {
         if (VISITED.has(path)) return;
 
         const newPath = transformClass(path, state, constantSuper);
-
-        if (newPath) {
-          VISITED.add(newPath);
-        }
+        if (newPath) VISITED.add(newPath);
       },
     },
   };

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-exported/default-anonymous/input.mjs

@@ -0,0 +1 @@
+export default @dec class A {}

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-exported/default-anonymous/output.mjs

@@ -0,0 +1,17 @@
+var _initClass, _dec;
+
+let _A;
+
+_dec = dec
+
+class A {
+  static {
+    [_A, _initClass] = babelHelpers.applyDecs(this, [], [_dec]);
+  }
+  static {
+    _initClass();
+
+  }
+}
+
+export { _A as default };

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-exported/default-named/input.mjs

@@ -0,0 +1 @@
+export default @dec class {}

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-exported/default-named/output.mjs

@@ -0,0 +1,17 @@
+var _initClass, _dec;
+
+let _default2;
+
+_dec = dec
+
+class _default {
+  static {
+    [_default2, _initClass] = babelHelpers.applyDecs(this, [], [_dec]);
+  }
+  static {
+    _initClass();
+
+  }
+}
+
+export { _default2 as default };

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-exported/member-decorator/input.mjs

@@ -0,0 +1,3 @@
+export class A {
+    @dec x;
+}

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-exported/member-decorator/output.mjs

@@ -0,0 +1,9 @@
+var _dec, _init_x;
+
+_dec = dec
+export class A {
+  static {
+    [_init_x] = babelHelpers.applyDecs(this, [[_dec, 0, "x"]], []);
+  }
+  x = _init_x(this);
+}

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-exported/named/input.mjs

@@ -0,0 +1 @@
+export @dec class A {}

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-exported/named/output.mjs

@@ -0,0 +1,17 @@
+var _initClass, _dec;
+
+let _A;
+
+_dec = dec
+
+class A {
+  static {
+    [_A, _initClass] = babelHelpers.applyDecs(this, [], [_dec]);
+  }
+  static {
+    _initClass();
+
+  }
+}
+
+export { _A as A };

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-exported/no-decorators/input.mjs

@@ -0,0 +1,4 @@
+export class A {}
+
+class B {}
+export { B };

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-exported/no-decorators/output.mjs

@@ -0,0 +1,5 @@
+export class A {}
+
+class B {}
+
+export { B };

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-exported/options.json

@@ -0,0 +1,3 @@
+{
+  "plugins": [["proposal-decorators", { "version": "2021-12" }]]
+}

yarn.lock

@@ -1309,6 +1309,7 @@ __metadata:
     "@babel/helper-plugin-test-runner": "workspace:^"
     "@babel/helper-plugin-utils": "workspace:^"
     "@babel/helper-replace-supers": "workspace:^"
+    "@babel/helper-split-export-declaration": "workspace:^"
     "@babel/plugin-syntax-decorators": "workspace:^"
     "@babel/traverse": "workspace:^"
     babel-plugin-polyfill-es-shims: ^0.6.0