In Likes and Comment Likes modules, prevent blocking page load… (#14841)

* Prevent blocking page load with 2 scripts in Like module These both depend on jquery, so this could remove even another script from blocking rendering. * Don't enqueue script if the Likes module isn't visible As Dan raised, this should not enqueue this JS if this isn't in the document. * [not verified] Apply a similar change to the Comment Likes module Don't enqueue scripts if likes aren't enabled, and move the dependencies to the footer, as the script that depends on them, 'jetpack_likes_queuehandler', is in the footer. It doesn't seem necessary for these to be above the footer. * Fix a unit test that asserted the opposite It should ensure that the styles are present, not that they aren't.
Automattic · Mar 5, 2020 · 4f09d39 · 4f09d39
1 parent 7968380
commit 4f09d39
Show file tree

Hide file tree

Showing 5 changed files with 87 additions and 7 deletions.
diff --git a/modules/comment-likes.php b/modules/comment-likes.php
@@ -129,6 +129,10 @@ public function frontend_init() {
 	}
 
 	public function load_styles_register_scripts() {
+		if ( ! $this->settings->is_likes_visible() ) {
+			return;
+		}
+
 		if ( ! wp_style_is( 'open-sans', 'registered' ) ) {
 			wp_register_style( 'open-sans', 'https://fonts.googleapis.com/css?family=Open+Sans', array(), JETPACK__VERSION );
 		}
@@ -138,7 +142,7 @@ public function load_styles_register_scripts() {
 			Assets::get_file_url_for_environment( '_inc/build/postmessage.min.js', '_inc/postmessage.js' ),
 			array( 'jquery' ),
 			JETPACK__VERSION,
-			false
+			true
 		);
 		wp_enqueue_script(
 			'jetpack_resize',
@@ -148,7 +152,7 @@ public function load_styles_register_scripts() {
 			),
 			array( 'jquery' ),
 			JETPACK__VERSION,
-			false
+			true
 		);
 		wp_enqueue_script( 'jetpack_likes_queuehandler', plugins_url( 'likes/queuehandler.js' , __FILE__ ), array( 'jquery', 'postmessage', 'jetpack_resize' ), JETPACK__VERSION, true );
 	}

diff --git a/modules/likes.php b/modules/likes.php
@@ -253,7 +253,7 @@ function admin_init() {
 	}
 
 	function action_init() {
-		if ( is_admin() ) {
+		if ( is_admin() || ! $this->settings->is_likes_visible() ) {
 			return;
 		}
 
@@ -280,8 +280,8 @@ class_exists( 'Jetpack_AMP_Support' )
 			add_filter( 'post_flair', array( &$this, 'post_likes' ), 30, 1 );
 			add_filter( 'post_flair_block_css', array( $this, 'post_flair_service_enabled_like' ) );
 
-			wp_enqueue_script( 'postmessage', '/wp-content/js/postmessage.js', array( 'jquery' ), JETPACK__VERSION, false );
-			wp_enqueue_script( 'jetpack_resize', '/wp-content/js/jquery/jquery.jetpack-resize.js', array( 'jquery' ), JETPACK__VERSION, false );
+			wp_enqueue_script( 'postmessage', '/wp-content/js/postmessage.js', array( 'jquery' ), JETPACK__VERSION, true );
+			wp_enqueue_script( 'jetpack_resize', '/wp-content/js/jquery/jquery.jetpack-resize.js', array( 'jquery' ), JETPACK__VERSION, true );
 			wp_enqueue_script( 'jetpack_likes_queuehandler', plugins_url( 'queuehandler.js' , __FILE__ ), array( 'jquery', 'postmessage', 'jetpack_resize' ), JETPACK__VERSION, true );
 			wp_enqueue_style( 'jetpack_likes', plugins_url( 'jetpack-likes.css', __FILE__ ), array(), JETPACK__VERSION );
 		}
@@ -296,7 +296,7 @@ function register_scripts() {
 			Assets::get_file_url_for_environment( '_inc/build/postmessage.min.js', '_inc/postmessage.js' ),
 			array( 'jquery' ),
 			JETPACK__VERSION,
-			false
+			true
 		);
 		wp_register_script(
 			'jetpack_resize',
@@ -306,7 +306,7 @@ function register_scripts() {
 			),
 			array( 'jquery' ),
 			JETPACK__VERSION,
-			false
+			true
 		);
 		wp_register_script(
 			'jetpack_likes_queuehandler',

diff --git a/phpunit.xml.dist b/phpunit.xml.dist
@@ -27,6 +27,9 @@
 		<testsuite name="infinite-scroll">
 			<directory prefix="test_" suffix=".php">tests/php/modules/infinite-scroll</directory>
 		</testsuite>
+		<testsuite name="comment-likes">
+			<directory prefix="test" suffix=".php">tests/php/modules/comment-likes</directory>
+		</testsuite>
 		<testsuite name="likes">
 			<directory prefix="test_" suffix=".php">tests/php/modules/likes</directory>
 		</testsuite>

diff --git a/tests/php/modules/comment-likes/test-class.comment-likes.php b/tests/php/modules/comment-likes/test-class.comment-likes.php
@@ -0,0 +1,44 @@
+<?php
+/**
+ * Tests for the WP_Test_Comment_Likes class.
+ *
+ * @package Jetpack
+ * @since 8.4.0
+ */
+
+require dirname( __FILE__ ) . '/../../../../modules/comment-likes.php';
+
+/**
+ * Test class for Jetpack_Comment_Likes.
+ *
+ * @since 8.4.0
+ */
+class WP_Test_Comment_Likes extends WP_UnitTestCase {
+
+	/**
+	 * Test that the assets are not enqueued if likes are not visible.
+	 *
+	 * @since 8.4.0
+	 */
+	public function test_load_styles_register_scripts_likes_not_visible() {
+		$instance = Jetpack_Comment_Likes::init();
+		$instance->load_styles_register_scripts();
+
+		$this->assertFalse( wp_style_is( 'jetpack_likes' ) );
+		$this->assertFalse( wp_script_is( 'postmessage' ) );
+	}
+
+	/**
+	 * Test that the assets are enqueued if likes are visible.
+	 *
+	 * @since 8.4.0
+	 */
+	public function test_load_styles_register_scripts_likes_visible() {
+		add_filter( 'wpl_is_likes_visible', '__return_true' );
+		$instance = Jetpack_Comment_Likes::init();
+		$instance->load_styles_register_scripts();
+
+		$this->assertTrue( wp_style_is( 'jetpack_likes' ) );
+		$this->assertTrue( wp_script_is( 'postmessage' ) );
+	}
+}
diff --git a/tests/php/modules/likes/test_class.likes.php b/tests/php/modules/likes/test_class.likes.php
@@ -3,6 +3,35 @@
 
 class WP_Test_Likes extends WP_UnitTestCase {
 
+	/**
+	 * Test that the actions are not added if likes are not visible.
+	 *
+	 * @since 8.4.0
+	 */
+	public function test_action_init_likes_not_visible() {
+		$instance = new Jetpack_Likes();
+		$instance->action_init();
+
+		$this->assertFalse( has_filter( 'the_content', array( $instance, 'post_likes' ) ) );
+		$this->assertFalse( has_filter( 'the_excerpt', array( $instance, 'post_likes' ) ) );
+	}
+
+	/**
+	 * Test that the actions are added if likes are visible.
+	 *
+	 * @since 8.4.0
+	 */
+	public function test_action_init_likes_visible() {
+		$this->go_to( get_permalink( $this->factory()->post->create() ) );
+		add_filter( 'wpl_is_enabled_sitewide', '__return_true' );
+		add_filter( 'wpl_is_single_post_disabled', '__return_true' );
+		$instance = new Jetpack_Likes();
+		$instance->action_init();
+
+		$this->assertEquals( 30, has_filter( 'the_content', array( $instance, 'post_likes' ) ) );
+		$this->assertEquals( 30, has_filter( 'the_excerpt', array( $instance, 'post_likes' ) ) );
+	}
+
 	/**
 	 * Test if likes are rendered correctly.
 	 *