From 4aa1c661ff699696d2fb240afc5b0de5e5fbc0b7 Mon Sep 17 00:00:00 2001 From: Daniel Richards Date: Mon, 29 Jul 2024 17:59:48 +0800 Subject: [PATCH] Update handling of root selectors --- .../src/utils/transform-styles/index.js | 26 +++++++------------ 1 file changed, 10 insertions(+), 16 deletions(-) diff --git a/packages/block-editor/src/utils/transform-styles/index.js b/packages/block-editor/src/utils/transform-styles/index.js index 259ff04bbce91d..3c2d544400ae88 100644 --- a/packages/block-editor/src/utils/transform-styles/index.js +++ b/packages/block-editor/src/utils/transform-styles/index.js @@ -26,21 +26,6 @@ function transformStyle( prefix: wrapperSelector, exclude: [ ...ignoredSelectors, wrapperSelector ], transform( prefix, selector, prefixedSelector ) { - // `html`, `body` and `:root` need some special handling since they - // generally cannot be prefixed with a classname and produce a valid - // selector. - if ( selector.includes( 'body' ) ) { - return selector - .replace( /:root :where\(body\)/g, prefix ) - .replace( /:where\(body\)/g, prefix ) - .replace( 'body', prefix ); - } - if ( selector.startsWith( ':root' ) ) { - return selector.replace( ':root', prefix ); - } - if ( selector.startsWith( 'html' ) ) { - return selector.replace( 'html', prefix ); - } // Avoid prefixing an already prefixed selector. if ( selector.startsWith( prefix ) ) { return prefixedSelector.replace( @@ -48,7 +33,16 @@ function transformStyle( prefix ); } - return prefixedSelector; + + // `html`, `body` and `:root` need some special handling since they + // generally cannot be prefixed with a classname and produce a valid + // selector. + // Also include some special rules for various forms of :root and body + // that crop up. + return selector + .replace( /:root :where\(body\)/g, prefix ) + .replace( /:where\(body\)/g, prefix ) + .replace( /^(html|body|:root)/, prefix ); }, } ), baseURL && rebaseUrl( { rootUrl: baseURL } ),