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

Underscore "_" breaks annotations when "@babel/plugin-proposal-class-properties" is used #57

Open andrey-skl opened 3 years ago

andrey-skl commented 3 years ago
  1. Have a babel setup that transforms class properties. For example, babel/preset-env
  2. Have the following code, where a function is assigned as a class property AND variable with same name as injected dependency is used inside:
const serviceModule = angular.module('serviceservice', []);

class Service {
  constructor($location) {
    this.$inject = {$location: $location};
  }

  reload = () => {
    const $location = this.$inject.$location;
    const query = $location.search().query;
  };
}

serviceModule.service('service', Service);
  1. Try to handle this case with 'babel-plugin-angularjs-annotate'. See reproduction here

Expected: $location is properly annotated Actual: $location is renamed to _$location by @babel/plugin-proposal-class-properties transformer. Then babel-plugin-angularjs-annotate fails to handle it:

const serviceModule = angular.module("serviceservice", []);

class Service {
  constructor(_$location) {
    this.reload = async () => {
      const { $location } = this.$inject;
      const query = $location.search().query;
    };

    this.$inject = {
      $location: _$location
    };
  }
}

Service.$inject = ["_$location"];
serviceModule.service("service", Service);

Possible solution: maybe babel-plugin-angularjs-annotate can automatically detect that argument was renamed with adding "_" and rename it back when constructing $inject?