ef4 / decorator-transforms

Better babel transforms for decorators
8 stars 5 forks source link

babel plugin Static Block issue and tracked() assertion #11

Closed betocantu93 closed 9 months ago

betocantu93 commented 9 months ago

Hello, im getting this error when trying to serve the dummy app of a v1 addon with a v2 addon as dependency whose dist was built with this package.

Static class blocks are not enabled. Please add@babel/plugin-transform-class-static-blockto your configuration

The v1 addon has ember-cli-babel 8.2.0 "which supposedly don't need it anymore, but still getting it 🤔

Here's a component in the dist of the addon ```ts import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; import { action } from '@ember/object'; import { later } from '@ember/runloop'; import { buildValidationMessages, notifyValidityChange } from '../../utils/build-validation-messages.js'; import { g, i, n } from 'decorator-transforms/runtime'; import { precompileTemplate } from '@ember/template-compilation'; import { setComponentTemplate } from '@ember/component'; class ValidatedFormFieldBase extends Component { validationProperty = 'args.value'; //cache for comparing lastIsValid; lastIsTouched; static { g(this.prototype, "_validationErrorMessages", [tracked], function () { return null; }); } #_validationErrorMessages = (i(this, "_validationErrorMessages"), void 0); static { g(this.prototype, "isTouched", [tracked], function () { return false; }); } #isTouched = (i(this, "isTouched"), void 0); get validations() { return this.args.validations || {}; } get hasErrorMessages() { return this._validationErrorMessages?.length || this.error?.length > 0; } get isValid() { return !this.isInvalid; } get isInvalid() { return this.hasErrorMessages; } get isInvalidAndTouched() { return !!(this.isInvalid && this.isTouched); } get formHasBeenValidated() { return this.isTouched; } set formHasBeenValidated(value1) { this.isTouched = value1; } get customValidations() { return this.args.customValidations || []; } get rowClasses() { return this.args.rowClasses || ''; } get rowExtra() { return this.args.rowExtra || {}; } get label() { return this.args.label || ''; } get error() { return this.args.error || []; } get options() { return this.args.options || []; } get validationErrorMessages() { let error1 = []; if (this.error.length > 0) { error1.push(...this.error); } if (this._validationErrorMessages && this._validationErrorMessages.length > 0) { error1.push(...this._validationErrorMessages); } if (error1.length === 0) { return null; } return error1; } constructor(owner1, args1) { super(owner1, args1); this.args.register?.(this); } //Should be executed by the child on start setValidationMessages() { this._validationErrorMessages = buildValidationMessages.call(this, this.validationProperty); } //Should be executed by the child on value update static { n(this.prototype, "setValidationMessages", [action]); } didUpdateValue() { later(() => { if (!this.isDestroyed && !this.isDestroying) { this.setValidationMessages(); this.notifyValidityChange(); } }, 1); } static { n(this.prototype, "didUpdateValue", [action]); } notifyValidityChange() { notifyValidityChange(this, this.args.onValidityChange); } static { n(this.prototype, "notifyValidityChange", [action]); } setIsTouched(val1) { this.isTouched = val1; this.notifyValidityChange(); } /** * This is just a default handleChange, you should override this method * if you need to or use whatever mechanism to bubble the changed * value outside and then notifyValidityChanges * * @override * @param {*} e */ static { n(this.prototype, "setIsTouched", [action]); } handleChange(e1) { const value1 = e1.target.value; this.args.onChange(value1); this.notifyValidityChange(); } static { n(this.prototype, "handleChange", [action]); } willDestroy() { super.willDestroy(); this.args.unregister?.(this); } static #_ = setComponentTemplate(precompileTemplate("\n {{!--@glint-expect-error--}}\n {{yield this}}\n ", { strictMode: true }), this); } export { ValidatedFormFieldBase as default }; //# sourceMappingURL=field-base.js.map ```

Also tried adding the plugin and ember-cli-babel is telling its no longer needed

betocantu93 commented 9 months ago

I extracted the repro but I couldnt actually get the same bug, but I did got a new one:

Screen Shot 2024-01-04 at 23 34 51
betocantu93 commented 9 months ago

https://github.com/betocantu93/repro-eui

ef4 commented 9 months ago

I think you need ember-auto-import >= 2.7.0.

betocantu93 commented 9 months ago

@ef4 yup! v2.7.0 made it work for static block error, thanks!

but im still getting the tracked() one

betocantu93 commented 9 months ago

Seems like this.prototype is undefined

static {
    g(this.prototype, "_validationErrorMessages", [tracked], function () {
      return null;
    });
  }
betocantu93 commented 9 months ago

I think something was cached or so, it's now working.

This package ~v1.0.3 Ember cli babel ~8.2.0 Ember auto import ~2.7.0

Rebuilt, rereleased and it's now working. Thanks!