From 35ddbfb928c875ab8a1ca2fb523b8749b15bcd81 Mon Sep 17 00:00:00 2001 From: Andrew Serong <14988353+andrewserong@users.noreply.github.com> Date: Wed, 12 Jun 2024 14:52:39 +1000 Subject: [PATCH] List View: Fix home and end key behaviour in very long lists (#62312) * List View: Fix home and end key behaviour in very long lists * Update e2e test Co-authored-by: andrewserong Co-authored-by: talldan Co-authored-by: ellatrix --- packages/block-editor/src/components/list-view/branch.js | 6 +++++- test/e2e/specs/editor/various/list-view.spec.js | 2 +- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/packages/block-editor/src/components/list-view/branch.js b/packages/block-editor/src/components/list-view/branch.js index 16480927dc4665..ebd1d5a36f5700 100644 --- a/packages/block-editor/src/components/list-view/branch.js +++ b/packages/block-editor/src/components/list-view/branch.js @@ -194,10 +194,14 @@ function ListViewBranch( props ) { // This prevents the entire tree from being rendered when a branch is // selected, or a user selects all blocks, while still enabling scroll // into view behavior when selecting a block or opening the list view. + // The first and last blocks of the list are always rendered, to ensure + // that Home and End keys work as expected. const showBlock = isDragged || blockInView || - ( isSelected && clientId === selectedClientIds[ 0 ] ); + ( isSelected && clientId === selectedClientIds[ 0 ] ) || + index === 0 || + index === blockCount - 1; return ( { showBlock && ( diff --git a/test/e2e/specs/editor/various/list-view.spec.js b/test/e2e/specs/editor/various/list-view.spec.js index 143fea43c09eef..531faa8bea049d 100644 --- a/test/e2e/specs/editor/various/list-view.spec.js +++ b/test/e2e/specs/editor/various/list-view.spec.js @@ -1120,7 +1120,7 @@ test.describe( 'List View', () => { 'Pressing keyboard shortcut should also work when the menu is opened and focused' ) .toMatchObject( [ - { name: 'core/paragraph', selected: true, focused: false }, + { name: 'core/paragraph', selected: true, focused: true }, { name: 'core/file', selected: false, focused: false }, ] ); await expect(