Plugin: Extract block editor styles replacement as filter

lib/client-assets.php

@@ -840,6 +840,48 @@ function gutenberg_get_available_image_sizes() {
 	return $all_sizes;
 }
 
+/**
+ * Extends block editor settings to include Gutenberg's `editor-styles.css` as
+ * taking precedent those styles shipped with core.
+ *
+ * @param array $settings Default editor settings.
+ *
+ * @return array Filtered editor settings.
+ */
+function gutenberg_extend_block_editor_styles( $settings ) {
+	if ( empty( $settings['styles'] ) ) {
+		$settings['styles'] = array();
+	} else {
+		/*
+		 * By handling this filter at an earlier-than-default priority and with
+		 * an understanding that plugins should concatenate (not unshift) their
+		 * own custom styles, it's assumed that the first entry of the styles
+		 * setting should be the default (core) stylesheet.
+		 */
+		array_shift( $settings['styles'] );
+	}
+
+	/*
+	 * The default styles array would include the core `editor-styles.css` and
+	 * a separate style for the locale font family. To avoid overriding the
+	 * localized value, ensure that Gutenberg's editor styles assume the same
+	 * order as core styles (earlier than the font style assignment).
+	 *
+	 * See: https://github.com/WordPress/wordpress-develop/blob/5.0.3/src/wp-admin/edit-form-blocks.php#L168-L181
+	 */
+	array_unshift(
+		$settings['styles'],
+		array(
+			'css' => file_get_contents(
+				gutenberg_dir_path() . 'build/editor/editor-styles.css'
+			),
+		)
+	);
+
+	return $settings;
+}
+add_filter( 'block_editor_settings', 'gutenberg_extend_block_editor_styles', 9 );
+
 /**
  * Scripts & Styles.
  *
@@ -1037,7 +1079,7 @@ function gutenberg_editor_scripts_and_styles( $hook ) {
 	$styles = array(
 		array(
 			'css' => file_get_contents(
-				gutenberg_dir_path() . 'build/editor/editor-styles.css'
+				ABSPATH . WPINC . '/css/dist/editor/editor-styles.css'
 			),
 		),
 	);

phpunit/class-extend-styles-test.php

@@ -0,0 +1,88 @@
+<?php
+/**
+ * Test `gutenberg_extend_block_editor_styles`.
+ *
+ * @package Gutenberg
+ */
+
+class Extend_Styles_Test extends WP_UnitTestCase {
+
+	/**
+	 * Path of the `editor-styles.css` stub file created, or null if one had
+	 * already existed on the filesystem.
+	 *
+	 * @var string|null
+	 */
+	protected static $stub_file;
+
+	/**
+	 * Contents of the `editor-styles.css` file.
+	 *
+	 * @var string
+	 */
+	protected static $style_contents;
+
+	public static function wpSetUpBeforeClass() {
+		self::ensure_editor_styles();
+	}
+
+	public static function wpTearDownAfterClass() {
+		if ( self::$stub_file ) {
+			unlink( self::$stub_file );
+		}
+	}
+
+	/**
+	 * Verifies that an `editor-styles.css` file exists, creating it otherwise,
+	 * and assigning the `style_contents` and `stub_file` class properties.
+	 */
+	protected static function ensure_editor_styles() {
+		$path = gutenberg_dir_path() . 'build/editor/editor-styles.css';
+
+		if ( file_exists( $path ) ) {
+			self::$style_contents = file_get_contents( $path );
+			self::$stub_file      = null;
+		} else {
+			self::$style_contents = '';
+			file_put_contents( $path, self::$style_contents );
+			self::$stub_file = $path;
+		}
+	}
+
+	/**
+	 * Tests an unset `styles` setting.
+	 */
+	function test_unset_editor_settings_style() {
+		$settings = array();
+
+		$settings = gutenberg_extend_block_editor_styles( $settings );
+
+		$this->assertEquals(
+			array( array( 'css' => self::$style_contents ) ),
+			$settings['styles']
+		);
+	}
+
+	/**
+	 * Tests a default `styles` setting.
+	 */
+	function test_default_editor_settings_style() {
+		$settings = array(
+			'styles' => array(
+				array( 'css' => 'original' ),
+				array( 'css' => 'someother' ),
+			),
+		);
+
+		$settings = gutenberg_extend_block_editor_styles( $settings );
+
+		$this->assertEquals(
+			array(
+				array( 'css' => self::$style_contents ),
+				array( 'css' => 'someother' ),
+			),
+			$settings['styles']
+		);
+	}
+
+}