Angular.js: jQuery migrate 3.0.1 shows warnings with angularjs 1.7.6-1.7.8 for removeAttr

Created on 27 May 2019 · 4Comments · Source: angular/angular.js

AngularJS is in LTS mode

We are no longer accepting changes that are not critical bug fixes into this project.
See https://blog.angular.io/stable-angularjs-and-long-term-support-7e077635ee9c for more detail.

I'm submitting a ...

Current behavior:

jQuery migrate 3.0.1 shows warnings as "JQMIGRATE: jQuery.fn.removeAttr no longer sets boolean properties: disabled" with angular 1.7.6 to 1.7.8.

Expected / new behavior:

As per jQuery migrate documentation removeAttr should not be used. Instead .prop( "checked", false ) should be used.
https://github.com/jquery/jquery-migrate/blob/master/warnings.md

Minimal reproduction of the problem with instructions:

AngularJS version: 1.7.x

Yes this issue occurs with most recent version of angularjs 1.7.8.

Anything else:

Instead of using .removeAttr("checked") we can use .prop("checked", false)

Source

git-ram-pal

👍3

@git-ram-pal Thanks for the report. While you closed it, I still wanted to provide some details here:

AngularJS doesn't support jQuery with Migrate. While it may work in many cases, it's not something that we actively test.
jQuery itself doesn't produce any warnings; Migrate does when it encounters usage it considers deprecated. Therefore, removing Migrate will always silence warnings.
While my change in AngularJS introduce the warning (thanks for finding the cause by yourself!) I think jQuery Migrate should have warned about the original code as well as they are equivalent - in other words, in jQuery in HTML mode elem.attr(booleanAttr, false) is equivalent to elem.removeAttr(booleanAttr).
The warning means that boolean properties should be handled instead of boolean attributes, i.e. the prop method should be used instead of attr. Just using attr may not update some boolean properties properly. AngularJS updates the attributes but it also updates the properties. Therefore, we're already doing what Migrate advises to do here, we just also update attributes. Migrate cannot know we're doing both so it warns but this warning should be harmless.

mgol on 5 Jun 2019

👍3

git-ram-pal on 27 May 2019

Screenshot 2019-05-28 at 2 51 22 PM

git-ram-pal on 28 May 2019

This issue only occurs if we include jQuery migrate in our application.
Closing the ticket as application works fine if we remove jQuery migrate.

git-ram-pal on 4 Jun 2019

👍1

@git-ram-pal Thanks for the report. While you closed it, I still wanted to provide some details here:

AngularJS doesn't support jQuery with Migrate. While it may work in many cases, it's not something that we actively test.
jQuery itself doesn't produce any warnings; Migrate does when it encounters usage it considers deprecated. Therefore, removing Migrate will always silence warnings.
While my change in AngularJS introduce the warning (thanks for finding the cause by yourself!) I think jQuery Migrate should have warned about the original code as well as they are equivalent - in other words, in jQuery in HTML mode elem.attr(booleanAttr, false) is equivalent to elem.removeAttr(booleanAttr).
The warning means that boolean properties should be handled instead of boolean attributes, i.e. the prop method should be used instead of attr. Just using attr may not update some boolean properties properly. AngularJS updates the attributes but it also updates the properties. Therefore, we're already doing what Migrate advises to do here, we just also update attributes. Migrate cannot know we're doing both so it warns but this warning should be harmless.