Apply toPropertyKey on decorator context name (#16139)

* refactor: extract toPrimitive and toProeprtyKey to single helpers

* update test fixtures

* apply toPropertyKey for decorator context name

* fix: allow BigIntLiteral in ClassMethod.key

* Add 2021-12 test cases

* copy paste to other versions

* Suppress TS error

* Update packages/babel-helpers/src/helpers/toPrimitive.ts

Co-authored-by: liuxingbaoyu <30521560+liuxingbaoyu@users.noreply.github.com>

* update generated helpers

* update test fixtures

---------

Co-authored-by: liuxingbaoyu <30521560+liuxingbaoyu@users.noreply.github.com>

packages/babel-helpers/src/helpers.ts

@@ -865,31 +865,6 @@ helpers.skipFirstGeneratorNext = helper("7.0.0-beta.0")`
   }
 `;
 
-helpers.toPrimitive = helper("7.1.5")`
-  export default function _toPrimitive(
-    input,
-    hint /*: "default" | "string" | "number" | void */
-  ) {
-    if (typeof input !== "object" || input === null) return input;
-    var prim = input[Symbol.toPrimitive];
-    if (prim !== undefined) {
-      var res = prim.call(input, hint || "default");
-      if (typeof res !== "object") return res;
-      throw new TypeError("@@toPrimitive must return a primitive value.");
-    }
-    return (hint === "string" ? String : Number)(input);
-  }
-`;
-
-helpers.toPropertyKey = helper("7.1.5")`
-  import toPrimitive from "toPrimitive";
-
-  export default function _toPropertyKey(arg) {
-    var key = toPrimitive(arg, "string");
-    return typeof key === "symbol" ? key : String(key);
-  }
-`;
-
 /**
  * Add a helper that will throw a useful error if the transform fails to detect the class
  * property assignment, so users know something failed.

packages/babel-helpers/src/helpers/applyDecs.js

@@ -1,5 +1,6 @@
 /* @minVersion 7.17.8 */
 
+import toPropertyKey from "toPropertyKey";
 /**
  * NOTE: This is an old version of the helper, used for 2021-12 decorators.
  * Updates should be done in applyDecs2203R.js.
@@ -168,7 +169,7 @@ function old_memberDec(
 
   var ctx = {
     kind: kindStr,
-    name: isPrivate ? "#" + name : name,
+    name: isPrivate ? "#" + name : toPropertyKey(name),
     isStatic: isStatic,
     isPrivate: isPrivate,
   };

packages/babel-helpers/src/helpers/applyDecs2203R.js

@@ -1,5 +1,7 @@
 /* @minVersion 7.20.0 */
 
+import toPropertyKey from "toPropertyKey";
+
 /**
   Enums are used in this file, but not assigned to vars to avoid non-hoistable values
 
@@ -58,7 +60,7 @@ function applyDecs2203RFactory() {
 
     var ctx = {
       kind: kindStr,
-      name: isPrivate ? "#" + name : name,
+      name: isPrivate ? "#" + name : toPropertyKey(name),
       static: isStatic,
       private: isPrivate,
     };

packages/babel-helpers/src/helpers/applyDecs2301.js

@@ -1,6 +1,7 @@
 /* @minVersion 7.21.0 */
 
 import checkInRHS from "checkInRHS";
+import toPropertyKey from "toPropertyKey";
 
 /**
   Enums are used in this file, but not assigned to vars to avoid non-hoistable values
@@ -69,7 +70,7 @@ function applyDecs2301Factory() {
 
     var ctx = {
       kind: kindStr,
-      name: isPrivate ? "#" + name : name,
+      name: isPrivate ? "#" + name : toPropertyKey(name),
       static: isStatic,
       private: isPrivate,
     };

packages/babel-helpers/src/helpers/applyDecs2305.ts

@@ -2,6 +2,8 @@
 
 // @ts-expect-error helper
 import checkInRHS from "checkInRHS";
+// @ts-expect-error helper
+import toPropertyKey from "toPropertyKey";
 
 /**
   Enums are used in this file, but not assigned to vars to avoid non-hoistable values
@@ -94,7 +96,7 @@ function memberDec(
       kind
     ] as any,
 
-    name: isPrivate ? "#" + name : name,
+    name: isPrivate ? "#" + name : toPropertyKey(name),
     static: isStatic,
     private: isPrivate,
     metadata: metadata,

packages/babel-helpers/src/helpers/toPrimitive.ts

@@ -0,0 +1,17 @@
+/* @minVersion 7.1.5 */
+
+// https://tc39.es/ecma262/#sec-toprimitive
+export default function toPrimitive(
+  input: unknown,
+  hint: "default" | "string" | "number" | void,
+) {
+  if (typeof input !== "object" || !input) return input;
+  // @ts-expect-error Symbol.toPrimitive might not index {}
+  var prim = input[Symbol.toPrimitive];
+  if (prim !== undefined) {
+    var res = prim.call(input, hint || "default");
+    if (typeof res !== "object") return res;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (hint === "string" ? String : Number)(input);
+}

packages/babel-helpers/src/helpers/toPropertyKey.ts

@@ -0,0 +1,11 @@
+/* @minVersion 7.1.5 */
+
+// https://tc39.es/ecma262/#sec-topropertykey
+
+// @ts-expect-error helper
+import toPrimitive from "toPrimitive";
+
+export default function toPropertyKey(arg: unknown) {
+  var key = toPrimitive(arg, "string");
+  return typeof key === "symbol" ? key : String(key);
+}

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-accessors--to-es2015/context-name/exec.js

@@ -0,0 +1,20 @@
+const logs = [];
+const dec = (value, context) => { logs.push(context.name) };
+const f = () => { logs.push("computing f"); return { [Symbol.toPrimitive]: () => "f()" }; };
+class Foo {
+  @dec static accessor a;
+  @dec static accessor #a;
+
+  @dec static accessor "b"
+  @dec static accessor ["c"];
+
+  @dec static accessor 0;
+  @dec static accessor [1];
+
+  @dec static accessor 2n;
+  @dec static accessor [3n];
+
+  @dec static accessor [f()];
+}
+
+expect(logs).toStrictEqual(["computing f", "a", "#a", "b", "c", "0", "1", "2", "3", "f()"]);

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-accessors--to-es2015/context-name/input.js

@@ -0,0 +1,20 @@
+const logs = [];
+const dec = (value, context) => { logs.push(context.name) };
+const f = () => { logs.push("computing f"); return { [Symbol.toPrimitive]: () => "f()" }; };
+class Foo {
+  @dec static accessor a;
+  @dec static accessor #a;
+
+  @dec static accessor "b"
+  @dec static accessor ["c"];
+
+  @dec static accessor 0;
+  @dec static accessor [1];
+
+  @dec static accessor 2n;
+  @dec static accessor [3n];
+
+  @dec static accessor [f()];
+}
+
+expect(logs).toStrictEqual(["computing f", "a", "#a", "b", "c", "0", "1", "2", "3", "f()"]);

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-accessors--to-es2015/context-name/options.json

@@ -0,0 +1,3 @@
+{
+  "minNodeVersion": "14.6.0"
+}

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-accessors--to-es2015/context-name/output.js

@@ -0,0 +1,124 @@
+var _init_a, _init_a2, _get_a, _set_a, _init_computedKey, _computedKey, _init_computedKey2, _init_computedKey3, _computedKey2, _init_computedKey4, _init_computedKey5, _computedKey3, _init_computedKey6, _computedKey4, _init_computedKey7, _initStatic, _class;
+const logs = [];
+const dec = (value, context) => {
+  logs.push(context.name);
+};
+const f = () => {
+  logs.push("computing f");
+  return {
+    [Symbol.toPrimitive]: () => "f()"
+  };
+};
+_computedKey = "c";
+_computedKey2 = 1;
+_computedKey3 = 3n;
+_computedKey4 = f();
+var _a = /*#__PURE__*/new WeakMap();
+class Foo {
+  constructor() {
+    babelHelpers.classPrivateFieldInitSpec(this, _a, {
+      get: _get_a2,
+      set: _set_a2
+    });
+  }
+  static get a() {
+    return babelHelpers.classStaticPrivateFieldSpecGet(this, Foo, _A);
+  }
+  static set a(v) {
+    babelHelpers.classStaticPrivateFieldSpecSet(this, Foo, _A, v);
+  }
+  static get "b"() {
+    return babelHelpers.classStaticPrivateFieldSpecGet(this, Foo, _C);
+  }
+  static set "b"(v) {
+    babelHelpers.classStaticPrivateFieldSpecSet(this, Foo, _C, v);
+  }
+  static get [_computedKey]() {
+    return babelHelpers.classStaticPrivateFieldSpecGet(this, Foo, _D);
+  }
+  static set [_computedKey](v) {
+    babelHelpers.classStaticPrivateFieldSpecSet(this, Foo, _D, v);
+  }
+  static get 0() {
+    return babelHelpers.classStaticPrivateFieldSpecGet(this, Foo, _E);
+  }
+  static set 0(v) {
+    babelHelpers.classStaticPrivateFieldSpecSet(this, Foo, _E, v);
+  }
+  static get [_computedKey2]() {
+    return babelHelpers.classStaticPrivateFieldSpecGet(this, Foo, _F);
+  }
+  static set [_computedKey2](v) {
+    babelHelpers.classStaticPrivateFieldSpecSet(this, Foo, _F, v);
+  }
+  static get 2n() {
+    return babelHelpers.classStaticPrivateFieldSpecGet(this, Foo, _G);
+  }
+  static set 2n(v) {
+    babelHelpers.classStaticPrivateFieldSpecSet(this, Foo, _G, v);
+  }
+  static get [_computedKey3]() {
+    return babelHelpers.classStaticPrivateFieldSpecGet(this, Foo, _H);
+  }
+  static set [_computedKey3](v) {
+    babelHelpers.classStaticPrivateFieldSpecSet(this, Foo, _H, v);
+  }
+  static get [_computedKey4]() {
+    return babelHelpers.classStaticPrivateFieldSpecGet(this, Foo, _I);
+  }
+  static set [_computedKey4](v) {
+    babelHelpers.classStaticPrivateFieldSpecSet(this, Foo, _I, v);
+  }
+}
+_class = Foo;
+function _set_a2(v) {
+  _set_a(this, v);
+}
+function _get_a2() {
+  return _get_a(this);
+}
+(() => {
+  [_init_a, _init_a2, _get_a, _set_a, _init_computedKey, _init_computedKey2, _init_computedKey3, _init_computedKey4, _init_computedKey5, _init_computedKey6, _init_computedKey7, _initStatic] = babelHelpers.applyDecs(_class, [[dec, 6, "a"], [dec, 6, "a", function () {
+    return babelHelpers.classStaticPrivateFieldSpecGet(this, _class, _B);
+  }, function (value) {
+    babelHelpers.classStaticPrivateFieldSpecSet(this, _class, _B, value);
+  }], [dec, 6, "b"], [dec, 6, _computedKey], [dec, 6, 0], [dec, 6, _computedKey2], [dec, 6, 2n], [dec, 6, _computedKey3], [dec, 6, _computedKey4]], []);
+  _initStatic(_class);
+})();
+var _A = {
+  writable: true,
+  value: _init_a(_class)
+};
+var _B = {
+  writable: true,
+  value: _init_a2(_class)
+};
+var _C = {
+  writable: true,
+  value: _init_computedKey(_class)
+};
+var _D = {
+  writable: true,
+  value: _init_computedKey2(_class)
+};
+var _E = {
+  writable: true,
+  value: _init_computedKey3(_class)
+};
+var _F = {
+  writable: true,
+  value: _init_computedKey4(_class)
+};
+var _G = {
+  writable: true,
+  value: _init_computedKey5(_class)
+};
+var _H = {
+  writable: true,
+  value: _init_computedKey6(_class)
+};
+var _I = {
+  writable: true,
+  value: _init_computedKey7(_class)
+};
+expect(logs).toStrictEqual(["computing f", "a", "#a", "b", "c", "0", "1", "2", "3", "f()"]);

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-accessors/context-name/exec.js

@@ -0,0 +1,20 @@
+const logs = [];
+const dec = (value, context) => { logs.push(context.name) };
+const f = () => { logs.push("computing f"); return { [Symbol.toPrimitive]: () => "f()" }; };
+class Foo {
+  @dec static accessor a;
+  @dec static accessor #a;
+
+  @dec static accessor "b"
+  @dec static accessor ["c"];
+
+  @dec static accessor 0;
+  @dec static accessor [1];
+
+  @dec static accessor 2n;
+  @dec static accessor [3n];
+
+  @dec static accessor [f()];
+}
+
+expect(logs).toStrictEqual(["computing f", "a", "#a", "b", "c", "0", "1", "2", "3", "f()"]);

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-accessors/context-name/input.js

@@ -0,0 +1,20 @@
+const logs = [];
+const dec = (value, context) => { logs.push(context.name) };
+const f = () => { logs.push("computing f"); return { [Symbol.toPrimitive]: () => "f()" }; };
+class Foo {
+  @dec static accessor a;
+  @dec static accessor #a;
+
+  @dec static accessor "b"
+  @dec static accessor ["c"];
+
+  @dec static accessor 0;
+  @dec static accessor [1];
+
+  @dec static accessor 2n;
+  @dec static accessor [3n];
+
+  @dec static accessor [f()];
+}
+
+expect(logs).toStrictEqual(["computing f", "a", "#a", "b", "c", "0", "1", "2", "3", "f()"]);

packages/babel-plugin-proposal-decorators/test/fixtures/2021-12-accessors/context-name/options.json

@@ -0,0 +1,3 @@
+{
+  "minNodeVersion": "16.11.0"
+}