Issue of angular-permission-ui with gulp-uglify
mort3za opened this issue · 6 comments
When i use uglify, angular-permission-ui is broken, But when i disable uglify only on this file, Everything just works.
What is your error? What version of angular-permission are you using?
TypeError: n.$$permissionState is not a function
here:
function n(n) {
var i = n.$$permissionState()
, r = i.path;
I use version 4.1.2
Update
Tested with v 5.1.0 and problem exists.
I think your problem is order of concatenated files before minification. Please ensure that ui-router is included before angular-permission. This would assure that internal ui-router methods are present.
I don't think because when i replace the part of uglified file that has angular-permission-ui with original angular-permission-ui in my build folder, Everything works. The problem is just that part.
This is the result of uglify process for angular-permission-ui:
!function(t,e,n){"use strict";function o(t){"ngInject";t.decorator("$state",["a",function(t){return t.self.$$permissionState=function(){return t},t}])}function i(t,n,o,i,r,a){"ngInject";t.$on("$stateChangeStart",function(t,s,c,u,m,f){function d(){o.toState=s,o.toParams=c,o.fromState=u,o.fromParams=m,o.options=f}function p(t){e.extend(s,{$$isAuthorizationFinished:t})}function P(){return s.$$isAuthorizationFinished}function h(){i.broadcastPermissionAcceptedEvent();var t=e.extend({},o.options,{notify:!1,location:!0});n.go(o.toState.name,o.toParams,t).then(function(){i.broadcastStateChangeSuccessEvent()})}function l(t,e){i.broadcastPermissionDeniedEvent(),e.resolveRedirectState(t).then(function(t){n.go(t.state,t.params,t.options)})}if(!P())if(p(!0),d(),i.areEventsDefaultPrevented())p(!1);else{i.broadcastPermissionStartEvent(),t.preventDefault();var $=new a(o.toState);r.authorizeByPermissionMap($).then(function(){h()}).catch(function(t){l(t,$)}).finally(function(){p(!1)})}})}function r(t,e,n,o){"ngInject";function i(){return u()||m()}function r(){e.$broadcast(o.permissionStart,n.toState,n.toParams,n.options)}function a(){e.$broadcast(o.permissionAccepted,n.toState,n.toParams,n.options)}function s(){e.$broadcast(o.permissionDenies,n.toState,n.toParams,n.options)}function c(){e.$broadcast("$stateChangeSuccess",n.toState,n.toParams,n.fromState,n.fromParams)}function u(){return e.$broadcast(o.permissionStart,n.toState,n.toParams,n.options).defaultPrevented}function m(){return e.$broadcast("$stateChangeStart",n.toState,n.toParams,n.fromState,n.fromParams,n.options).defaultPrevented}return i.$inject=["a","b","c","d"],t.areEventsDefaultPrevented=i,t.broadcastStateChangeSuccessEvent=c,t.broadcastPermissionStartEvent=r,t.broadcastPermissionAcceptedEvent=a,t.broadcastPermissionDeniedEvent=s,t}function a(t,n,o){"ngInject";function i(t){return a(t)}function r(t){var e=n.get(t),r=new o(e);return i(r)}function a(e){var n=t.defer();return s(n,e),n.promise}function s(e,n){var o=u(n.except,n);t.all(o).then(function(t){e.reject(t[0])}).catch(function(){c(e,n)})}function c(e,n){if(!n.only.length)return void e.resolve();var o=u(n.only,n);t.all(o).then(function(t){e.resolve(t)}).catch(function(t){e.reject(t)})}function u(n,o){return n.length?n.map(function(n){var i=o.resolvePropertyValidity(n);return t.any(i).then(function(t){return e.isArray(t)?t[0]:t})}):[t.reject()]}a.$inject=["a","b","c"],this.authorizeByPermissionMap=i,this.authorizeByStateName=r}function s(t){"ngInject";function n(n){var i=n.$$permissionState(),r=i.path;e.forEach(r,function(e){if(o(e)){var n=new t(e.data.permissions);this.extendPermissionMap(n)}},this)}function o(t){try{return Object.prototype.hasOwnProperty.call(t.data,"permissions")}catch(t){return!1}}return n.prototype=new t,n.prototype.extendPermissionMap=function(t){t.only.length&&(this.only=this.only.concat([t.only])),t.except.length&&(this.except=this.except.concat([t.except])),e.isDefined(t.redirectTo)&&(this.redirectTo=e.extend({},this.redirectTo,t.redirectTo))},n}s.$inject=["a"],o.$inject=["a"],i.$inject=["a","b","c","d","e","f"],o.$inject=["$stateProvider"],i.$inject=["$rootScope","$state","PermTransitionProperties","PermTransitionEvents","PermStateAuthorization","PermStatePermissionMap"],r.$inject=["$delegate","$rootScope","PermTransitionProperties","PermTransitionEventNames"],a.$inject=["$q","$state","PermStatePermissionMap"],s.$inject=["PermPermissionMap"];var c=e.module("permission.ui",["permission","ui.router"]).config(o).run(i);"undefined"!=typeof module&&"undefined"!=typeof exports&&module.exports===exports&&(module.exports=c.name),e.module("permission.ui").decorator("PermTransitionEvents",r);var u={permissionStart:"$stateChangePermissionStart",permissionAccepted:"$stateChangePermissionAccepted",permissionDenies:"$stateChangePermissionDenied"};e.module("permission.ui").value("PermTransitionEventNames",u),e.module("permission").service("PermStateAuthorization",a),e.module("permission.ui").factory("PermStatePermissionMap",s)}(window,window.angular);
By replacing this part (in output file in build folder) with angular-permission-ui.js, there is no error again. Just tested again for ensure of this a minute ago.
If we compare the "unminified" source code of angular-permission-ui, line 13
$stateProvider.decorator('$state', function (state) {
became,
$stateProvider.decorator("$state", ["a", function(tp) {
So it seems the function passed to the decorator injects a dependency called a.
I don't get why this is happening. Maybe we are missing a 'ngInject'; line inside the decorator?