babel-plugin-angularjs-annotate icon indicating copy to clipboard operation
babel-plugin-angularjs-annotate copied to clipboard

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

Open andrey-skl opened this issue 3 years ago • 0 comments

  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?

andrey-skl avatar Mar 16 '21 14:03 andrey-skl