From 02824824203ccf17548b59c812b3f96fa1ecd8c5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <ella@vandurpe.com>
Date: Fri, 7 Apr 2023 14:47:38 +0300
Subject: [PATCH 01/12] Block editor: iframe: add enqueue_block_assets and
 introduce enqueue_block_editor_content_assets

---
 lib/client-assets.php                      |  2 +-
 lib/compat/wordpress-6.3/script-loader.php | 66 ++++++++++++++++++++++
 2 files changed, 67 insertions(+), 1 deletion(-)

diff --git a/lib/client-assets.php b/lib/client-assets.php
index 88fbbfd4a1a768..473221960e4de0 100644
--- a/lib/client-assets.php
+++ b/lib/client-assets.php
@@ -255,7 +255,7 @@ function gutenberg_register_packages_styles( $styles ) {
 		$styles,
 		'wp-block-editor-content',
 		gutenberg_url( 'build/block-editor/content.css' ),
-		array(),
+		array( 'wp-components' ),
 		$version
 	);
 	$styles->add_data( 'wp-block-editor-content', 'rtl', 'replace' );
diff --git a/lib/compat/wordpress-6.3/script-loader.php b/lib/compat/wordpress-6.3/script-loader.php
index 8a8e41ef2be919..d5373903407b30 100644
--- a/lib/compat/wordpress-6.3/script-loader.php
+++ b/lib/compat/wordpress-6.3/script-loader.php
@@ -13,3 +13,69 @@
 remove_action( 'wp_body_open', 'wp_global_styles_render_svg_filters' );
 remove_action( 'in_admin_header', 'wp_global_styles_render_svg_filters' );
 
+/**
+ * Collect the block editor assets that need to be loaded into the editor's iframe.
+ *
+ * @since 6.0.0
+ * @access private
+ *
+ * @global string $pagenow The filename of the current screen.
+ *
+ * @return array {
+ *     The block editor assets.
+ *
+ *     @type string|false $styles  String containing the HTML for styles.
+ *     @type string|false $scripts String containing the HTML for scripts.
+ * }
+ */
+function _wp_get_iframed_editor_assets__63() {
+    global $wp_styles, $wp_scripts;
+
+    $current_wp_styles = $wp_styles;
+    $current_wp_scripts = $wp_scripts;
+
+    $wp_styles = new WP_Styles();
+    $wp_scripts = new WP_Scripts();
+
+    add_filter( 'should_load_block_editor_scripts_and_styles', '__return_false' );
+    do_action( 'enqueue_block_assets' );
+    remove_filter( 'should_load_block_editor_scripts_and_styles', '__return_false' );
+
+    // This is a new hook for cases where we want to enqueue scripts/styles for
+    // the (iframed) editor content, but not for the front-end.
+    do_action( 'enqueue_block_editor_content_assets' );
+
+	ob_start();
+	wp_print_styles();
+	$styles = ob_get_clean();
+
+	ob_start();
+    wp_print_head_scripts();
+    wp_print_footer_scripts();
+	$scripts = ob_get_clean();
+
+    $wp_styles = $current_wp_styles;
+    $wp_scripts = $current_wp_scripts;
+
+	return array(
+		'styles'  => $styles,
+		'scripts' => $scripts,
+	);
+}
+
+add_action(
+    'enqueue_block_editor_content_assets',
+    function() {
+        wp_enqueue_style( 'wp-block-editor-content' );
+    }
+);
+
+add_filter(
+	'block_editor_settings_all',
+	function( $settings ) {
+		// We must override what core is passing now.
+		$settings['__unstableResolvedAssets'] = _wp_get_iframed_editor_assets__63();
+		return $settings;
+	},
+	100
+);

From bd02ad5074e7ba65953d9d74ad27fd1c15901161 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <ella@vandurpe.com>
Date: Fri, 7 Apr 2023 15:04:38 +0300
Subject: [PATCH 02/12] Fix PHP lint issues

