refactor: call no-js removal earlier

- Moves the `no-js` class to the `html` element. - Remove the class early with a inlined script tag in the head. - Adds `js` class - Use `@wordpress/dom-ready` in editor script. - Remove our `domReady` utility.
roots · Dec 29, 2021 · 5b7326c · 5b7326c
1 parent f1adf08
commit 5b7326c
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 27 deletions.
diff --git a/index.php b/index.php
@@ -1,12 +1,16 @@
 <!doctype html>
-<html <?php language_attributes(); ?>>
+<html <?php language_attributes(); ?> class="no-js">
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
+    <script type="module">
+      document.documentElement.classList.remove('no-js');
+      document.documentElement.classList.add('js');
+    </script>
     <?php wp_head(); ?>
   </head>
 
-  <body <?php body_class('no-js'); ?>>
+  <body <?php body_class(); ?>>
     <?php wp_body_open(); ?>
     <?php do_action('get_header'); ?>
 

diff --git a/resources/scripts/app.js b/resources/scripts/app.js
@@ -1,14 +1,3 @@
-import {domReady} from '@scripts/components';
-
-/**
- * Remove `.no-js` from document body
- * when DOM has loaded.
- */
-domReady(() => {
-  document.body.classList.contains('no-js') &&
-    document.body.classList.remove('no-js');
-});
-
 /**
  * Accept module updates
  *

diff --git a/resources/scripts/components/index.js b/resources/scripts/components/index.js
diff --git a/resources/scripts/editor.js b/resources/scripts/editor.js
@@ -1,7 +1,6 @@
 import '@wordpress/edit-post';
 import {registerBlockStyle, unregisterBlockStyle} from '@wordpress/blocks';
-
-import {domReady} from '@scripts/components';
+import domReady from '@wordpress/dom-ready';
 
 /**
  * Customize block styles