@wordpress/block-editor 15.3.1-next.6f42e1382.0 → 15.3.1-next.a730c9c8c.0

package/src/store/reducer.js

@@ -2286,6 +2286,9 @@ function getDerivedBlockEditingModesForTree(
 	const contentOnlyParents = [
 		...contentOnlyTemplateLockedClientIds,
 		...unsyncedPatternClientIds,
+		...( window?.__experimentalContentOnlyPatternInsertion
+			? templatePartClientIds
+			: [] ),
 	];
 
 	traverseBlockTree( state, treeClientId, ( block ) => {
@@ -2664,6 +2667,86 @@ export function withDerivedBlockEditingModes( reducer ) {
 				}
 				break;
 			}
+			case 'UPDATE_BLOCK_ATTRIBUTES': {
+				// Handle unsynced patterns which indicate their contentOnly-ness via
+				// the `attributes.metadata.patternName` property.
+				// Check when this is added or removed and update blockEditingModes.
+				const addedBlocks = [];
+				const removedClientIds = [];
+
+				for ( const clientId of action?.clientIds ) {
+					const attributes = action.options?.uniqueByBlock
+						? action.attributes[ clientId ]
+						: action.attributes;
+
+					if ( ! attributes ) {
+						break;
+					}
+
+					if (
+						// patternName is switching from falsy to truthy, indicating
+						// this block is becoming an unsynced pattern.
+						attributes.metadata?.patternName &&
+						! state.blocks.attributes.get( clientId )?.metadata
+							?.patternName
+					) {
+						addedBlocks.push(
+							nextState.blocks.tree.get( clientId )
+						);
+					} else if (
+						// patternName is switching from truthy to falsy, this block is becoming
+						// a regular block but was an unsynced pattern.
+						// Check that `metadata` is part of the included attributes, as
+						// `updateBlockAttributes` merges attributes, if it isn't present
+						// the previous `metadata` would be retained.
+						attributes.metadata &&
+						! attributes.metadata?.patternName &&
+						state.blocks.attributes.get( clientId )?.metadata
+							?.patternName
+					) {
+						// Include it in 'removedClientIds'.
+						removedClientIds.push( clientId );
+					}
+				}
+
+				if ( ! addedBlocks?.length && ! removedClientIds?.length ) {
+					break;
+				}
+
+				const nextDerivedBlockEditingModes =
+					getDerivedBlockEditingModesUpdates( {
+						prevState: state,
+						nextState,
+						addedBlocks,
+						removedClientIds,
+						isNavMode: false,
+					} );
+				const nextDerivedNavModeBlockEditingModes =
+					getDerivedBlockEditingModesUpdates( {
+						prevState: state,
+						nextState,
+						addedBlocks,
+						removedClientIds,
+						isNavMode: true,
+					} );
+
+				if (
+					nextDerivedBlockEditingModes ||
+					nextDerivedNavModeBlockEditingModes
+				) {
+					return {
+						...nextState,
+						derivedBlockEditingModes:
+							nextDerivedBlockEditingModes ??
+							state.derivedBlockEditingModes,
+						derivedNavModeBlockEditingModes:
+							nextDerivedNavModeBlockEditingModes ??
+							state.derivedNavModeBlockEditingModes,
+					};
+				}
+
+				break;
+			}
 			case 'UPDATE_BLOCK_LIST_SETTINGS': {
 				// Handle the addition and removal of contentOnly template locked blocks.
 				const addedBlocks = [];

package/src/store/test/reducer.js

@@ -4505,5 +4505,296 @@ describe( 'state', () => {
 				);
 			} );
 		} );
+
+		// Tests for the contentOnly experiments pattern.
+		// If/when the experiment is stabilized, this wrapping `describe` and
+		// `beforeAll`/`afterAll` can be removed, un-nesting the tests within.
+		describe( 'contentOnly patterns experiment', () => {
+			beforeAll( () => {
+				globalThis.window.__experimentalContentOnlyPatternInsertion = true;
+			} );
+
+			afterAll( () => {
+				delete globalThis.window
+					.__experimentalContentOnlyPatternInsertion;
+			} );
+
+			describe( 'unsynced patterns', () => {
+				let initialState;
+				beforeAll( () => {
+					initialState = dispatchActions(
+						[
+							{
+								type: 'RESET_BLOCKS',
+								blocks: [
+									{
+										name: 'core/group',
+										clientId: 'group-1',
+										attributes: {
+											metadata: {
+												patternName: 'test-pattern',
+											},
+										},
+										innerBlocks: [
+											{
+												name: 'core/paragraph',
+												clientId: 'paragraph-1',
+												attributes: {},
+												innerBlocks: [],
+											},
+											{
+												name: 'core/group',
+												clientId: 'group-2',
+												attributes: {},
+												innerBlocks: [
+													{
+														name: 'core/paragraph',
+														clientId: 'paragraph-2',
+														attributes: {},
+														innerBlocks: [],
+													},
+												],
+											},
+										],
+									},
+								],
+							},
+						],
+						testReducer,
+						initialState
+					);
+				} );
+
+				it( 'returns the expected block editing modes for an unsynced pattern', () => {
+					expect( initialState.derivedBlockEditingModes ).toEqual(
+						new Map(
+							Object.entries( {
+								'paragraph-1': 'contentOnly',
+								'group-2': 'disabled',
+								'paragraph-2': 'contentOnly',
+							} )
+						)
+					);
+				} );
+
+				it( 'removes block editing modes when an unsynced pattern is removed', () => {
+					const { derivedBlockEditingModes } = dispatchActions(
+						[
+							{
+								type: 'REMOVE_BLOCKS',
+								clientIds: [ 'group-1' ],
+							},
+						],
+						testReducer,
+						initialState
+					);
+
+					expect( derivedBlockEditingModes ).toEqual( new Map() );
+				} );
+
+				it( 'removes block editing modes when the `patternName` attribute is removed from the unsynced pattern', () => {
+					const { derivedBlockEditingModes } = dispatchActions(
+						[
+							{
+								type: 'UPDATE_BLOCK_ATTRIBUTES',
+								clientIds: [ 'group-1' ],
+								attributes: {
+									metadata: {
+										patternName: undefined,
+									},
+								},
+							},
+						],
+						testReducer,
+						initialState
+					);
+
+					expect( derivedBlockEditingModes ).toEqual( new Map() );
+				} );
+
+				it( 'allows explicitly set blockEditingModes to override the unsynced pattern editing modes', () => {
+					const { derivedBlockEditingModes } = dispatchActions(
+						[
+							{
+								type: 'SET_BLOCK_EDITING_MODE',
+								clientId: 'paragraph-2',
+								mode: 'disabled',
+							},
+						],
+						testReducer,
+						initialState
+					);
+
+					expect( derivedBlockEditingModes ).toEqual(
+						new Map(
+							Object.entries( {
+								'paragraph-1': 'contentOnly',
+								'group-2': 'disabled',
+								// Paragraph 2 already has an explicit mode, so isn't set as a derived mode.
+							} )
+						)
+					);
+				} );
+
+				it( 'sets the correct block editing modes when a new unsynced pattern is inserted', () => {
+					const { derivedBlockEditingModes } = dispatchActions(
+						[
+							{
+								type: 'INSERT_BLOCKS',
+								rootClientId: '',
+								index: 1,
+								blocks: [
+									{
+										name: 'core/group',
+										clientId: 'group-3',
+										attributes: {
+											metadata: {
+												patternName: 'test-pattern-2',
+											},
+										},
+										innerBlocks: [
+											{
+												name: 'core/paragraph',
+												clientId: 'paragraph-3',
+												attributes: {},
+												innerBlocks: [],
+											},
+										],
+									},
+								],
+							},
+						],
+						testReducer,
+						initialState
+					);
+
+					expect( derivedBlockEditingModes ).toEqual(
+						new Map(
+							Object.entries( {
+								'paragraph-1': 'contentOnly',
+								'group-2': 'disabled',
+								'paragraph-2': 'contentOnly',
+								'paragraph-3': 'contentOnly',
+							} )
+						)
+					);
+				} );
+			} );
+
+			describe( 'template parts', () => {
+				let initialState;
+				beforeAll( () => {
+					// Simulates how the editor typically inserts controlled blocks,
+					// - first the template part is inserted with no inner blocks.
+					// - next the template part is marked as a controlled block.
+					// - finally, once the inner blocks of the template part are received, they're inserted.
+					initialState = dispatchActions(
+						[
+							{
+								type: 'RESET_BLOCKS',
+								blocks: [
+									{
+										name: 'core/template-part',
+										clientId: 'template-part',
+										attributes: {},
+										innerBlocks: [],
+									},
+								],
+							},
+							{
+								type: 'SET_HAS_CONTROLLED_INNER_BLOCKS',
+								clientId: 'template-part',
+								hasControlledInnerBlocks: true,
+							},
+							{
+								type: 'REPLACE_INNER_BLOCKS',
+								rootClientId: 'template-part',
+								blocks: [
+									{
+										name: 'core/paragraph',
+										clientId: 'template-part-paragraph',
+										attributes: {},
+										innerBlocks: [],
+									},
+									{
+										name: 'core/group',
+										clientId: 'template-part-group',
+										attributes: {},
+										innerBlocks: [
+											{
+												name: 'core/paragraph',
+												clientId:
+													'template-part-grouped-paragraph',
+												attributes: {},
+												innerBlocks: [],
+											},
+										],
+									},
+								],
+							},
+						],
+						testReducer,
+						initialState
+					);
+				} );
+
+				it( 'returns the expected block editing modes for synced patterns', () => {
+					expect( initialState.derivedBlockEditingModes ).toEqual(
+						new Map(
+							Object.entries( {
+								'template-part-paragraph': 'contentOnly',
+								'template-part-group': 'disabled',
+								'template-part-grouped-paragraph':
+									'contentOnly',
+							} )
+						)
+					);
+				} );
+
+				it( 'removes the block editing modes when the template part is removed', () => {
+					const { derivedBlockEditingModes } = dispatchActions(
+						[
+							{
+								type: 'REMOVE_BLOCKS',
+								clientIds: [ 'template-part' ],
+							},
+							{
+								type: 'SET_HAS_CONTROLLED_INNER_BLOCKS',
+								clientId: 'template-part',
+								hasControlledInnerBlocks: false,
+							},
+						],
+						testReducer,
+						initialState
+					);
+
+					expect( derivedBlockEditingModes ).toEqual( new Map() );
+				} );
+
+				it( 'allows explicitly set blockEditingModes to override the template part editing modes', () => {
+					const { derivedBlockEditingModes } = dispatchActions(
+						[
+							{
+								type: 'SET_BLOCK_EDITING_MODE',
+								clientId: 'template-part-grouped-paragraph',
+								mode: 'disabled',
+							},
+						],
+						testReducer,
+						initialState
+					);
+
+					expect( derivedBlockEditingModes ).toEqual(
+						new Map(
+							Object.entries( {
+								'template-part-paragraph': 'contentOnly',
+								'template-part-group': 'disabled',
+								// template-part-grouped-paragraph already has an explicit mode, so isn't set as a derived mode.
+							} )
+						)
+					);
+				} );
+			} );
+		} );
 	} );
 } );

package/src/utils/block-bindings.js

@@ -14,7 +14,7 @@ const PATTERN_OVERRIDES_SOURCE = 'core/pattern-overrides';
 const BLOCK_BINDINGS_ALLOWED_BLOCKS = {
 	'core/paragraph': [ 'content' ],
 	'core/heading': [ 'content' ],
-	'core/image': [ 'id', 'url', 'title', 'alt' ],
+	'core/image': [ 'id', 'url', 'title', 'alt', 'caption' ],
 	'core/button': [ 'url', 'text', 'linkTarget', 'rel' ],
 	'core/post-date': [ 'datetime' ],
 };