babel: [Bug]: Code generated by Babel for decorated static accessors throws SyntaxError in Firefox
💻
- Would you like to work on a fix?
How are you using Babel?
Input code
function decorateClass(target, context) {
}
function decorateAccessor(target, context) {
}
@decorateClass
class Test {
@decorateAccessor static accessor foo = 42;
}
// > SyntaxError: reference to undeclared private field or method #A
Configuration file name
babel.config.mjs
Configuration
/* eslint-env node */
const config = {
presets: [
["@babel/preset-env", {}],
["@babel/preset-typescript", { allowDeclareFields: true }],
// See https://github.com/babel/babel/issues/16373#issuecomment-2013163733
],
};
if (process.env.NODE_ENV === "test") {
config.plugins = [
[
"@babel/plugin-proposal-decorators",
{
version: "2023-11",
},
],
];
}
export default config;
Current and expected behavior
Current behavior: with targets
set to last 3 versions, not dead
, the generated code throws a syntax error in Firefox. This may be a Firefox problem rather than a Babel problem. Tested with Firefox 124.0.1 (64-bit) and Nightly 126.0a1 (2024-03-24) (64-bit).
Expected behavior: no syntax error in any browser
Environment
- System:
- OS: Linux 6.5 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish)
- Binaries:
- Node: 20.11.0 - ~/.volta/tools/image/node/20.11.0/bin/node
- npm: 10.2.4 - ~/.volta/tools/image/node/20.11.0/bin/npm
- npmPackages:
- @babel/cli: ^7.22.5 => 7.24.1
- @babel/core: ^7.22.1 => 7.24.3
- @babel/plugin-proposal-decorators: ^7.22.3 => 7.24.1
- @babel/preset-env: ^7.22.4 => 7.24.3
- @babel/preset-typescript: ^7.21.5 => 7.24.1
- eslint: ^8.41.0 => 8.57.0
Possible solution
No response
Additional context
No response
About this issue
- Original URL
- State: closed
- Created 3 months ago
- Comments: 16 (15 by maintainers)
I think that is the same bug. Chrome doesn’t throw because the function is never called.
An even minimal example is
the class in the computed key is needed, but the private access doesn’t need to be inside the class
Thank you. The bugfix is your idea, go ahead, meanwhile I will be kept busy by a few other decorators bugs.
Well the decorator transform already output the class in the first static property.
This code on the other hand works:
Maybe this hints at a better fix than wrapping in an IIFE 🤔
Even smaller reproduction, from Firefox folks 😃
This throws in Firefox.
It seems like wrapping the computed key in an IIFE works: