ciampo · Sep 25, 2026 · Sep 17, 2026 · Sep 17, 2026 · Sep 24, 2026 · Sep 25, 2026
diff --git a/test/unit/config/postcss-browser-plugin.mjs b/test/unit/config/postcss-browser-plugin.mjs
@@ -0,0 +1,47 @@
+import { createRequire } from 'node:module';
+import path from 'node:path';
+import { normalizePath } from 'vite';
+
+const EMPTY_MODULE_ID = '\0postcss-browser-empty';
+
+// Temporary workaround for https://github.com/vitejs/vite/issues/23512.
+// Remove this plugin and its optimizer registration once the installed Vite
+// version handles browser:false imports without warnings. Keep the Browser
+// regression test to verify removal.
+//
+// The separate CSS Modules missing-`from` warning is tracked in:
+// https://github.com/madyankin/postcss-modules/pull/173
+// https://github.com/vitejs/vite/issues/15410
+export function createPostcssBrowserPlugin( rootDir ) {
+	const require = createRequire(
+		path.join( rootDir, 'packages/block-editor/package.json' )
+	);
+	const packagePath = require.resolve( 'postcss/package.json' );
+	const packageDirectory = normalizePath( path.dirname( packagePath ) ) + '/';
+	const { browser } = require( packagePath );
+	const disabledImports = new Set(
+		Object.keys( browser ).filter(
+			( id ) => ! id.startsWith( '.' ) && browser[ id ] === false
+		)
+	);
+
+	return {
+		name: 'postcss-browser-imports',
+		resolveId( id, importer ) {
+			if (
+				disabledImports.has( id ) &&
+				importer &&
+				normalizePath( importer ).startsWith( packageDirectory )
+			) {
+				return EMPTY_MODULE_ID;
+			}
+		},
+		load( id ) {
+			if ( id === EMPTY_MODULE_ID ) {
+				// PostCSS probes these optional APIs. Honor its browser:false
+				// mappings without Vite's warning-producing external proxies.
+				return 'module.exports = {};';
+			}
+		},
+	};
+}
diff --git a/test/unit/config/postcss.browser.test.js b/test/unit/config/postcss.browser.test.js
@@ -0,0 +1,21 @@
+import { expect, test } from 'vitest';
+
+test( 'imports the editor style transformer without browser-externalized warnings', async () => {
+	// Import inside the test so the shared console checks include module initialization.
+	const { default: transformStyles } =
+		await import( '../../../packages/block-editor/src/utils/transform-styles' );
+
+	expect(
+		transformStyles(
+			[
+				{
+					css: 'p { background: url(../image.png); }',
+					baseURL: 'https://example.com/theme/css/',
+				},
+			],
+			'.editor'
+		)
+	).toEqual( [
+		'.editor p { background: url(https://example.com/theme/image.png); }',
+	] );
+} );
diff --git a/test/unit/vitest.config.mjs b/test/unit/vitest.config.mjs
@@ -6,6 +6,7 @@ import { defineConfig } from 'vitest/config';
 import { createVitePlugins } from './config/vite-plugins.mjs';
 import { createPlaywrightProvider } from './config/playwright-provider.mjs';
 import { createBrowserTraceArtifacts } from './config/browser-traces.mjs';
+import { createPostcssBrowserPlugin } from './config/postcss-browser-plugin.mjs';
 import {
 	discoverTestFiles,
 	getVitestTestsByProject,
@@ -209,6 +210,9 @@ export default defineConfig( {
 				 */
 				root: CONFIG_DIR,
 				optimizeDeps: {
+					rolldownOptions: {
+						plugins: [ createPostcssBrowserPlugin( ROOT_DIR ) ],
+					},
 					entries: vitestTests.browser.map( ( testPath ) =>
 						path.join( ROOT_DIR, testPath )
 					),