@wordpress/block-editor 17.0.2-next.v.202608281122.0 → 17.1.0

package/src/components/global-styles/test/{typography-panel.jsx → typography-panel.jsdom.test.jsx}

@@ -1,8 +1,13 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import { act, render, renderHook, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { click, render as renderAriakit } from '@ariakit/test/react';
 import TypographyPanel, { useHasTypographyPanel } from '../typography-panel';
 
+globalThis.wpVitest.mockMatchMedia();
+
+globalThis.wpVitest.mockResizeObserver();
+
 // The inheritance treatment sits behind the
 // `gutenberg-global-styles-inheritance-ui` experiment. Turn it on so these
 // tests exercise the inheriting path. The off path lives in
@@ -198,7 +203,7 @@ describe( 'TypographyPanel — inheritedValue round-trip', () => {
 		// A local commit writes only the path the user touched. The
 		// inherited value is never copied into local attributes by typing.
 		const user = userEvent.setup();
-		const onChange = jest.fn();
+		const onChange = vi.fn();
 		const inheritedValue = {
 			typography: { textColumns: 3, lineHeight: '1.7' },
 		};
@@ -405,7 +410,7 @@ describe( 'TypographyPanel — inheritedValue round-trip', () => {
 			// never invoke the parent `onChange`. Otherwise the act
 			// of opening the inspector would silently commit every
 			// inherited value into the local block attributes.
-			const onChange = jest.fn();
+			const onChange = vi.fn();
 			const inheritedValue = {
 				typography: {
 					textDecoration: 'underline',
@@ -435,7 +440,7 @@ describe( 'TypographyPanel — inheritedValue round-trip', () => {
 			// bypasses the inner ToggleGroupControl's equality
 			// short-circuit which would otherwise emit `undefined`.
 			const user = userEvent.setup();
-			const onChange = jest.fn();
+			const onChange = vi.fn();
 			const inheritedValue = {
 				typography: { textDecoration: 'underline' },
 			};
@@ -525,7 +530,7 @@ describe( 'TypographyPanel — inheritedValue round-trip', () => {
 
 	describe( 'Font appearance (composite ToggleGroup-like select)', () => {
 		it( 'mounting an at-rest font appearance does not call onChange (display-without-commit)', async () => {
-			const onChange = jest.fn();
+			const onChange = vi.fn();
 			const inheritedValue = {
 				typography: { fontStyle: 'italic', fontWeight: '700' },
 			};
@@ -542,7 +547,7 @@ describe( 'TypographyPanel — inheritedValue round-trip', () => {
 
 	describe( 'FontFamily (CustomSelect archetype)', () => {
 		it( 'mounting an at-rest font family does not call onChange (display-without-commit)', async () => {
-			const onChange = jest.fn();
+			const onChange = vi.fn();
 			const inheritedValue = {
 				typography: { fontFamily: 'Georgia, serif' },
 			};
@@ -616,7 +621,7 @@ describe( 'TypographyPanel — inheritedValue round-trip', () => {
 
 	describe( 'FontSize (preset picker + custom-size input)', () => {
 		it( 'mounting an at-rest font size does not call onChange (display-without-commit)', async () => {
-			const onChange = jest.fn();
+			const onChange = vi.fn();
 			const inheritedValue = {
 				typography: { fontSize: 'var:preset|font-size|large' },
 			};
@@ -755,7 +760,7 @@ async function openTextColorDropdown() {
 
 describe( 'TypographyPanel — duplicate-hex preset slug identity', () => {
 	it( 'commits the inherited preset slug when accepting the preselected inherited color', async () => {
-		const onChange = jest.fn();
+		const onChange = vi.fn();
 
 		await renderAriakit(
 			<TypographyPanel
@@ -786,7 +791,7 @@ describe( 'TypographyPanel — duplicate-hex preset slug identity', () => {
 				value={ { color: { text: 'var:preset|color|dark-text' } } }
 				settings={ DUPLICATE_PALETTE_SETTINGS }
 				panelId="test"
-				onChange={ jest.fn() }
+				onChange={ vi.fn() }
 			/>
 		);
 
@@ -800,7 +805,7 @@ describe( 'TypographyPanel — duplicate-hex preset slug identity', () => {
 
 describe( 'TypographyPanel — setTextColor link sync', () => {
 	it( 'syncs the link color when text and link share the same raw preset reference', async () => {
-		const onChange = jest.fn();
+		const onChange = vi.fn();
 		const sharedRef = 'var:preset|color|dark-background';
 
 		await renderAriakit(
@@ -829,7 +834,7 @@ describe( 'TypographyPanel — setTextColor link sync', () => {
 	} );
 
 	it( 'does NOT sync the link color when text and link have different raw refs, even if their decoded hex values match', async () => {
-		const onChange = jest.fn();
+		const onChange = vi.fn();
 
 		await renderAriakit(
 			<TypographyPanel
@@ -864,7 +869,7 @@ describe( 'TypographyPanel — setTextColor link sync', () => {
 		// color the user set on the block instance must survive a
 		// subsequent text color change instead of being overwritten to
 		// track the text color.
-		const onChange = jest.fn();
+		const onChange = vi.fn();
 
 		await renderAriakit(
 			<TypographyPanel
@@ -899,7 +904,7 @@ describe( 'TypographyPanel — setTextColor link sync', () => {
 	it( 'keeps a local link color tracking when it currently matches the local text color', async () => {
 		// When the local link color equals the local text color it is
 		// still tracking, so a text color change carries the link along.
-		const onChange = jest.fn();
+		const onChange = vi.fn();
 		const sharedRef = 'var:preset|color|blue';
 		const distinctPaletteSettings = {
 			color: {

package/src/components/global-styles/test/typography-utils.js

@@ -1,3 +1,4 @@
+import { describe, expect, it } from 'vitest';
 import {
 	getMergedFontFamiliesAndFontFamilyFaces,
 	findNearestFontWeight,

package/src/components/global-styles/test/utils.js

@@ -1,3 +1,4 @@
+import { describe, expect, it } from 'vitest';
 import { getDuotoneSlugFromPreset } from '../utils';
 
 describe( 'global styles utils', () => {

package/src/components/grid/style.scss

@@ -138,17 +138,7 @@
 			}
 		}
 
-		// Don't show the focus inherited by the Button component.
-		&:focus,
-		&:focus:enabled,
-		&:focus::before {
-			box-shadow: none;
-			outline: none;
-		}
 
-		&:focus-visible::before {
-			@include block-toolbar-button-style__focus();
-		}
 	}
 }
 

package/src/components/iframe/index.jsx

@@ -318,7 +318,7 @@ function Iframe( {
 					}
 					// If the event originates from inside the iframe, it means
 					// it bubbled through the portal, but only with React
-					// events. We need to to bubble native events as well,
+					// events. We need to bubble native events as well,
 					// though by doing so we also trigger another React event,
 					// so we need to stop the propagation of this event to avoid
 					// duplication.
@@ -389,9 +389,9 @@ function IframeIfReady( props, ref ) {
 		[]
 	);
 
-	// We shouldn't render the iframe until the editor settings are initialised.
+	// We shouldn't render the iframe until the editor settings are initialized.
 	// The initial settings are needed to get the styles for the srcDoc, which
-	// cannot be changed after the iframe is mounted. srcDoc is used to to set
+	// cannot be changed after the iframe is mounted. srcDoc is used to set
 	// the initial iframe HTML, which is required to avoid a flash of unstyled
 	// content.
 	if ( ! isInitialised ) {

package/src/components/image-editor/test/index.js

@@ -1,3 +1,4 @@
+import { expect, test } from 'vitest';
 import { ratioToNumber } from '../aspect-ratio-dropdown';
 
 test( 'ratioToNumber', () => {

package/src/components/image-size-control/test/{index.jsx → index.jsdom.test.jsx}

@@ -1,14 +1,19 @@
+import { afterEach, describe, expect, it, vi } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import ImageSizeControl from '../index';
 
+globalThis.wpVitest.mockMatchMedia();
+
+globalThis.wpVitest.mockResizeObserver();
+
 describe( 'ImageSizeControl', () => {
-	const mockOnChange = jest.fn();
-	const mockOnChangeImage = jest.fn();
+	const mockOnChange = vi.fn();
+	const mockOnChangeImage = vi.fn();
 
 	afterEach( () => {
 		// Cleanup on exiting.
-		jest.clearAllMocks();
+		vi.clearAllMocks();
 	} );
 
 	it( 'returns custom dimensions when they exist', () => {

package/src/components/inner-blocks/test/__snapshots__/index.jsdom.test.jsx.snap

@@ -0,0 +1,15 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`InnerBlocks > should force serialize for invalid block with inner blocks 1`] = `
+"<!-- wp:test-block -->
+<p>Invalid<!-- wp:test-block -->
+<p></p>
+<!-- /wp:test-block --></p>
+<!-- /wp:test-block -->"
+`;
+
+exports[`InnerBlocks > should return element as string, with inner blocks 1`] = `
+"<div>Bananas<!-- wp:fruit {"fruit":"Apples"} -->
+<div>Apples</div>
+<!-- /wp:fruit --></div>"
+`;

package/src/components/inner-blocks/test/{index.jsx → index.jsdom.test.jsx}

@@ -1,4 +1,6 @@
 /* eslint-disable testing-library/render-result-naming-convention */
+
+import { afterEach, describe, expect, it } from 'vitest';
 import {
 	createBlock,
 	getBlockTypes,

package/src/components/inner-content/test/{index.jsx → index.jsdom.test.jsx}

@@ -1,3 +1,4 @@
+import { afterAll, beforeAll, describe, expect, it } from 'vitest';
 import { render } from '@testing-library/react';
 import {
 	createBlock,

package/src/components/inserter/hooks/use-patterns-paging.js

@@ -9,7 +9,7 @@ const PAGE_SIZE = 20;
  *
  * @param {Array}  currentCategoryPatterns An array of the current patterns to display.
  * @param {string} currentCategory         The currently selected category.
- * @param {Object} scrollContainerRef      Ref of container to to find scroll container for when moving between pages.
+ * @param {Object} scrollContainerRef      Ref of container to find scroll container for when moving between pages.
  * @param {string} currentFilter           The currently search filter.
  *
  * @return {Object} Returns the relevant paging values. (totalItems, categoryPatternsList, numPages, changePage, currentPage)

package/src/components/inserter/media-tab/test/{hooks.js → hooks.jsdom.test.js}

@@ -1,19 +1,20 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import { renderHook, act, waitFor } from '@testing-library/react';
 import { useDelayedLoading, useMediaResults } from '../hooks';
 
 describe( 'useDelayedLoading', () => {
 	beforeEach( () => {
-		jest.useFakeTimers();
+		vi.useFakeTimers();
 	} );
 	afterEach( () => {
-		jest.useRealTimers();
+		vi.useRealTimers();
 	} );
 
 	it( 'does not surface loading before the delay elapses', () => {
 		const { result } = renderHook( () => useDelayedLoading( true, 400 ) );
 		expect( result.current ).toBe( false );
 		act( () => {
-			jest.advanceTimersByTime( 399 );
+			vi.advanceTimersByTime( 399 );
 		} );
 		expect( result.current ).toBe( false );
 	} );
@@ -21,7 +22,7 @@ describe( 'useDelayedLoading', () => {
 	it( 'surfaces loading once the delay elapses', () => {
 		const { result } = renderHook( () => useDelayedLoading( true, 400 ) );
 		act( () => {
-			jest.advanceTimersByTime( 400 );
+			vi.advanceTimersByTime( 400 );
 		} );
 		expect( result.current ).toBe( true );
 	} );
@@ -32,11 +33,11 @@ describe( 'useDelayedLoading', () => {
 			{ initialProps: { isLoading: true } }
 		);
 		act( () => {
-			jest.advanceTimersByTime( 200 );
+			vi.advanceTimersByTime( 200 );
 		} );
 		rerender( { isLoading: false } );
 		act( () => {
-			jest.advanceTimersByTime( 400 );
+			vi.advanceTimersByTime( 400 );
 		} );
 		expect( result.current ).toBe( false );
 	} );
@@ -47,7 +48,7 @@ describe( 'useDelayedLoading', () => {
 			{ initialProps: { isLoading: true } }
 		);
 		act( () => {
-			jest.advanceTimersByTime( 400 );
+			vi.advanceTimersByTime( 400 );
 		} );
 		expect( result.current ).toBe( true );
 		rerender( { isLoading: false } );
@@ -58,7 +59,7 @@ describe( 'useDelayedLoading', () => {
 describe( 'useMediaResults', () => {
 	const createCategory = ( name, items ) => ( {
 		name,
-		fetch: jest.fn( async () => items ),
+		fetch: vi.fn( async () => items ),
 	} );
 
 	it( 'fetches and returns media for the query', async () => {
@@ -119,7 +120,7 @@ describe( 'useMediaResults', () => {
 	it( 'surfaces paging totals from a source that returns them', async () => {
 		const category = {
 			name: 'images',
-			fetch: jest.fn( async () => ( {
+			fetch: vi.fn( async () => ( {
 				mediaItems: [ { id: 1 } ],
 				totalItems: 42,
 				totalPages: 3,
@@ -207,7 +208,7 @@ describe( 'useMediaResults', () => {
 		let resolveFetch;
 		const secondCategory = {
 			name: 'attached-images',
-			fetch: jest.fn(
+			fetch: vi.fn(
 				() =>
 					new Promise( ( resolve ) => {
 						resolveFetch = resolve;
@@ -231,7 +232,7 @@ describe( 'useMediaResults', () => {
 	} );
 
 	it( 'does not refetch when only the category wrapper changes', async () => {
-		const fetch = jest.fn( async () => [ { id: 1 } ] );
+		const fetch = vi.fn( async () => [ { id: 1 } ] );
 		const { result, rerender } = renderHook(
 			( { category } ) => useMediaResults( category, { search: '' }, 0 ),
 			{

package/src/components/inserter/media-tab/test/{media-panel.jsx → media-panel.jsdom.test.jsx}

@@ -1,9 +1,12 @@
+import { describe, expect, it, vi } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import { MediaCategoryPanel } from '../media-panel';
 
+globalThis.wpVitest.mockMatchMedia();
+
 // Keep the panel's data + async surface out of the test: return a small,
 // non-empty result set so the grid (and the detach affordance) render.
-jest.mock( '../hooks', () => ( {
+vi.mock( import( '../hooks' ), () => ( {
 	useMediaResults: () => ( {
 		mediaList: [
 			{ id: 1, title: 'Example', url: 'https://example.com/1' },
@@ -15,7 +18,7 @@ jest.mock( '../hooks', () => ( {
 
 // Replace `MediaList` with a marker that only reports whether it was wired for
 // detach, so the gate can be asserted without the full preview/dropdown tree.
-jest.mock( '../media-list', () => ( {
+vi.mock( import( '../media-list' ), () => ( {
 	__esModule: true,
 	default: ( { onDetach } ) => (
 		<div
@@ -27,11 +30,11 @@ jest.mock( '../media-list', () => ( {
 
 // The attach button renders through MediaUpload's render prop behind a
 // capability check; stub both so the real Button (and its label) render.
-jest.mock( '../../../media-upload', () => ( {
+vi.mock( import( '../../../media-upload' ), () => ( {
 	__esModule: true,
 	default: ( { render: renderProp } ) => renderProp( { open: () => {} } ),
 } ) );
-jest.mock( '../../../media-upload/check', () => ( {
+vi.mock( import( '../../../media-upload/check' ), () => ( {
 	__esModule: true,
 	default: ( { children } ) => children,
 } ) );
@@ -40,17 +43,17 @@ const baseCategory = {
 	name: 'attached-images',
 	labels: { name: 'Attached images', search_items: 'Search attachments' },
 	mediaType: 'image',
-	fetch: jest.fn(),
-	attach: jest.fn(),
-	detach: jest.fn(),
-	invalidate: jest.fn(),
+	fetch: vi.fn(),
+	attach: vi.fn(),
+	detach: vi.fn(),
+	invalidate: vi.fn(),
 };
 
 function renderPanel( category ) {
 	return render(
 		<MediaCategoryPanel
 			rootClientId=""
-			onInsert={ jest.fn() }
+			onInsert={ vi.fn() }
 			category={ category }
 		/>
 	);
@@ -88,8 +91,8 @@ describe( 'MediaCategoryPanel attach/detach gating', () => {
 
 describe( 'MediaCategoryPanel subscription gating', () => {
 	it( 'subscribes a local source to media changes and unsubscribes on unmount', () => {
-		const unsubscribe = jest.fn();
-		const subscribe = jest.fn( () => unsubscribe );
+		const unsubscribe = vi.fn();
+		const subscribe = vi.fn( () => unsubscribe );
 
 		const { unmount } = renderPanel( { ...baseCategory, subscribe } );
 
@@ -111,7 +114,7 @@ describe( 'MediaCategoryPanel subscription gating', () => {
 		// `subscribe` is core-only, gated like `attach`/`detach`: an
 		// extender-registered source is always external, so it cannot hook into
 		// the panel's refresh cycle just by setting the prop.
-		const subscribe = jest.fn();
+		const subscribe = vi.fn();
 
 		renderPanel( { ...baseCategory, subscribe, isExternalResource: true } );
 

package/src/components/inserter/style.scss

@@ -347,7 +347,7 @@ $block-inserter-tabs-height: 44px;
 	.block-editor-block-patterns-list {
 		display: grid;
 		grid-template-columns: 1fr 1fr;
-		grid-gap: $grid-unit-10;
+		gap: $grid-unit-10;
 		.block-editor-block-patterns-list__list-item {
 			margin-bottom: 0;
 		}
@@ -410,7 +410,7 @@ $block-inserter-tabs-height: 44px;
 
 .block-editor-block-patterns-explorer .block-editor-block-patterns-list {
 	display: grid;
-	grid-gap: $grid-unit-40;
+	gap: $grid-unit-40;
 	grid-template-columns: repeat(1, 1fr);
 	margin-bottom: $grid-unit-20;
 

package/src/components/inserter/test/get-appender-label.js

@@ -1,3 +1,4 @@
+import { describe, expect, it, vi } from 'vitest';
 import { getAppenderLabel } from '../get-appender-label';
 
 describe( 'getAppenderLabel', () => {
@@ -14,7 +15,7 @@ describe( 'getAppenderLabel', () => {
 	it( 'should return null when defaultBlock.attributes is missing', () => {
 		const defaultBlock = { name: 'core/test' };
 		const defaultBlockType = {
-			__experimentalLabel: jest.fn(),
+			__experimentalLabel: vi.fn(),
 		};
 
 		const result = getAppenderLabel( defaultBlock, defaultBlockType );
@@ -52,7 +53,7 @@ describe( 'getAppenderLabel', () => {
 			attributes: { type: 'page', kind: 'post-type' },
 		};
 		const defaultBlockType = {
-			__experimentalLabel: jest.fn( () => 'Add page' ),
+			__experimentalLabel: vi.fn( () => 'Add page' ),
 		};
 
 		getAppenderLabel( defaultBlock, defaultBlockType );
@@ -70,7 +71,7 @@ describe( 'getAppenderLabel', () => {
 		};
 		const fullLabel = 'Add page';
 		const defaultBlockType = {
-			__experimentalLabel: jest.fn( () => fullLabel ),
+			__experimentalLabel: vi.fn( () => fullLabel ),
 		};
 
 		const result = getAppenderLabel( defaultBlock, defaultBlockType );
@@ -84,7 +85,7 @@ describe( 'getAppenderLabel', () => {
 			attributes: { foo: 'bar' },
 		};
 		const defaultBlockType = {
-			__experimentalLabel: jest.fn( () => 'This is a test' ),
+			__experimentalLabel: vi.fn( () => 'This is a test' ),
 		};
 
 		const result = getAppenderLabel( defaultBlock, defaultBlockType );
@@ -98,7 +99,7 @@ describe( 'getAppenderLabel', () => {
 			attributes: { type: 'page' },
 		};
 		const defaultBlockType = {
-			__experimentalLabel: jest.fn( () => null ),
+			__experimentalLabel: vi.fn( () => null ),
 		};
 
 		const result = getAppenderLabel( defaultBlock, defaultBlockType );
@@ -112,7 +113,7 @@ describe( 'getAppenderLabel', () => {
 			attributes: { type: 'page' },
 		};
 		const defaultBlockType = {
-			__experimentalLabel: jest.fn( () => undefined ),
+			__experimentalLabel: vi.fn( () => undefined ),
 		};
 
 		const result = getAppenderLabel( defaultBlock, defaultBlockType );
@@ -126,7 +127,7 @@ describe( 'getAppenderLabel', () => {
 			attributes: { type: 'page' },
 		};
 		const defaultBlockType = {
-			__experimentalLabel: jest.fn( () => 123 ),
+			__experimentalLabel: vi.fn( () => 123 ),
 		};
 
 		const result = getAppenderLabel( defaultBlock, defaultBlockType );
@@ -140,7 +141,7 @@ describe( 'getAppenderLabel', () => {
 			attributes: { type: 'page' },
 		};
 		const defaultBlockType = {
-			__experimentalLabel: jest.fn( () => ( { label: 'page' } ) ),
+			__experimentalLabel: vi.fn( () => ( { label: 'page' } ) ),
 		};
 
 		const result = getAppenderLabel( defaultBlock, defaultBlockType );
@@ -155,7 +156,7 @@ describe( 'getAppenderLabel', () => {
 		};
 		const longLabel = 'a'.repeat( 50 );
 		const defaultBlockType = {
-			__experimentalLabel: jest.fn( () => longLabel ),
+			__experimentalLabel: vi.fn( () => longLabel ),
 		};
 
 		const result = getAppenderLabel( defaultBlock, defaultBlockType );
@@ -170,7 +171,7 @@ describe( 'getAppenderLabel', () => {
 		};
 		const label49chars = 'a'.repeat( 49 );
 		const defaultBlockType = {
-			__experimentalLabel: jest.fn( () => label49chars ),
+			__experimentalLabel: vi.fn( () => label49chars ),
 		};
 
 		const result = getAppenderLabel( defaultBlock, defaultBlockType );
@@ -184,7 +185,7 @@ describe( 'getAppenderLabel', () => {
 			attributes: { type: 'page' },
 		};
 		const defaultBlockType = {
-			__experimentalLabel: jest.fn( () => '' ),
+			__experimentalLabel: vi.fn( () => '' ),
 		};
 
 		const result = getAppenderLabel( defaultBlock, defaultBlockType );

package/src/components/inserter/test/search-items.js

@@ -1,3 +1,4 @@
+import { describe, expect, it } from 'vitest';
 import items, {
 	categories,
 	collections,

package/src/components/inserter-draggable-blocks/index.jsx

@@ -62,7 +62,7 @@ const InserterDraggableBlocks = ( {
 						/*
 						 * This will fill in the dataTransfer.types array so that
 						 * the drop zone can check if the draggable is eligible.
-						 * Unfortuantely, on drag start, we don't have access to the
+						 * Unfortunately, on drag start, we don't have access to the
 						 * actual data, only the data keys/types.
 						 */
 						event.dataTransfer.items.add( '', type );

package/src/components/inserter-list-item/style.scss

@@ -44,6 +44,7 @@
 	justify-content: center;
 	cursor: var(--wpds-cursor-control);
 	background: transparent;
+	// stylelint-disable-next-line declaration-property-value-keyword-no-deprecated -- Pending review of overflow-wrap alternative.
 	word-break: break-word;
 	@media not ( prefers-reduced-motion ) {
 		transition: all 0.05s ease-in-out;

package/src/components/inspector-controls-tabs/content-tab.jsx

@@ -11,21 +11,14 @@ const ContentTab = ( {
 		return null;
 	}
 
-	const shouldShowBlockFields =
-		window?.__experimentalContentOnlyInspectorFields;
-
 	return (
-		<>
-			{ ! shouldShowBlockFields && (
-				<PanelBody title={ __( 'Content' ) }>
-					<BlockQuickNavigation
-						clientIds={ contentClientIds }
-						onSwitchToListView={ onSwitchToListView }
-						hasListViewTab={ hasListViewTab }
-					/>
-				</PanelBody>
-			) }
-		</>
+		<PanelBody title={ __( 'Content' ) }>
+			<BlockQuickNavigation
+				clientIds={ contentClientIds }
+				onSwitchToListView={ onSwitchToListView }
+				hasListViewTab={ hasListViewTab }
+			/>
+		</PanelBody>
 	);
 };
 

package/src/components/inspector-controls-tabs/styles-tab.jsx

@@ -4,7 +4,6 @@ import { useMemo } from '@wordpress/element';
 import BlockStyles from '../block-styles';
 import InspectorControls from '../inspector-controls';
 import PositionControls from './position-controls-panel';
-import { useBorderPanelLabel } from '../../hooks/border';
 import { useBlockSettings } from '../../hooks/utils';
 import { store as blockEditorStore } from '../../store';
 import { ElementsEdit } from '../../hooks/elements';
@@ -103,8 +102,6 @@ const StylesTab = ( {
 	isSectionBlock,
 	contentClientIds,
 } ) => {
-	const borderPanelLabel = useBorderPanelLabel( { clientId } );
-
 	return (
 		<>
 			{ hasBlockStyles && <BlockStyles clientId={ clientId } /> }
@@ -148,7 +145,7 @@ const StylesTab = ( {
 					/>
 					<InspectorControls.Slot
 						group="border"
-						label={ borderPanelLabel }
+						label={ __( 'Borders' ) }
 					/>
 					<InspectorControls.Slot
 						group="elements"

package/src/components/inspector-controls-tabs/use-inspector-controls-tabs.js

@@ -79,14 +79,7 @@ export default function useInspectorControlsTabs(
 		...( hasListFills && hasStyleFills > 1 ? advancedFills : [] ),
 	];
 
-	// When the block fields experiment is active, only rely on `hasContentFills`
-	// to determine whether the content tab to be shown. The tab purely uses slot
-	// fills in this situation.
-	const shouldShowBlockFields =
-		window?.__experimentalContentOnlyInspectorFields;
-	const hasContentTab =
-		hasContentFills ||
-		( ! shouldShowBlockFields && contentClientIds?.length );
+	const hasContentTab = hasContentFills || contentClientIds?.length;
 
 	if ( hasContentTab ) {
 		tabs.push( TAB_CONTENT );