AngularStrap tabs work with grunt serve but not grunt serve:dist

[mickodo]

• [ ] I understand that GitHub issues are not for tech support, but for questions specific to this generator, bug reports, and feature requests.

The AngularStrap tabs functionality works great when the site/app is run with the grunt serve command, but when the grunt serve:dist command is used the tabs disable feature does not work.

In particular, the 'disabled' flag works with grunt serve, with the relevant tabs being properly disabled, but with grunt serve:dist the tabs are not disabled.

The following code added to a standard angular-fullstack generated project will reproduce this issue (adding 'mgcrea.ngStrap' to the client dependencies also and installing it via bower) - the final tab is not disabled as it should be when run via grunt server:dist:

main.controller.js:

use strict';

angular.module('tabTestApp')
  .component('main', {
    templateUrl: 'app/main/main.html',
    controller: function($scope, $templateCache) {
                    $scope.tabs = [
                      {title:'Select Video', content: 'test 0'},
                      {title:'Edit Video', content: 'test 1'},
                      {title:'Edit Audio', content: 'test 2'},
                      {title:'Play back', content: 'test 3'},
                    ];

                    $scope.tabs[1].disabled = 'false';
                    $scope.tabs[2].disabled = "false";
                    $scope.tabs[3].disabled = "true";
                    $scope.tabs.activeTab = 0;
                }

  });

main.html:

<!-- Partial for view1
    This partial contains tabs using AngularStrap tab mechanism -->
<div class="bs-docs-section" >
    <!-- bsActivePane is optional - see angular-starp documentation -->
    <div bs-active-pane="tabs.activeTab" bs-tabs>
      <div ng-repeat="tab in tabs" title="{{ tab.title }}" name="{{ tab.title }}" disabled="{{ tab.disabled }}" ng-bind="tab.content" bs-pane>
      </div>
    </div>
</div>

[Awk34]

I doubt it's something wrong with this generator, but what exactly is going wrong in prod compared to dev? need more details

[mickodo]

I think it most likely is some interaction between the generator and AngularStrap.

The easiest way to understand the problem may be with some images of the results.

This is what the site looks like when the command 'grunt serve' is used:

And this is what it looks like when the command grunt serve:dist is used (see the last tab below which is set to disabled in the code above is not disabled in this case, although it is above):

[Awk34]

¯_(ツ)_/¯ idk, I'd go ask on Stack Overflow

[mickodo]

I'm not sure why this is closed - the same code behaves differently in a dev and production environment, is this not something Angular-fullstack would be concerned about?

[Awk34]

I doubt it's an error with the setup from this generator. I suspect it's either an error in the lib you're using (AngularStrap) or your own error

[Awk34]

If you find out what's actually going on and think that there's an error with this generator, feel free to come back and re-open this issue. I don't have the time to help you debug this issue.

[mickodo]

Ok - see here for an explanation of what caused the problem: http://stackoverflow.com/a/37301477/334402

Technically it is caused by the setting in the generator created grunt-file, but it could be argued (and I am sure will be...) that the library should work with widespread used minifictaion tools.

I've raised it with the AngularStap project to take a look.

One comment relevant here - by the nature of this scaffolding project, there will likely be other cases where the dev and build versions of a project behave differently. Having some sort go guide or steps to follow to debug or narrow this down would be a useful resource, I think.

[Awk34]

@mickodo so from what I gather from the SO issue, it would be best to just set collapseBooleanAttributes: false in the generator's Gruntfile? You can submit a PR for that if you'd like.

[mickodo]

I'd wait to see that the AngularStap guys say first: https://github.com/mgcrea/angular-strap/issues/2109

It may be that they can change the approach so it works with HTML minifier as it stands today.

[Awk34]

@mickodo well, it seems that with that settings that someone else could run into this issue without using AngularStrap. The problem seems to be specific to just this generator's Grunt & ngTemplates settings, and using a boolean HTML attribute with an Angular binding

[Awk34]

Closed due to inactivity