search

Automattic / jetpack

Security, performance, marketing, and design tools — Jetpack is made by WordPress experts to make WP sites safer and faster, and help you grow your traffic.
https://jetpack.com/
Other
1.59k stars 797 forks source link

Podcast Block always loads styles: wp-mediaelement.min.css and mediaelementplayer-legacy.min.css #20437

Open mikeyarce opened 3 years ago

mikeyarce commented 3 years ago

The Podcast Block in Jetpack is always loading the following stylesheets even if there is no Podcast block present or if it's being used.

http://localhost/wp-includes/js/mediaelement/wp-mediaelement.min.css?ver=5.8
http://localhost/wp-includes/js/mediaelement/mediaelementplayer-legacy.min.css?ver=4.2.16

Steps to reproduce the issue

  1. Go to a clean install of WordPress (5.8 at the time) and use the latest Jetpack release (9.9.1 but also 10-alpha has the same thing)
  2. Go to the homepage of the site
  3. Check the Network Panel
  4. See stylesheets there even though they are not needed

What I expected

If I'm not using the Podcast block, I don't need these styles being loaded.

What happened instead

They loaded.

Screenshots Screen Shot on 2021-07-22 at 14:56:29

What is happening

What's happening is that here we're declaring the style for the block: https://github.com/Automattic/jetpack/blob/cf8864a43ec2e2e740d166992c5a74d9e9aaadf7/projects/plugins/jetpack/extensions/blocks/podcast-player/podcast-player.php#L54

This passes through wp_enqueue_registered_block_scripts_and_styles here which actually does a wp_enqueue_style for the styles passed, regardless if the block is being used or not: https://github.com/WordPress/WordPress/blob/60c39d780530ac8e8c29d3619e0fbc4a88ee9eb6/wp-includes/script-loader.php#L2398

brucea8c commented 2 years ago

This is also noted in this forums post with the user looking for a fix or how to prevent these from loading.