Commit d6327703148 for woocommerce
commit d6327703148a7145e0156177d4c7f7332fc0831e
Author: Peerapatfc <39871299+Peerapatfc@users.noreply.github.com>
Date: Mon Oct 19 17:48:17 2026 +0700
Fix images disappearing in the classic-theme block editor on Safari (#69869)
The classic theme editor fonts stylesheet uses `.wp-block { content: ""; }`
as its marker rule, so that Gutenberg copies the stylesheet into the editor
iframe. On Safari this is reported to render `<img class="wp-block">` as
empty because of the `content` declaration.
Gutenberg only matches on the `.wp-block` selector, so a custom property is
enough to keep the rule from being stripped during the build.
Fixes #69709
Co-authored-by: Claude Sonnet 5.5 <noreply@anthropic.com>
diff --git a/plugins/woocommerce/changelog/69709-classic-theme-editor-images-safari b/plugins/woocommerce/changelog/69709-classic-theme-editor-images-safari
new file mode 100644
index 00000000000..6809042ef72
--- /dev/null
+++ b/plugins/woocommerce/changelog/69709-classic-theme-editor-images-safari
@@ -0,0 +1,4 @@
+Significance: patch
+Type: fix
+
+Stop images from disappearing in the block editor on Safari for sites using a classic theme.
diff --git a/plugins/woocommerce/client/legacy/css/woocommerce-classictheme-editor-fonts.scss b/plugins/woocommerce/client/legacy/css/woocommerce-classictheme-editor-fonts.scss
index 668f9a408af..5c441bb301f 100644
--- a/plugins/woocommerce/client/legacy/css/woocommerce-classictheme-editor-fonts.scss
+++ b/plugins/woocommerce/client/legacy/css/woocommerce-classictheme-editor-fonts.scss
@@ -13,7 +13,11 @@
* For more information, see https://github.com/WordPress/gutenberg/blob/7129676335fe56802978a9511d860865f7e65aec/packages/block-editor/src/components/iframe/get-compatibility-styles.js#L3-L10
*/
-/* ! important: this rule must be preserved during build */
+/**
+ * ! important: this rule must be preserved during build.
+ * It only needs a minimal declaration so it is not removed. Avoid `content`:
+ * it is reported to hide images that carry the `wp-block` class in Safari.
+ */
.wp-block {
- content: ""; /* Minimal declaration to prevent removal */
+ --wc-editor-fonts-loaded: 1;
}