---
 lib/compat/wordpress-6.3/script-loader.php | 38 +++++++++++-----------
 1 file changed, 19 insertions(+), 19 deletions(-)

diff --git a/lib/compat/wordpress-6.3/script-loader.php b/lib/compat/wordpress-6.3/script-loader.php
index d5373903407b30..d3ea9909d6476a 100644
--- a/lib/compat/wordpress-6.3/script-loader.php
+++ b/lib/compat/wordpress-6.3/script-loader.php
@@ -29,33 +29,33 @@
  * }
  */
 function _wp_get_iframed_editor_assets__63() {
-    global $wp_styles, $wp_scripts;
+	global $wp_styles, $wp_scripts;
 
-    $current_wp_styles = $wp_styles;
-    $current_wp_scripts = $wp_scripts;
+	$current_wp_styles  = $wp_styles;
+	$current_wp_scripts = $wp_scripts;
 
-    $wp_styles = new WP_Styles();
-    $wp_scripts = new WP_Scripts();
+	$wp_styles  = new WP_Styles();
+	$wp_scripts = new WP_Scripts();
 
-    add_filter( 'should_load_block_editor_scripts_and_styles', '__return_false' );
-    do_action( 'enqueue_block_assets' );
-    remove_filter( 'should_load_block_editor_scripts_and_styles', '__return_false' );
+	add_filter( 'should_load_block_editor_scripts_and_styles', '__return_false' );
+	do_action( 'enqueue_block_assets' );
+	remove_filter( 'should_load_block_editor_scripts_and_styles', '__return_false' );
 
-    // This is a new hook for cases where we want to enqueue scripts/styles for
-    // the (iframed) editor content, but not for the front-end.
-    do_action( 'enqueue_block_editor_content_assets' );
+	// This is a new hook for cases where we want to enqueue scripts/styles for
+	// the (iframed) editor content, but not for the front-end.
+	do_action( 'enqueue_block_editor_content_assets' );
 
 	ob_start();
 	wp_print_styles();
 	$styles = ob_get_clean();
 
 	ob_start();
-    wp_print_head_scripts();
-    wp_print_footer_scripts();
+	wp_print_head_scripts();
+	wp_print_footer_scripts();
 	$scripts = ob_get_clean();
 
-    $wp_styles = $current_wp_styles;
-    $wp_scripts = $current_wp_scripts;
+	$wp_styles  = $current_wp_styles;
+	$wp_scripts = $current_wp_scripts;
 
 	return array(
 		'styles'  => $styles,
@@ -64,10 +64,10 @@ function _wp_get_iframed_editor_assets__63() {
 }
 
 add_action(
-    'enqueue_block_editor_content_assets',
-    function() {
-        wp_enqueue_style( 'wp-block-editor-content' );
-    }
+	'enqueue_block_editor_content_assets',
+	function() {
+		wp_enqueue_style( 'wp-block-editor-content' );
+	}
 );
 
 add_filter(

From af604c26084841f644cdfd2f3f3fc305c82d9731 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <ella@vandurpe.com>
Date: Tue, 11 Apr 2023 09:39:43 +0300
Subject: [PATCH 03/12] Copy already registered assets

---
 lib/compat/wordpress-6.3/script-loader.php | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/lib/compat/wordpress-6.3/script-loader.php b/lib/compat/wordpress-6.3/script-loader.php
index d3ea9909d6476a..2d9f8fd3dec8e4 100644
--- a/lib/compat/wordpress-6.3/script-loader.php
+++ b/lib/compat/wordpress-6.3/script-loader.php
@@ -31,12 +31,21 @@
 function _wp_get_iframed_editor_assets__63() {
 	global $wp_styles, $wp_scripts;
 
+	// Keep track of the styles and scripts instance to restore later.
 	$current_wp_styles  = $wp_styles;
 	$current_wp_scripts = $wp_scripts;
 
+	// Create new instances to collect the assets.
 	$wp_styles  = new WP_Styles();
 	$wp_scripts = new WP_Scripts();
 
+	// Register all currently registered styles and scripts. The actions that
+	// follow enqueue assets, but don't necessarily register them.
+	$wp_styles->registered = $current_wp_styles->registered;
+	$wp_scripts->registered = $current_wp_scripts->registered;
+
+	// We don't want to load EDITOR scripts and styles in the iframe, only
+	// assets for the content.
 	add_filter( 'should_load_block_editor_scripts_and_styles', '__return_false' );
 	do_action( 'enqueue_block_assets' );
 	remove_filter( 'should_load_block_editor_scripts_and_styles', '__return_false' );
@@ -54,6 +63,7 @@ function _wp_get_iframed_editor_assets__63() {
 	wp_print_footer_scripts();
 	$scripts = ob_get_clean();
 
+	// Restore the original instances.
 	$wp_styles  = $current_wp_styles;
 	$wp_scripts = $current_wp_scripts;
 

From 184e64f79f228295f0378d9d94397583f7aee8ec Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <ella@vandurpe.com>
Date: Tue, 11 Apr 2023 10:12:34 +0300
Subject: [PATCH 04/12] Fix PHP linting errors

---
 lib/compat/wordpress-6.3/script-loader.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/compat/wordpress-6.3/script-loader.php b/lib/compat/wordpress-6.3/script-loader.php
index 2d9f8fd3dec8e4..0519d4262a750c 100644
--- a/lib/compat/wordpress-6.3/script-loader.php
+++ b/lib/compat/wordpress-6.3/script-loader.php
@@ -41,7 +41,7 @@ function _wp_get_iframed_editor_assets__63() {
 
 	// Register all currently registered styles and scripts. The actions that
 	// follow enqueue assets, but don't necessarily register them.
-	$wp_styles->registered = $current_wp_styles->registered;
+	$wp_styles->registered  = $current_wp_styles->registered;
 	$wp_scripts->registered = $current_wp_scripts->registered;
 
 	// We don't want to load EDITOR scripts and styles in the iframe, only

From 59fd0795cb0d2c9bb3799b46cc2b243ff014adb3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <ella@vandurpe.com>
Date: Mon, 24 Apr 2023 15:05:32 +0300
Subject: [PATCH 05/12] Remove filter for now

---
 lib/compat/wordpress-6.3/script-loader.php | 11 +----------
 1 file changed, 1 insertion(+), 10 deletions(-)

diff --git a/lib/compat/wordpress-6.3/script-loader.php b/lib/compat/wordpress-6.3/script-loader.php
index 0519d4262a750c..d04524712f72b7 100644
--- a/lib/compat/wordpress-6.3/script-loader.php
+++ b/lib/compat/wordpress-6.3/script-loader.php
@@ -50,9 +50,7 @@ function _wp_get_iframed_editor_assets__63() {
 	do_action( 'enqueue_block_assets' );
 	remove_filter( 'should_load_block_editor_scripts_and_styles', '__return_false' );
 
-	// This is a new hook for cases where we want to enqueue scripts/styles for
-	// the (iframed) editor content, but not for the front-end.
-	do_action( 'enqueue_block_editor_content_assets' );
+	wp_enqueue_style( 'wp-block-editor-content' );
 
 	ob_start();
 	wp_print_styles();
@@ -73,13 +71,6 @@ function _wp_get_iframed_editor_assets__63() {
 	);
 }
 
-add_action(
-	'enqueue_block_editor_content_assets',
-	function() {
-		wp_enqueue_style( 'wp-block-editor-content' );
-	}
-);
-
 add_filter(
 	'block_editor_settings_all',
 	function( $settings ) {

From 4b2fe2e625b698648a2d5697c533ad8ee1f30d4a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <ella@vandurpe.com>
Date: Mon, 24 Apr 2023 15:51:44 +0300
Subject: [PATCH 06/12] Enqueue polyfill

---
 lib/compat/wordpress-6.3/script-loader.php | 1 +
 1 file changed, 1 insertion(+)

diff --git a/lib/compat/wordpress-6.3/script-loader.php b/lib/compat/wordpress-6.3/script-loader.php
index d04524712f72b7..f84e88ae0217c2 100644
--- a/lib/compat/wordpress-6.3/script-loader.php
+++ b/lib/compat/wordpress-6.3/script-loader.php
@@ -51,6 +51,7 @@ function _wp_get_iframed_editor_assets__63() {
 	remove_filter( 'should_load_block_editor_scripts_and_styles', '__return_false' );
 
 	wp_enqueue_style( 'wp-block-editor-content' );
+	wp_enqueue_script( 'wp-polyfill' );
 
 	ob_start();
 	wp_print_styles();

From e81da56acdde7c8d1d56842b0d930bd6686f4e62 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <ella@vandurpe.com>
Date: Tue, 25 Apr 2023 08:44:31 +0300
Subject: [PATCH 07/12] Address feedback

---
 lib/compat/wordpress-6.3/script-loader.php | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/lib/compat/wordpress-6.3/script-loader.php b/lib/compat/wordpress-6.3/script-loader.php
index f84e88ae0217c2..4b5f4632f56ebb 100644
--- a/lib/compat/wordpress-6.3/script-loader.php
+++ b/lib/compat/wordpress-6.3/script-loader.php
@@ -19,8 +19,6 @@
  * @since 6.0.0
  * @access private
  *
- * @global string $pagenow The filename of the current screen.
- *
  * @return array {
  *     The block editor assets.
  *
@@ -28,7 +26,7 @@
  *     @type string|false $scripts String containing the HTML for scripts.
  * }
  */
-function _wp_get_iframed_editor_assets__63() {
+function _gutenberg_get_iframed_editor_assets() {
 	global $wp_styles, $wp_scripts;
 
 	// Keep track of the styles and scripts instance to restore later.
@@ -76,7 +74,7 @@ function _wp_get_iframed_editor_assets__63() {
 	'block_editor_settings_all',
 	function( $settings ) {
 		// We must override what core is passing now.
-		$settings['__unstableResolvedAssets'] = _wp_get_iframed_editor_assets__63();
+		$settings['__unstableResolvedAssets'] = _gutenberg_get_iframed_editor_assets();
 		return $settings;
 	},
 	100

From 8efe58dfcfc3fb3e19c12607b3b9b1b13fbbb20b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <ella@vandurpe.com>
Date: Tue, 25 Apr 2023 09:43:16 +0300
Subject: [PATCH 08/12] Add e2e test

---
 .../plugins/iframed-enqueue-block-assets.php  | 21 +++++++++
 .../iframed-enqueue-block-assets/style.css    |  9 ++++
 .../iframed-equeue-block-assets.test.js       | 44 +++++++++++++++++++
 3 files changed, 74 insertions(+)
 create mode 100644 packages/e2e-tests/plugins/iframed-enqueue-block-assets.php
 create mode 100644 packages/e2e-tests/plugins/iframed-enqueue-block-assets/style.css
 create mode 100644 packages/e2e-tests/specs/editor/plugins/iframed-equeue-block-assets.test.js

diff --git a/packages/e2e-tests/plugins/iframed-enqueue-block-assets.php b/packages/e2e-tests/plugins/iframed-enqueue-block-assets.php
new file mode 100644
index 00000000000000..c85c77fe11d0e9
--- /dev/null
+++ b/packages/e2e-tests/plugins/iframed-enqueue-block-assets.php
@@ -0,0 +1,21 @@
+<?php
+/**
+ * Plugin Name: Gutenberg Test Iframed enqueue_block_assets
+ * Plugin URI: https://github.com/WordPress/gutenberg
+ * Author: Gutenberg Team
+ *
+ * @package gutenberg-test-iframed-iframed-enqueue-block-assets
+ */
+
+add_action(
+	'enqueue_block_assets',
+	function() {
+		wp_enqueue_style(
+			'iframed-enqueue-block-assets',
+			plugin_dir_url( __FILE__ ) . 'iframed-enqueue-block-assets/style.css',
+			array(),
+			filemtime( plugin_dir_path( __FILE__ ) . 'iframed-enqueue-block-assets/style.css' )
+		);
+		wp_add_inline_style( 'iframed-enqueue-block-assets', 'body{padding:20px!important}' );
+	}
+);
diff --git a/packages/e2e-tests/plugins/iframed-enqueue-block-assets/style.css b/packages/e2e-tests/plugins/iframed-enqueue-block-assets/style.css
new file mode 100644
index 00000000000000..675944492dd6f9
--- /dev/null
+++ b/packages/e2e-tests/plugins/iframed-enqueue-block-assets/style.css
@@ -0,0 +1,9 @@
+/**
+ * The following styles get applied both on the front of your site and in the
+ * editor.
+ */
+body {
+	background-color: rgb(33, 117, 155) !important;
+	color: #fff !important;
+	padding: 2px !important;
+}
diff --git a/packages/e2e-tests/specs/editor/plugins/iframed-equeue-block-assets.test.js b/packages/e2e-tests/specs/editor/plugins/iframed-equeue-block-assets.test.js
new file mode 100644
index 00000000000000..c1bd26fe1c7610
--- /dev/null
+++ b/packages/e2e-tests/specs/editor/plugins/iframed-equeue-block-assets.test.js
@@ -0,0 +1,44 @@
+/**
+ * WordPress dependencies
+ */
+import {
+	activatePlugin,
+	createNewPost,
+	deactivatePlugin,
+	canvas,
+	activateTheme,
+} from '@wordpress/e2e-test-utils';
+
+async function getComputedStyle( context, selector, property ) {
+	return await context.evaluate(
+		( sel, prop ) =>
+			window.getComputedStyle( document.querySelector( sel ) )[ prop ],
+		selector,
+		property
+	);
+}
+
+describe( 'iframed inline styles', () => {
+	beforeEach( async () => {
+		// Activate the empty theme (block based theme), which is iframed.
+		await activateTheme( 'emptytheme' );
+		await activatePlugin( 'gutenberg-test-iframed-enqueue_block_assets' );
+		await createNewPost();
+	} );
+
+	afterEach( async () => {
+		await deactivatePlugin( 'gutenberg-test-iframed-enqueue_block_assets' );
+		await activateTheme( 'twentytwentyone' );
+	} );
+
+	it( 'should load styles added through enqueue_block_assets', async () => {
+		// Check stylesheet.
+		expect(
+			await getComputedStyle( canvas(), 'body', 'background-color' )
+		).toBe( 'rgb(33, 117, 155)' );
+		// Check inline style.
+		expect( await getComputedStyle( canvas(), 'body', 'padding' ) ).toBe(
+			'20px'
+		);
+	} );
+} );

From 806d04303cd2136a8fe06fb98311d1d3a51f2a9d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <ella@vandurpe.com>
Date: Tue, 25 Apr 2023 15:40:51 +0300
Subject: [PATCH 09/12] change order

---
 lib/compat/wordpress-6.3/script-loader.php | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/lib/compat/wordpress-6.3/script-loader.php b/lib/compat/wordpress-6.3/script-loader.php
index 4b5f4632f56ebb..c169330bb0ecf2 100644
--- a/lib/compat/wordpress-6.3/script-loader.php
+++ b/lib/compat/wordpress-6.3/script-loader.php
@@ -42,15 +42,15 @@ function _gutenberg_get_iframed_editor_assets() {
 	$wp_styles->registered  = $current_wp_styles->registered;
 	$wp_scripts->registered = $current_wp_scripts->registered;
 
+	wp_enqueue_style( 'wp-block-editor-content' );
+	wp_enqueue_script( 'wp-polyfill' );
+
 	// We don't want to load EDITOR scripts and styles in the iframe, only
 	// assets for the content.
 	add_filter( 'should_load_block_editor_scripts_and_styles', '__return_false' );
 	do_action( 'enqueue_block_assets' );
 	remove_filter( 'should_load_block_editor_scripts_and_styles', '__return_false' );
 
-	wp_enqueue_style( 'wp-block-editor-content' );
-	wp_enqueue_script( 'wp-polyfill' );
-
 	ob_start();
 	wp_print_styles();
 	$styles = ob_get_clean();

From 7faabe291b73658e7505e3cbc83ea0f4a02d2257 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <ella@vandurpe.com>
Date: Tue, 25 Apr 2023 20:08:39 +0300
Subject: [PATCH 10/12] restore wp-block-library hardcoding

---
 lib/compat/wordpress-6.3/script-loader.php | 1 +
 1 file changed, 1 insertion(+)

diff --git a/lib/compat/wordpress-6.3/script-loader.php b/lib/compat/wordpress-6.3/script-loader.php
index c169330bb0ecf2..498cd83285b771 100644
--- a/lib/compat/wordpress-6.3/script-loader.php
+++ b/lib/compat/wordpress-6.3/script-loader.php
@@ -43,6 +43,7 @@ function _gutenberg_get_iframed_editor_assets() {
 	$wp_scripts->registered = $current_wp_scripts->registered;
 
 	wp_enqueue_style( 'wp-block-editor-content' );
+	wp_enqueue_style( 'wp-block-library' );
 	wp_enqueue_script( 'wp-polyfill' );
 
 	// We don't want to load EDITOR scripts and styles in the iframe, only

From 4cb31812a12d3b9e6e071980dc0cd6c9b76020f7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <ella@vandurpe.com>
Date: Tue, 25 Apr 2023 20:12:42 +0300
Subject: [PATCH 11/12] Add comment

---
 lib/compat/wordpress-6.3/script-loader.php | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/lib/compat/wordpress-6.3/script-loader.php b/lib/compat/wordpress-6.3/script-loader.php
index 498cd83285b771..a0b72d3a02ade5 100644
--- a/lib/compat/wordpress-6.3/script-loader.php
+++ b/lib/compat/wordpress-6.3/script-loader.php
@@ -43,6 +43,8 @@ function _gutenberg_get_iframed_editor_assets() {
 	$wp_scripts->registered = $current_wp_scripts->registered;
 
 	wp_enqueue_style( 'wp-block-editor-content' );
+	// To do: investigate why this is not enqueued through enqueue_block_assets,
+	// as styles for non-core blocks are.
 	wp_enqueue_style( 'wp-block-library' );
 	wp_enqueue_script( 'wp-polyfill' );
 

From 6601c53e8f0a2591b2800a86e5da3fb801a8f73f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ella=20van=C2=A0Durpe?= <ella@vandurpe.com>
Date: Wed, 26 Apr 2023 08:50:58 +0300
Subject: [PATCH 12/12] Add fonts back

---
 lib/compat/wordpress-6.3/script-loader.php | 1 +
 1 file changed, 1 insertion(+)

diff --git a/lib/compat/wordpress-6.3/script-loader.php b/lib/compat/wordpress-6.3/script-loader.php
index a0b72d3a02ade5..c735f3b8a792a7 100644
--- a/lib/compat/wordpress-6.3/script-loader.php
+++ b/lib/compat/wordpress-6.3/script-loader.php
@@ -56,6 +56,7 @@ function _gutenberg_get_iframed_editor_assets() {
 
 	ob_start();
 	wp_print_styles();
+	wp_print_fonts();
 	$styles = ob_get_clean();
 
 	ob_start();