wp-rocket icon indicating copy to clipboard operation
wp-rocket copied to clipboard

Delay JS: Fix W3C markup for the rocketlazyloadscript attribute

Open gmetais opened this issue 6 months ago • 0 comments

Context The current syntax for scripts delayed by Delay JS is <script type="rocketlazyloadscript" ...>. This is causing warnings in the https://validator.w3.org/ markup validator:

Error: Bad value rocketlazyloadscript for attribute type on element [script](https://html.spec.whatwg.org/multipage/#the-script-element): Subtype missing. 

The chosen solution requires to change the type to text/rocketlazyloadscript, both of the frontend part and the backend part of Delay JS. The frontend change is being implemented for a release in the next major version of DelayJS (v2.0).

Fixes https://github.com/wp-media/delay-javascript-loading/issues/99.

Current behavior <script type="rocketlazyloadscript" ...>

Expected behavior <script type="text/rocketlazyloadscript" ...>

Acceptance Criteria

  • All scripts delayed with DelayJS should have the attribute type="text/rocketlazyloadscript" instead of type="rocketlazyloadscript" in the initial HTML source code generated by WP Rocket.
  • It should apply on both inline scripts and external scripts.

Additional information The frontend (v2.0) will be compatible with both syntaxes (old and new). So the frontend update can be deployed in production before this backend change. The opposite is wrong. So DelayJS v2.0 is a prerequisite for the PHP change.

Risks Risk of regression is low, except if some 3rd parties (themes / plugins / libraries) have developed some features that reads the type="rocketlazyloadscript" attribute. Also, our Support team developed a debugging snippet that will probably require a small update.

gmetais avatar Aug 05 '24 22:08 gmetais