Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

7.26.7: Decorating class property failed. Please ensure that proposal-class-properties is enabled and runs after the decorators transform. #425

Closed
NullVoxPopuli opened this issue Dec 16, 2021 · 11 comments

Comments

@NullVoxPopuli
Copy link
Sponsor Contributor

NullVoxPopuli commented Dec 16, 2021

Just got this in an OSS project (which I'm not sharing the link to, cause I have a toooon in flux 😅 ).

but anyway, just tracking the error here for discussion. if I come to a resolution, I'll post about it.

What's interesting about this error is that it's a runtime error. The build succeeded.

Using embroider:

Uncaught (in promise) Error: Decorating class property failed. Please ensure that proposal-class-properties is enabled and runs after the decorators transform.
    _initializerWarningHelper chunk.a5b0aa63f7c9da1d786b.js:44777
    _class chunk.a5b0aa63f7c9da1d786b.js:40318
    PageTitle chunk.a5b0aa63f7c9da1d786b.js:40325
    Ember 4
    getHelper manager.js:863
    <anonymous> runtime.js:2042
    evaluate runtime.js:1284
    evaluateSyscall runtime.js:5064
    evaluateInner runtime.js:5020

image

@NullVoxPopuli
Copy link
Sponsor Contributor Author

More info -- I was able to delete addon invocations until I could work with my own code, got this: (I also turned on sourcemaps):
image

the compiled output though is this:

let DemoSelect = (_class = class DemoSelect extends _glimmer_component__WEBPACK_IMPORTED_MODULE_4__["default"] {
  editor = (0,_home_nullvoxpopuli_Development_NullVoxPopuli_limber_node_modules_babel_runtime_helpers_esm_initializerWarningHelper_js__WEBPACK_IMPORTED_MODULE_1__["default"])(_descriptor, this);
  demos = _snippets__WEBPACK_IMPORTED_MODULE_8__.NAMES;

  async select(demoName) {
    let demo = await (0,_snippets__WEBPACK_IMPORTED_MODULE_8__.getFromLabel)(demoName);
    this.editor.updateDemo(demo);
  }

}, (_descriptor = (0,_home_nullvoxpopuli_Development_NullVoxPopuli_limber_node_modules_babel_runtime_helpers_esm_applyDecoratedDescriptor_js__WEBPACK_IMPORTED_MODULE_0__["default"])(_class.prototype, "editor", [_externals_ember_service__WEBPACK_IMPORTED_MODULE_6__.inject], {
  configurable: true,
  enumerable: true,
  writable: true,
  initializer: null
}), (0,_home_nullvoxpopuli_Development_NullVoxPopuli_limber_node_modules_babel_runtime_helpers_esm_applyDecoratedDescriptor_js__WEBPACK_IMPORTED_MODULE_0__["default"])(_class.prototype, "select", [_externals_ember_object__WEBPACK_IMPORTED_MODULE_5__.action, _ember_test_waiters__WEBPACK_IMPORTED_MODULE_7__.waitFor], Object.getOwnPropertyDescriptor(_class.prototype, "select"), _class.prototype)), _class);

(0,_externals_ember_component__WEBPACK_IMPORTED_MODULE_2__.setComponentTemplate)(_demo_select_hbs__WEBPACK_IMPORTED_MODULE_3__["default"], DemoSelect);

/***/ }),

@NullVoxPopuli
Copy link
Sponsor Contributor Author

NullVoxPopuli commented Dec 16, 2021

what's interesting to me here is that the seems to be applied after the class.

initializeWarningHelper is def a part of that first assignment at the top of the class

@NullVoxPopuli
Copy link
Sponsor Contributor Author

Seems to be that

       cliBabelInstance.isPluginRequired(
         "proposal-class-properties"
       ),

is returning false for my environment -- which is correct, but, why are the decorators flaking out? 🤔
setting to false can get me passed the error, but it I need to figure out why the decorators plugin thinks class properties also need transpilation

@NullVoxPopuli
Copy link
Sponsor Contributor Author

NullVoxPopuli commented Dec 16, 2021

embroider is using @babel/preset-env and is correctly using my targets (last 1 chrome, last 1 firefox).

So maybe the decorators plugin is losing track of my targets, perhaps?

@bendemboski
Copy link

FWIW, the same thing is happening in fractal-page-object

@chriskrycho
Copy link
Contributor

This is exposed by #420, and in fact reflects what the original code that #420 tweaked was designed to address. It should be handled by @babel/preset-env and, transitively, caniuse-lite, so you might start by making sure those are up to date, including any transitive dependencies. I updated ember-cli-babel's direct dependencies on those, but if you have older ones, that may be the issue.

@NullVoxPopuli
Copy link
Sponsor Contributor Author

I just tried pinning to the latest versions of @babel/preset-env and caniuse-lite (via resolutions in a yarn monorepo), but the issue remains. I think there is maybe some other nuance I'm missing -- will check ember-cli-babel's direct dependencies next -- though, I've tried deleting my lockfile a time or two

@chriskrycho
Copy link
Contributor

See #426 – will be updating status there. @NullVoxPopuli do you mind closing this in favor of #423 so we can centralize discussion there? Thanks.

@NullVoxPopuli
Copy link
Sponsor Contributor Author

I am having a hard time reproducing this issue tho. 🤔 super weird.
I have a reproduction script tho: #422 (comment)

@NullVoxPopuli
Copy link
Sponsor Contributor Author

this in favor of #423 so we can centralize discussion there? Thanks.

you bet! 🎉

@NullVoxPopuli
Copy link
Sponsor Contributor Author

NullVoxPopuli commented Sep 10, 2022

I have a reproduction now -- posted here, in a less busy, still open issue: #447 (comment)

I also found that some files (post-minification) can be up to 70% smaller when class properties are not transpiled / polyfilled away... so.. I'm very eager to figure this out 🙃

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants