diff --git a/packages/block-editor/src/components/block-list/insertion-point.js b/packages/block-editor/src/components/block-list/insertion-point.js
index f2842aa5b11d50..d759d568efd3e9 100644
--- a/packages/block-editor/src/components/block-list/insertion-point.js
+++ b/packages/block-editor/src/components/block-list/insertion-point.js
@@ -200,6 +200,18 @@ function InsertionPointPopover( {
}
}
+ // Only show the inserter when there's a `nextElement` (a block after the
+ // insertion point). At the end of the block list the trailing appender
+ // should serve the purpose of inserting blocks.
+ const showInsertionPointInserter =
+ ! isHidden && nextElement && ( isInserterShown || isInserterForced );
+
+ // Show the indicator if the insertion point inserter is visible, or if
+ // the `showInsertionPoint` state is `true`. The latter is generally true
+ // when hovering blocks for insertion in the block library.
+ const showInsertionPointIndicator =
+ showInsertionPointInserter || ( ! isHidden && showInsertionPoint );
+
/* eslint-disable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */
// While ideally it would be enough to capture the
// bubbling focus event from the Inserter, due to the
@@ -224,13 +236,10 @@ function InsertionPointPopover( {
className={ className }
style={ style }
>
- { ! isHidden &&
- ( showInsertionPoint ||
- isInserterShown ||
- isInserterForced ) && (
-
- ) }
- { ! isHidden && ( isInserterShown || isInserterForced ) && (
+ { showInsertionPointIndicator && (
+
+ ) }
+ { showInsertionPointInserter && (
{
describe( 'and a template part is clicked in the template', () => {
it( "should display the selected template part's name in the document header", async () => {
- // Click on a template part in the template
- const header = await canvas().$( '.site-header' );
- await header.click();
+ // Select the header template part via list view.
+ await page.click( 'button[aria-label="List View"]' );
+ const headerTemplatePartListViewButton = await page.waitForXPath(
+ '//button[contains(@class, "block-editor-block-navigation-block-select-button")][contains(., "Header")]'
+ );
+ headerTemplatePartListViewButton.click();
+ await page.click(
+ 'button[aria-label="Close list view sidebar"]'
+ );
// Evaluate the document settings secondary title
const actual = await getDocumentSettingsSecondaryTitle();
diff --git a/packages/e2e-tests/specs/experiments/multi-entity-saving.test.js b/packages/e2e-tests/specs/experiments/multi-entity-saving.test.js
index c0c035ccd0894d..65e94a80711d7c 100644
--- a/packages/e2e-tests/specs/experiments/multi-entity-saving.test.js
+++ b/packages/e2e-tests/specs/experiments/multi-entity-saving.test.js
@@ -7,7 +7,6 @@ import {
publishPost,
trashAllPosts,
activateTheme,
- canvas,
} from '@wordpress/e2e-test-utils';
/**
@@ -189,9 +188,13 @@ describe( 'Multi-entity save flow', () => {
await navigationPanel.clickItemByText( 'Index' );
await navigationPanel.close();
- // Click the first block so that the template part inserts in the right place.
- const firstBlock = await canvas().$( '.wp-block' );
- await firstBlock.click();
+ // Select the header template part via list view.
+ await page.click( 'button[aria-label="List View"]' );
+ const headerTemplatePartListViewButton = await page.waitForXPath(
+ '//button[contains(@class, "block-editor-block-navigation-block-select-button")][contains(., "Header")]'
+ );
+ headerTemplatePartListViewButton.click();
+ await page.click( 'button[aria-label="Close list view sidebar"]' );
// Insert something to dirty the editor.
await insertBlock( 'Paragraph' );