Cannot use custom decorator on class property?

[LordZardeck]

I'm submitting a bug report

• Library Version:
  1.0.1
• Operating System:
  OSX 10.11
• Node Version:
  6.2.2
• NPM Version:
  3.9.5
• JSPM OR Webpack AND Version
  JSPM 0.16.41
• Browser:
  Chrome 52.0.2743.82
• Language:
  ESNext

Current behavior:
When adding custom decorator, i am no longer able to bind to properties on a class. I instead get errors like this: WARN [property-observation] Cannot observe property 'brands' of object

Expected/desired behavior:

It should allow me to utilize my own custom decorator and still bind to the property.

I tried replicating the issue by forking https://gist.run/?id=7542e061bc940cde506b&sha=6821c521a6c7bae6f59a36fb8628ecd1032b2d10, but I could not replicate it. I'm beginning to wonder if that gist is running the old Babel 5, and that this is only an issue with Babel 6 with the legacy decorator plugin.

[doktordirk]

ps: this is a babel issue. i tried with typescript (2 i think), and did not have this problem

[LordZardeck]

Yep, babel issue.

[doublemarked]

The babel guys (from the Issue link above) seem to disagree that it's a Babel issue, referencing semi-recent changes to TC39?

[EisenbergEffect]

@doublemarked Can you get a link to the latest spec and find out what the change was?

[doublemarked]

@EisenbergEffect I don't know where this is in the spec, but I believe this discussion here is highly relevant: tc39/proposal-class-public-fields#36

@doktordirk started discussing with them there as well but things seem to have stalled.

Anyways - I don't feel informed enough to determine whether it's a problem in Aurelia or in Babel, but I encountered the problem last night and think it would be good to reopen the issue somewhere. Currently it's marked closed in both projects.

[doktordirk]

here's a fix:

 // fix for babels property decorator
export function ensurePropertyIsConfigurable(target, propertyName, descriptor) {
  if (descriptor && descriptor.configurable === false) {
    descriptor.configurable = true;

    if (!Reflect.defineProperty(target, propertyName, descriptor)) {
      logger.warn(`Cannot make configurable property '${propertyName}' of object`, target);
    }
  }
}

usage:`

  /*
   * @decorator
   */
export function aDecoator() {
  return function(target, propertyName, descriptor) {
    ensurePropertyIsConfigurable(target, propertyName, descriptor);

   /* your code */
  };
}