From b84e51e8c1b7d320e08a0e86d3fe67ef75e18c2c Mon Sep 17 00:00:00 2001 From: yogeshbhutkar Date: Mon, 5 May 2025 14:54:30 +0530 Subject: [PATCH 01/18] fix: use key down to open/close the details block --- packages/block-library/src/details/edit.js | 28 ++++++++++++++++++---- 1 file changed, 24 insertions(+), 4 deletions(-) diff --git a/packages/block-library/src/details/edit.js b/packages/block-library/src/details/edit.js index 693e0fb310add0..5c506b81fd9149 100644 --- a/packages/block-library/src/details/edit.js +++ b/packages/block-library/src/details/edit.js @@ -6,6 +6,7 @@ import { useBlockProps, useInnerBlocksProps, InspectorControls, + store as blockEditorStore, } from '@wordpress/block-editor'; import { TextControl, @@ -20,6 +21,7 @@ import { useState } from '@wordpress/element'; * Internal dependencies */ import { useToolsPanelDropdownMenuProps } from '../utils/hooks'; +import { useSelect } from '@wordpress/data'; const TEMPLATE = [ [ @@ -30,7 +32,7 @@ const TEMPLATE = [ ], ]; -function DetailsEdit( { attributes, setAttributes } ) { +function DetailsEdit( { attributes, setAttributes, isSelected, clientId } ) { const { name, showContent, summary, allowedBlocks, placeholder } = attributes; const blockProps = useBlockProps(); @@ -42,6 +44,15 @@ function DetailsEdit( { attributes, setAttributes } ) { const [ isOpen, setIsOpen ] = useState( showContent ); const dropdownMenuProps = useToolsPanelDropdownMenuProps(); + // Check if the inner blocks are selected. + const hasSelectedInnerBlock = useSelect( + ( select ) => + select( blockEditorStore ).hasSelectedInnerBlock( clientId, true ), + [ clientId ] + ); + + const shouldRenderChildren = hasSelectedInnerBlock || isSelected || isOpen; + return ( <> @@ -93,10 +104,19 @@ function DetailsEdit( { attributes, setAttributes } ) {
setIsOpen( event.target.open ) } > - + { + event.preventDefault(); + if ( event.key === 'ArrowDown' ) { + setIsOpen( true ); + } else if ( event.key === 'ArrowUp' && isOpen ) { + setIsOpen( false ); + } + } } + > - { innerBlocksProps.children } + { shouldRenderChildren && innerBlocksProps.children }
); From b324957b6860274ba425db53e190fe332085c9fa Mon Sep 17 00:00:00 2001 From: yogeshbhutkar Date: Mon, 5 May 2025 14:58:01 +0530 Subject: [PATCH 02/18] chore: fix import order --- packages/block-library/src/details/edit.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/details/edit.js b/packages/block-library/src/details/edit.js index 5c506b81fd9149..32867f9eb144ef 100644 --- a/packages/block-library/src/details/edit.js +++ b/packages/block-library/src/details/edit.js @@ -16,12 +16,12 @@ import { } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { useState } from '@wordpress/element'; +import { useSelect } from '@wordpress/data'; /** * Internal dependencies */ import { useToolsPanelDropdownMenuProps } from '../utils/hooks'; -import { useSelect } from '@wordpress/data'; const TEMPLATE = [ [ From 7c9b0f8399a25e95a42af365acba827bc59572ce Mon Sep 17 00:00:00 2001 From: yogeshbhutkar Date: Mon, 5 May 2025 19:18:37 +0530 Subject: [PATCH 03/18] fix: do not conditionally render details children --- packages/block-library/src/details/edit.js | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/packages/block-library/src/details/edit.js b/packages/block-library/src/details/edit.js index 32867f9eb144ef..e87f6173f2a489 100644 --- a/packages/block-library/src/details/edit.js +++ b/packages/block-library/src/details/edit.js @@ -32,7 +32,7 @@ const TEMPLATE = [ ], ]; -function DetailsEdit( { attributes, setAttributes, isSelected, clientId } ) { +function DetailsEdit( { attributes, setAttributes, clientId } ) { const { name, showContent, summary, allowedBlocks, placeholder } = attributes; const blockProps = useBlockProps(); @@ -51,8 +51,6 @@ function DetailsEdit( { attributes, setAttributes, isSelected, clientId } ) { [ clientId ] ); - const shouldRenderChildren = hasSelectedInnerBlock || isSelected || isOpen; - return ( <> @@ -109,7 +107,6 @@ function DetailsEdit( { attributes, setAttributes, isSelected, clientId } ) { > { - event.preventDefault(); if ( event.key === 'ArrowDown' ) { setIsOpen( true ); } else if ( event.key === 'ArrowUp' && isOpen ) { @@ -128,7 +125,7 @@ function DetailsEdit( { attributes, setAttributes, isSelected, clientId } ) { } /> - { shouldRenderChildren && innerBlocksProps.children } + { innerBlocksProps.children } ); From 6e93dc7dbe0b2c7c8d446104e95f0bf1d5fb86c9 Mon Sep 17 00:00:00 2001 From: yogeshbhutkar Date: Wed, 7 May 2025 09:47:41 +0530 Subject: [PATCH 04/18] feat: expose `withIgnoreIMEEvents` to private api --- packages/components/src/private-apis.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/components/src/private-apis.ts b/packages/components/src/private-apis.ts index b2f800f9200b0a..fa618e21ed2938 100644 --- a/packages/components/src/private-apis.ts +++ b/packages/components/src/private-apis.ts @@ -7,6 +7,7 @@ import { ComponentsContext } from './context/context-system-provider'; import Theme from './theme'; import { Tabs } from './tabs'; import { kebabCase, normalizeTextString } from './utils/strings'; +import { withIgnoreIMEEvents } from './utils/with-ignore-ime-events'; import { lock } from './lock-unlock'; import Badge from './badge'; @@ -18,6 +19,7 @@ lock( privateApis, { Theme, Menu, kebabCase, + withIgnoreIMEEvents, Badge, normalizeTextString, } ); From 6e496b34823824498d63422aad8babb29459bb62 Mon Sep 17 00:00:00 2001 From: yogeshbhutkar Date: Wed, 7 May 2025 09:49:30 +0530 Subject: [PATCH 05/18] feat: wrap handler within `withIgnoreIMEEvents` --- packages/block-library/src/details/edit.js | 19 ++++++++++++------- 1 file changed, 12 insertions(+), 7 deletions(-) diff --git a/packages/block-library/src/details/edit.js b/packages/block-library/src/details/edit.js index e87f6173f2a489..2598535c952af1 100644 --- a/packages/block-library/src/details/edit.js +++ b/packages/block-library/src/details/edit.js @@ -13,6 +13,7 @@ import { ToggleControl, __experimentalToolsPanel as ToolsPanel, __experimentalToolsPanelItem as ToolsPanelItem, + privateApis as componentsPrivateApis, } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { useState } from '@wordpress/element'; @@ -22,6 +23,9 @@ import { useSelect } from '@wordpress/data'; * Internal dependencies */ import { useToolsPanelDropdownMenuProps } from '../utils/hooks'; +import { unlock } from '../lock-unlock'; + +const { withIgnoreIMEEvents } = unlock( componentsPrivateApis ); const TEMPLATE = [ [ @@ -51,6 +55,13 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) { [ clientId ] ); + const handleSummaryKeyDown = ( event ) => { + if ( event.key === 'Enter' && ! event.shiftKey ) { + setIsOpen( ( prevIsOpen ) => ! prevIsOpen ); + event.preventDefault(); + } + }; + return ( <> @@ -106,13 +117,7 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) { onToggle={ ( event ) => setIsOpen( event.target.open ) } > { - if ( event.key === 'ArrowDown' ) { - setIsOpen( true ); - } else if ( event.key === 'ArrowUp' && isOpen ) { - setIsOpen( false ); - } - } } + onKeyDown={ withIgnoreIMEEvents( handleSummaryKeyDown ) } > Date: Wed, 7 May 2025 11:24:44 +0530 Subject: [PATCH 06/18] chore(test): add e2e test for details block --- test/e2e/specs/editor/blocks/details.spec.js | 63 ++++++++++++++++++++ 1 file changed, 63 insertions(+) create mode 100644 test/e2e/specs/editor/blocks/details.spec.js diff --git a/test/e2e/specs/editor/blocks/details.spec.js b/test/e2e/specs/editor/blocks/details.spec.js new file mode 100644 index 00000000000000..69ee66fe44eb51 --- /dev/null +++ b/test/e2e/specs/editor/blocks/details.spec.js @@ -0,0 +1,63 @@ +/** + * WordPress dependencies + */ +const { test, expect } = require( '@wordpress/e2e-test-utils-playwright' ); + +test.describe( 'Details', () => { + test.beforeEach( async ( { admin } ) => { + await admin.createNewPost(); + } ); + + test( 'can toggle hidden blocks by pressing enter', async ( { + editor, + page, + } ) => { + // Insert a details block with empty inner blocks. + await editor.insertBlock( { + name: 'core/details', + attributes: { + summary: 'Details summary', + }, + } ); + + // Open the details block. + await page.keyboard.press( 'Enter' ); + + // The inner block should be visible. + await expect( + editor.canvas.getByRole( 'document', { name: 'Empty block' } ) + ).toBeVisible(); + + // Close the details block. + await page.keyboard.press( 'Enter' ); + + // The inner block should be hidden. + await expect( + editor.canvas.getByRole( 'document', { name: 'Empty block' } ) + ).toBeHidden(); + } ); + + test( 'can create a multiline summary with Shift+Enter', async ( { + editor, + page, + } ) => { + // Insert a details block. + await editor.insertBlock( { + name: 'core/details', + } ); + + const summary = editor.canvas.getByRole( 'textbox', { + name: 'Write summary', + } ); + + // Add a multiline summary. + await summary.type( 'First line' ); + await page.keyboard.press( 'Shift+Enter' ); + await summary.type( 'Second line' ); + + // Verify the summary is multiline. + await expect( summary ).toHaveText( 'First line\nSecond line', { + useInnerText: true, + } ); + } ); +} ); From 60e3607403688fd480cfef89ebfaebca336edda1 Mon Sep 17 00:00:00 2001 From: yogeshbhutkar Date: Wed, 7 May 2025 11:53:41 +0530 Subject: [PATCH 07/18] fix: prevent space in rich-text from toggling details --- packages/block-library/src/details/edit.js | 8 ++++++++ test/e2e/specs/editor/blocks/details.spec.js | 21 ++++++++++++++++++++ 2 files changed, 29 insertions(+) diff --git a/packages/block-library/src/details/edit.js b/packages/block-library/src/details/edit.js index 2598535c952af1..a2c0998320fa83 100644 --- a/packages/block-library/src/details/edit.js +++ b/packages/block-library/src/details/edit.js @@ -62,6 +62,13 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) { } }; + // Prevent spacebar from toggling
while typing. + const handleSummaryKeyUp = ( event ) => { + if ( event.key === ' ' ) { + event.preventDefault(); + } + }; + return ( <> @@ -118,6 +125,7 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) { > { useInnerText: true, } ); } ); + + test( 'typing space in summary rich-text should not toggle details', async ( { + editor, + } ) => { + // Insert a details block. + await editor.insertBlock( { + name: 'core/details', + } ); + + const summary = editor.canvas.getByRole( 'textbox', { + name: 'Write summary', + } ); + + // Type space in the summary rich-text. + await summary.type( ' ' ); + + // Verify the details block is not toggled. + await expect( + editor.canvas.getByRole( 'document', { name: 'Empty block' } ) + ).toBeHidden(); + } ); } ); From 8d9a80f39fb51c4de4bb24ea78483e925cd635dc Mon Sep 17 00:00:00 2001 From: yogeshbhutkar Date: Wed, 7 May 2025 12:10:47 +0530 Subject: [PATCH 08/18] chore: add CHANGELOG --- packages/components/CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index cf665a116f6b33..3b5a954d37a0dc 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -46,6 +46,7 @@ ### Internal - `ColorPicker`: Add tests for Alpha slider functionality ([#69203](https://github.com/WordPress/gutenberg/pull/69203)). +- Mark `withIgnoreIMEEvents()` function as private API ([#70056](https://github.com/WordPress/gutenberg/pull/70056)). ## 29.8.0 (2025-04-11) From 66646d5e6550b43afab332149867702063d4c6b1 Mon Sep 17 00:00:00 2001 From: yogeshbhutkar Date: Thu, 8 May 2025 10:09:11 +0530 Subject: [PATCH 09/18] fix: wrap key up handler with `withIgnoreIMEEvents` --- packages/block-library/src/details/edit.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/details/edit.js b/packages/block-library/src/details/edit.js index a2c0998320fa83..af5dcc6e2a9671 100644 --- a/packages/block-library/src/details/edit.js +++ b/packages/block-library/src/details/edit.js @@ -125,7 +125,7 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) { > Date: Thu, 8 May 2025 11:14:27 +0530 Subject: [PATCH 10/18] chore(e2e): updated tests * Adds using inner block content wherever required * Adds an e2e test to verify list view auto expand and focus --- test/e2e/specs/editor/blocks/details.spec.js | 65 +++++++++++++++++++- 1 file changed, 62 insertions(+), 3 deletions(-) diff --git a/test/e2e/specs/editor/blocks/details.spec.js b/test/e2e/specs/editor/blocks/details.spec.js index 1941c0af4d4646..2b7e954b6eeaad 100644 --- a/test/e2e/specs/editor/blocks/details.spec.js +++ b/test/e2e/specs/editor/blocks/details.spec.js @@ -18,6 +18,14 @@ test.describe( 'Details', () => { attributes: { summary: 'Details summary', }, + innerBlocks: [ + { + name: 'core/paragraph', + attributes: { + content: 'Details content', + }, + }, + ], } ); // Open the details block. @@ -25,15 +33,15 @@ test.describe( 'Details', () => { // The inner block should be visible. await expect( - editor.canvas.getByRole( 'document', { name: 'Empty block' } ) - ).toBeVisible(); + editor.canvas.getByRole( 'document', { name: 'Block: Paragraph' } ) + ).toContainText( 'Details content' ); // Close the details block. await page.keyboard.press( 'Enter' ); // The inner block should be hidden. await expect( - editor.canvas.getByRole( 'document', { name: 'Empty block' } ) + editor.canvas.getByRole( 'document', { name: 'Block: Paragraph' } ) ).toBeHidden(); } ); @@ -81,4 +89,55 @@ test.describe( 'Details', () => { editor.canvas.getByRole( 'document', { name: 'Empty block' } ) ).toBeHidden(); } ); + + test( 'selecting hidden blocks in list view expands details and focuses content', async ( { + editor, + page, + pageUtils, + } ) => { + // Insert a details block. + await editor.insertBlock( { + name: 'core/details', + attributes: { + summary: 'Details summary', + }, + innerBlocks: [ + { + name: 'core/paragraph', + attributes: { + content: 'Details content', + }, + }, + ], + } ); + + const listView = page.getByRole( 'treegrid', { + name: 'Block navigation structure', + } ); + + // Open the list view. + await pageUtils.pressKeys( 'access+o' ); + + // Verify inner blocks appear in the list view. + await page.keyboard.press( 'ArrowRight' ); + await expect( + listView.getByRole( 'link', { + name: 'Paragraph', + } ) + ).toBeVisible(); + + // Verify the first inner block in the list view is focused. + await page.keyboard.press( 'ArrowDown' ); + await expect( + listView.getByRole( 'link', { + name: 'Paragraph', + } ) + ).toBeFocused(); + + // Verify the first inner block in the editor canvas is focused. + await page.keyboard.press( 'Enter' ); + await expect( + editor.canvas.getByRole( 'document', { name: 'Block: Paragraph' } ) + ).toBeFocused(); + } ); } ); From 51ee2b9ac72c547fe82ebcf66ad0880c85dcd951 Mon Sep 17 00:00:00 2001 From: yogeshbhutkar Date: Thu, 8 May 2025 11:17:29 +0530 Subject: [PATCH 11/18] chore: move `CHANGELOG` to unreleased --- packages/components/CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index 3b5a954d37a0dc..7afb5186b7230b 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -26,6 +26,7 @@ ### Internal - Clarify `withIgnoreIMEEvents` documentation to reflect support for all keyboard event handlers ([#70098](https://github.com/WordPress/gutenberg/pull/70098)). +- Mark `withIgnoreIMEEvents()` function as private API ([#70056](https://github.com/WordPress/gutenberg/pull/70056)). ## 29.9.0 (2025-05-07) @@ -46,7 +47,6 @@ ### Internal - `ColorPicker`: Add tests for Alpha slider functionality ([#69203](https://github.com/WordPress/gutenberg/pull/69203)). -- Mark `withIgnoreIMEEvents()` function as private API ([#70056](https://github.com/WordPress/gutenberg/pull/70056)). ## 29.8.0 (2025-04-11) From adac9740f51152eff7581348e66aedee9967d086 Mon Sep 17 00:00:00 2001 From: yogeshbhutkar Date: Thu, 8 May 2025 12:45:44 +0530 Subject: [PATCH 12/18] chore: revert usage of `withIgnoreIMEEvents` --- packages/block-library/src/details/edit.js | 8 ++------ packages/components/src/private-apis.ts | 2 -- 2 files changed, 2 insertions(+), 8 deletions(-) diff --git a/packages/block-library/src/details/edit.js b/packages/block-library/src/details/edit.js index af5dcc6e2a9671..1056c5f43f5d36 100644 --- a/packages/block-library/src/details/edit.js +++ b/packages/block-library/src/details/edit.js @@ -13,7 +13,6 @@ import { ToggleControl, __experimentalToolsPanel as ToolsPanel, __experimentalToolsPanelItem as ToolsPanelItem, - privateApis as componentsPrivateApis, } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { useState } from '@wordpress/element'; @@ -23,9 +22,6 @@ import { useSelect } from '@wordpress/data'; * Internal dependencies */ import { useToolsPanelDropdownMenuProps } from '../utils/hooks'; -import { unlock } from '../lock-unlock'; - -const { withIgnoreIMEEvents } = unlock( componentsPrivateApis ); const TEMPLATE = [ [ @@ -124,8 +120,8 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) { onToggle={ ( event ) => setIsOpen( event.target.open ) } > Date: Mon, 12 May 2025 08:37:12 +0530 Subject: [PATCH 13/18] fix: apply `withIgnoreIMEEvents` to key down Manual testing with IMEs showed that the HOF can safely be applied just to the key down events --- packages/block-library/src/details/edit.js | 6 +++++- packages/components/src/private-apis.ts | 2 ++ 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/packages/block-library/src/details/edit.js b/packages/block-library/src/details/edit.js index 1056c5f43f5d36..a2c0998320fa83 100644 --- a/packages/block-library/src/details/edit.js +++ b/packages/block-library/src/details/edit.js @@ -13,6 +13,7 @@ import { ToggleControl, __experimentalToolsPanel as ToolsPanel, __experimentalToolsPanelItem as ToolsPanelItem, + privateApis as componentsPrivateApis, } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { useState } from '@wordpress/element'; @@ -22,6 +23,9 @@ import { useSelect } from '@wordpress/data'; * Internal dependencies */ import { useToolsPanelDropdownMenuProps } from '../utils/hooks'; +import { unlock } from '../lock-unlock'; + +const { withIgnoreIMEEvents } = unlock( componentsPrivateApis ); const TEMPLATE = [ [ @@ -120,7 +124,7 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) { onToggle={ ( event ) => setIsOpen( event.target.open ) } > Date: Fri, 16 May 2025 13:01:52 +0530 Subject: [PATCH 14/18] feat: add visually hidden instructions for expanding/collapsing details --- packages/block-library/src/details/edit.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/packages/block-library/src/details/edit.js b/packages/block-library/src/details/edit.js index a2c0998320fa83..c3671d363d31e9 100644 --- a/packages/block-library/src/details/edit.js +++ b/packages/block-library/src/details/edit.js @@ -11,6 +11,7 @@ import { import { TextControl, ToggleControl, + VisuallyHidden, __experimentalToolsPanel as ToolsPanel, __experimentalToolsPanelItem as ToolsPanelItem, privateApis as componentsPrivateApis, @@ -18,6 +19,7 @@ import { import { __ } from '@wordpress/i18n'; import { useState } from '@wordpress/element'; import { useSelect } from '@wordpress/data'; +import { useInstanceId } from '@wordpress/compose'; /** * Internal dependencies @@ -39,7 +41,10 @@ const TEMPLATE = [ function DetailsEdit( { attributes, setAttributes, clientId } ) { const { name, showContent, summary, allowedBlocks, placeholder } = attributes; - const blockProps = useBlockProps(); + const instanceId = useInstanceId( DetailsEdit, 'details-edit-desc' ); + const blockProps = useBlockProps( { + 'aria-describedby': instanceId, + } ); const innerBlocksProps = useInnerBlocksProps( blockProps, { template: TEMPLATE, __experimentalCaptureToolbars: true, @@ -127,6 +132,11 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) { onKeyDown={ withIgnoreIMEEvents( handleSummaryKeyDown ) } onKeyUp={ handleSummaryKeyUp } > + + { __( + 'Press Enter to expand or collapse the details.' + ) } + Date: Mon, 19 May 2025 10:02:33 +0530 Subject: [PATCH 15/18] fix: add `aria-describedby` and add it to RichText --- packages/block-library/src/details/edit.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/block-library/src/details/edit.js b/packages/block-library/src/details/edit.js index c3671d363d31e9..a21a00bade264b 100644 --- a/packages/block-library/src/details/edit.js +++ b/packages/block-library/src/details/edit.js @@ -42,9 +42,7 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) { const { name, showContent, summary, allowedBlocks, placeholder } = attributes; const instanceId = useInstanceId( DetailsEdit, 'details-edit-desc' ); - const blockProps = useBlockProps( { - 'aria-describedby': instanceId, - } ); + const blockProps = useBlockProps(); const innerBlocksProps = useInnerBlocksProps( blockProps, { template: TEMPLATE, __experimentalCaptureToolbars: true, @@ -140,6 +138,7 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) { Date: Wed, 21 May 2025 10:13:12 +0530 Subject: [PATCH 16/18] fix: update aria-label for RichText --- packages/block-library/src/details/edit.js | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/packages/block-library/src/details/edit.js b/packages/block-library/src/details/edit.js index a21a00bade264b..6b0c933086cc67 100644 --- a/packages/block-library/src/details/edit.js +++ b/packages/block-library/src/details/edit.js @@ -11,7 +11,6 @@ import { import { TextControl, ToggleControl, - VisuallyHidden, __experimentalToolsPanel as ToolsPanel, __experimentalToolsPanelItem as ToolsPanelItem, privateApis as componentsPrivateApis, @@ -130,14 +129,11 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) { onKeyDown={ withIgnoreIMEEvents( handleSummaryKeyDown ) } onKeyUp={ handleSummaryKeyUp } > - - { __( - 'Press Enter to expand or collapse the details.' - ) } - Date: Wed, 21 May 2025 10:16:42 +0530 Subject: [PATCH 17/18] fix: remove the usage of `aria-describedby` --- packages/block-library/src/details/edit.js | 3 --- 1 file changed, 3 deletions(-) diff --git a/packages/block-library/src/details/edit.js b/packages/block-library/src/details/edit.js index 6b0c933086cc67..1205b8fa099c9c 100644 --- a/packages/block-library/src/details/edit.js +++ b/packages/block-library/src/details/edit.js @@ -18,7 +18,6 @@ import { import { __ } from '@wordpress/i18n'; import { useState } from '@wordpress/element'; import { useSelect } from '@wordpress/data'; -import { useInstanceId } from '@wordpress/compose'; /** * Internal dependencies @@ -40,7 +39,6 @@ const TEMPLATE = [ function DetailsEdit( { attributes, setAttributes, clientId } ) { const { name, showContent, summary, allowedBlocks, placeholder } = attributes; - const instanceId = useInstanceId( DetailsEdit, 'details-edit-desc' ); const blockProps = useBlockProps(); const innerBlocksProps = useInnerBlocksProps( blockProps, { template: TEMPLATE, @@ -134,7 +132,6 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) { aria-label={ __( 'Write summary. Press Enter to expand or collapse the details.' ) } - aria-describedby={ instanceId } placeholder={ placeholder || __( 'Write summary…' ) } withoutInteractiveFormatting value={ summary } From 0b2c3af07771e93ce7b2df589e90fda73fa56a47 Mon Sep 17 00:00:00 2001 From: yogeshbhutkar Date: Mon, 2 Jun 2025 09:00:50 +0530 Subject: [PATCH 18/18] chore: move `CHANGELOG` to unreleased --- packages/components/CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index 7afb5186b7230b..4e9ddc5a729127 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -15,6 +15,7 @@ ### Internal - Expose `normalizeTextString` method as private API ([#70178](https://github.com/WordPress/gutenberg/pull/70178)). +- Mark `withIgnoreIMEEvents()` function as private API ([#70056](https://github.com/WordPress/gutenberg/pull/70056)). ## 29.10.0 (2025-05-22) @@ -26,7 +27,6 @@ ### Internal - Clarify `withIgnoreIMEEvents` documentation to reflect support for all keyboard event handlers ([#70098](https://github.com/WordPress/gutenberg/pull/70098)). -- Mark `withIgnoreIMEEvents()` function as private API ([#70056](https://github.com/WordPress/gutenberg/pull/70056)). ## 29.9.0 (2025-05-07)