Custom Colors: Fix block editor CSS in Gutenberg 22.6.0+ iframe context

projects/plugins/wpcomsh/changelog/fix-custom-colors-block-editor-iframe

@@ -0,0 +1,4 @@
+Significance: patch
+Type: fixed
+
+Custom Colors: Fix block editor CSS not applying in Gutenberg 22.6.0+ iframe context.

projects/plugins/wpcomsh/custom-colors/colors.php

@@ -201,7 +201,7 @@ public static function init() {
 			// If colors are set, print them in the Block Editor as well.
 			if ( self::theme_has_set_colors() ) {
 				self::override_themecolors();
-				add_action( 'enqueue_block_editor_assets', array( __CLASS__, 'print_theme_css' ), 20 );
+				add_action( 'enqueue_block_editor_assets', array( __CLASS__, 'print_block_editor_css' ), 20 );
 			}
 		}
 	}
@@ -1461,6 +1461,32 @@ public static function print_theme_css() {
 		);
 	}
 
+	/**
+	 * Enqueue theme CSS for the block editor.
+	 *
+	 * @since $$next-version$$
+	 */
+	public static function print_block_editor_css() {
+		if ( ! self::should_enable_colors() ) {
+			return;
+		}
+		$css = self::get_theme_css();
+
+		// Gutenberg 22.6.0+ renders the editor in an iframe for all themes.
+		// #editor no longer exists inside the iframe, so extend any
+		// "#editor .editor-styles-wrapper" selector to also match the
+		// iframe context while keeping the original for older versions.
+		$css = str_replace(
+			'#editor .editor-styles-wrapper',
+			'#editor .editor-styles-wrapper, :root :where(.editor-styles-wrapper)',
+			$css
+		);
+
+		wp_register_style( 'custom-colors-editor-css', false, array(), '20210311' ); // Register an empty stylesheet to append custom CSS to.
+		wp_enqueue_style( 'custom-colors-editor-css' );
+		wp_add_inline_style( 'custom-colors-editor-css', $css ); // Append inline style to our new stylesheet
+	}
+
 	/**
 	 * Return theme CSS.
 	 */