Use JavaScript classList API

[Jon Dufresne]

Some JavaScript code does string matching with the .className. This can be simplified with the newer classList API designed to add, remove, and check for classes in HTML elements.

​https://developer.mozilla.org/en-US/docs/Web/API/Element/classList

[Jon Dufresne]

​https://github.com/django/django/pull/12139

[Claude Paroz]

Jon, I like your cleanup work a lot!
However, about the admin JavaScript code, I think we should more clearly state the minimal browser version supported. A quick search revealed this ​FAQ entry which might be outdated by now.
Read also ​this django-developers thread. I think we should make it clearer in the docs before continuing the cleanup work.

[Jon Dufresne]

Thanks. The classList API is already in use by the Django admin.

django/contrib/admin/static/admin/js/collapse.js
21                   elem.classList.add('collapsed');
39                   if (fieldset.classList.contains('collapsed')) {
42                       fieldset.classList.remove('collapsed');
46                       fieldset.classList.add('collapsed');

The commit where this was introduced is ba83378a7762c51be235b521aa5b48233d6c6c82. This shipped with 2.2.

So this change is not introducing a new, untested API.

I think being more explicit about support is a great idea and a solid improvement. I just question why it should guard this particular change.

[Claude Paroz]

Fair, if it is already used, then let's go ahead.

I created #31032 for the docs issue.

[Carlton Gibson <carlton.gibson@…>]

In 46a0edc3:

Fixed #31028 -- Used classList API to check, add and remove DOM classes.

Thanks to Claude Paroz for review.