schmod / babel-plugin-angularjs-annotate

Add Angular 1.x dependency injection annotations to ES6 code
http://schmod.github.io/babel-plugin-angularjs-annotate
MIT License
241 stars 26 forks source link

Not working when some property of the class has a Decorator #44

Open mribichich opened 6 years ago

mribichich commented 6 years ago

If your class has a Decorator, then the plugin skips the transformation.

It works for everything else. Tested changing the /* @ngInject */ comment to different places.

I'm using babel 7

class DashboardController {
/* @ngInject */
  constructor(
    private $q: ng.IQService,
    private attendanceEventService: IAttendanceEventService,
    private caseService: CaseService,
    private holidayService: HolidayService,
    private attendanceService: IAttendanceService,
    private employeeService: EmployeeService
  ) {
  }

  @AuthorizeDecorator.authorize(['getSomething'])
  getSomething() {
    ...
  }
}

This is the output from babel:

var dashboard__dec, dashboard__class;

function dashboard__applyDecoratedDescriptor(target, property, decorators, descriptor, context) {
  var desc = {};
  Object['ke' + 'ys'](descriptor).forEach(function(key) {
    desc[key] = descriptor[key];
  });
  desc.enumerable = !!desc.enumerable;
  desc.configurable = !!desc.configurable;
  if ('value' in desc || desc.initializer) {
    desc.writable = true;
  }
  desc = decorators.slice().reverse().reduce(function(desc, decorator) {
    return decorator(target, property, desc) || desc;
  }, desc);
  if (context && desc.initializer !== void 0) {
    desc.value = desc.initializer ? desc.initializer.call(context) : void 0;
    desc.initializer = undefined;
  }
  if (desc.initializer === void 0) {
    Object['define' + 'Property'](target, property, desc);
    desc = null;
  }
  return desc;
}

let DashboardController = (dashboard__dec = identity[b].authorize(['getSomething']), (
  dashboard__class = class DashboardController {
    /*@ngInject*/
    constructor($q, attendanceEventService, caseService, holidayService, attendanceService, employeeService) {
      this.$q = $q;
      this.attendanceEventService = attendanceEventService;
      this.caseService = caseService;
      this.holidayService = holidayService;
      this.attendanceService = attendanceService;
      this.employeeService = employeeService;
    }

    getSomething() {
      // ...
    }

  }, (dashboard__applyDecoratedDescriptor(dashboard__class.prototype, 
    \"getSomething\", 
    [dashboard__dec], 
    Object.getOwnPropertyDescriptor(dashboard__class.prototype, \"getSomething\"), 
    dashboard__class.prototype)), dashboard__class));

thanks

daniel-nagy commented 5 years ago

If I put /* @ngInject */ just before the constructor it works.

class Foo {
  @MyDecorator()
  someProperty: string;

  /* @ngInject */
  constructor(private $element: ng.IAugmentedJQuery) {

  }
}
thekip commented 4 years ago

The same is for Typescript decorated class with typescript configured for es2015 target:

input:

 @LegacyComponent({
  name: 'googleAutocompleteLegacy',
  template: require('./google-autocomplete.legacy.component.jade'),
  bindings: {
  },
  controllerAs: 'ctrl',
})
export class GoogleAutocompleteLegacyComponent {
  constructor(
    private $element: ng.IAugmentedJQuery,
  ) {
    'ngInject';
  }
}

Output:

let GoogleAutocompleteLegacyComponent = class GoogleAutocompleteLegacyComponent {
  /* @ngInject */
  constructor($element) {
    'ngInject';
  }
};
 // <-- NO annotation for class here

GoogleAutocompleteLegacyComponent = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__decorate"])([Object(_libs_angularjs__WEBPACK_IMPORTED_MODULE_2__["LegacyComponent"])({
  name: 'googleAutocompleteLegacy',
  template: __webpack_require__(/*! ./google-autocomplete.legacy.component.jade */ "./legacy/modules/main/components/google-autocomplete/google-autocomplete.legacy.component.jade"),
  bindings: {
  },
  controllerAs: 'ctrl'
})], GoogleAutocompleteLegacyComponent);

Seems problem take place when in generated code class assigned to a variable eq. let Foo = class Foo {}