WP.com Block Editor: Enqueue missing common styles on the front-end. (#…

…14070)

* WP.com Block Editor: Enqueue missing common styles on the front-end.

* Use `enqueue_block_assets` instead of two separate hooks.

* Only enqueue styles in the editor, and on the front-end when the `$post`
object has paragraph blocks (the only blocks that have the Justify
button).

* Correct paragraph block identifier.

* Avoid fatal errors for unfound `WP_Screen`.

* Enqueue only if in the block editor, or on the front-end with justified
paragraphs in the content.

modules/wpcom-block-editor/class-jetpack-wpcom-block-editor.php

@@ -42,6 +42,7 @@ private function __construct() {
 
 		add_action( 'login_init', array( $this, 'allow_block_editor_login' ), 1 );
 		add_action( 'enqueue_block_editor_assets', array( $this, 'enqueue_scripts' ), 9 );
+		add_action( 'enqueue_block_assets', array( $this, 'enqueue_styles' ) );
 		add_filter( 'mce_external_plugins', array( $this, 'add_tinymce_plugins' ) );
 	}
 
@@ -297,16 +298,6 @@ public function enqueue_scripts() {
 			)
 		);
 
-		$src_styles = $debug
-			? '//widgets.wp.com/wpcom-block-editor/common.css?minify=false'
-			: '//widgets.wp.com/wpcom-block-editor/common.min.css';
-		wp_enqueue_style(
-			'wpcom-block-editor-styles',
-			$src_styles,
-			array(),
-			$version
-		);
-
 		if ( $this->is_iframed_block_editor() ) {
 			$src_calypso_iframe_bridge = $debug
 				? '//widgets.wp.com/wpcom-block-editor/calypso-iframe-bridge-server.js?minify=false'
@@ -333,6 +324,53 @@ public function enqueue_scripts() {
 		}
 	}
 
+	/**
+	 * Enqueue WP.com block editor common styles.
+	 */
+	public function enqueue_styles() {
+		// Enqueue only for the block editor in WP Admin.
+		global $pagenow;
+		if ( is_admin() && ! in_array( $pagenow, array( 'post.php', 'post-new.php' ), true ) ) {
+			return;
+		}
+
+		// Enqueue on the front-end only if justified blocks are present.
+		if ( ! is_admin() && ! $this->has_justified_block() ) {
+			return;
+		}
+
+		$debug   = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG;
+		$version = gmdate( 'Ymd' );
+
+		$src_styles = $debug
+			? '//widgets.wp.com/wpcom-block-editor/common.css?minify=false'
+			: '//widgets.wp.com/wpcom-block-editor/common.min.css';
+		wp_enqueue_style(
+			'wpcom-block-editor-styles',
+			$src_styles,
+			array(),
+			$version
+		);
+	}
+
+	/**
+	 * Determines if the current $post contains a justified paragraph block.
+	 *
+	 * @return boolean true if justified paragraph is found, false otherwise.
+	 */
+	public function has_justified_block() {
+		global $post;
+		if ( ! $post instanceof WP_Post ) {
+			return false;
+		};
+
+		if ( ! has_blocks( $post ) ) {
+			return false;
+		}
+
+		return false !== strpos( $post->post_content, '<!-- wp:paragraph {"align":"justify"' );
+	}
+
 	/**
 	 * Register the Tiny MCE plugins for the WordPress.com block editor integration.
 	 *