Remove usages of .js class from core

I have attached patch for 11.x, please review
Also the issue reported in #16 & 14 are no longer reproducible with this patch. thanks

Fixed the build errors.

Think there's some BC to consider before just fully removing no?

yash.rode → made their first commit to this issue’s fork.

As patch testing will be stopped form 1st july → .

The MR is only removing usages of the class, not the class itself, so there is no bc issue with the current MR. I think we could keep this issue to remove usages and open a second issue to stop adding the class.

I do think we need some kind of bc layer here because CSS written to use the js class will just stop working without it.

The class is set in:

drupal.init.js

document.documentElement.className += ' js';

One possibility for bc would be to add a new module to core, which does exactly this via altering a js file into the core library definition, enable that module by default in a post update, but have it uninstalled for new sites (or sites that uninstall it). We could then deprecate that module in Drupal 11 and make it obsolete in Drupal 12. Just writing that out makes me think two issues would make this easier to get done rather than trying to tackle both here.

Sounds like a good plan, updated issue summary

@smustgrave in #44 I was suggesting to do that plan in a new issue, not in this one because I think it'll be a bit complex to attempt both. I've opened 📌 Move the .js class logic into a new module, then deprecate it for removal in Drupal 12 Active and adjusted the issue summary.

Oh I had read it that maybe it could be included here but cool.

So in regards to this ticket of removing, did a search for .js in css files and found more instances

Currently looking into this.

Removed the pending .js class from the css files and added a commit. Please review.

I'm very confused about this change. See my MR comment, js might not be used much directly, but the js-show and js-hide classes have 10+ usages in core alone and the proposed change completely breaks the functionality of that.

How come issue summary was removed?

.js-show and .js-hide should not be included here.

Those are now implemented without having to execute or load any JavaScript at all:

/**
 * Use the scripting media features for modern browsers to reduce layout shifts.
 */
@media (scripting: enabled) {
  /* Extra specificity to override previous selector. */
  .js-hide.js-hide {
    display: none;
  }
  .js-show {
    display: block;
  }

from <code>core/modules/system/css/components/js.module.css

i.e. we have a CSS-only implementation for .js-show and .js-hide, the .js class is only added so that .js .js-hide works, which is not necessary with the media query.

So this issue should be about removing the JavaScript implementation and the .js class, leaving the CSS-only implementation intact.

Hiding patches for clarity.

I'm not seeing the removal of js-hide or js-show in the MR?

@smustgrave it's https://git.drupalcode.org/project/drupal/-/merge_requests/8370/diffs#e8... as pointed out by @berdir in the MR

That is the thing that makes .js-hide work on browsers that don't support @media (scripting: enabled), which used to be all of them when it was added, but is not necessary now (except there are a couple of 'unknowns' on https://caniuse.com/?search=media%20scripting%3A)

This file should have been the only ever usage of the class in core or anywhere else, because the whole point of it is to make .js-hide and .js-show work, not for styling things independently of those, but it's clear that usages have crept in over time.

That CSS would need to be handled in 📌 Move the .js class logic into a new module, then deprecate it for removal in Drupal 12 Active but should be left here.