From a384c032d497aec9727260fbe5b1737d45bcb5bb Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Mon, 22 Jan 2024 18:35:21 +0400
Subject: [PATCH 1/8] Migrate remaining 'inserting blocks' e2e tests to
 Playwright

---
 .../editor/various/inserting-blocks.spec.js   | 314 ++++++++++++++++++
 1 file changed, 314 insertions(+)

diff --git a/test/e2e/specs/editor/various/inserting-blocks.spec.js b/test/e2e/specs/editor/various/inserting-blocks.spec.js
index a000f02eaca8c2..a1337db0d500d9 100644
--- a/test/e2e/specs/editor/various/inserting-blocks.spec.js
+++ b/test/e2e/specs/editor/various/inserting-blocks.spec.js
@@ -386,6 +386,320 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => {
 
 		await expect( blockLibrary ).toBeHidden();
 	} );
+
+	test( 'should insert block with the slash inserter when using multiple words', async ( {
+		admin,
+		editor,
+		page,
+	} ) => {
+		await admin.createNewPost();
+		await page.keyboard.press( 'Enter' );
+		await page.keyboard.type( '/tag cloud' );
+
+		await expect(
+			page.getByRole( 'option', { name: 'Tag Cloud', selected: true } )
+		).toBeVisible();
+		await page.keyboard.press( 'Enter' );
+
+		await expect(
+			editor.canvas.getByRole( 'document', { name: 'Block: Tag Cloud' } )
+		).toBeVisible();
+	} );
+
+	// Check for regression of https://github.com/WordPress/gutenberg/issues/23263
+	test( 'inserts blocks at root level when using the root appender while selection is in an inner block', async ( {
+		admin,
+		editor,
+		page,
+	} ) => {
+		await admin.createNewPost();
+		await editor.insertBlock( { name: 'core/buttons' } );
+
+		// After inserting the Buttons block the inner button block should be selected.
+		await expect(
+			editor.canvas.getByRole( 'textbox', { name: 'Button text' } )
+		).toBeFocused();
+		await page.keyboard.type( '1.1' );
+
+		// The block appender is only visible when there's no selection.
+		await page.evaluate( () =>
+			window.wp.data.dispatch( 'core/block-editor' ).clearSelectedBlock()
+		);
+
+		// Insert a new block using the root appender.
+		await editor.canvas
+			.getByRole( 'button', { name: 'Add block' } )
+			.click();
+		await page
+			.getByRole( 'searchbox', {
+				name: 'Search for blocks and patterns',
+			} )
+			.fill( 'Paragraph' );
+		await page.getByRole( 'option', { name: 'Paragraph' } ).click();
+		await page.keyboard.type( '2' );
+
+		// Should show a buttons block followed by a paragraph.
+		await expect
+			.poll( editor.getBlocks )
+			.toMatchObject( [
+				{ name: 'core/buttons' },
+				{ name: 'core/paragraph' },
+			] );
+	} );
+
+	// // Check for regression of https://github.com/WordPress/gutenberg/issues/24262.
+	test( 'inserts a block in proper place after having clicked `Browse All` from inline inserter', async ( {
+		admin,
+		editor,
+		page,
+	} ) => {
+		await admin.createNewPost();
+		await page.keyboard.press( 'Enter' );
+		await page.keyboard.type( 'First paragraph' );
+		await page.keyboard.press( 'Enter' );
+		await page.keyboard.type( '## Heading' );
+		await page.keyboard.press( 'Enter' );
+		await page.keyboard.type( 'Second paragraph' );
+		await page.keyboard.press( 'Enter' );
+		await page.keyboard.type( 'Third paragraph' );
+
+		const boundingBox = await editor.canvas
+			.getByRole( 'document', { name: 'Block: Heading' } )
+			.boundingBox();
+
+		// Using the between inserter.
+		await page.mouse.move(
+			boundingBox.x + boundingBox.width / 2,
+			boundingBox.y - 10,
+			{ steps: 10 }
+		);
+
+		await page
+			.getByRole( 'button', {
+				name: 'Add block',
+			} )
+			.click();
+		await page.getByRole( 'button', { name: 'Browse All' } ).click();
+		await page
+			.getByRole( 'listbox', { name: 'Media' } )
+			.getByRole( 'option', { name: 'Image' } )
+			.click();
+
+		await expect
+			.poll( editor.getBlocks )
+			.toMatchObject( [
+				{ name: 'core/paragraph' },
+				{ name: 'core/image' },
+				{ name: 'core/heading' },
+				{ name: 'core/paragraph' },
+				{ name: 'core/paragraph' },
+			] );
+	} );
+
+	// Check for regression of https://github.com/WordPress/gutenberg/issues/25785.
+	test( 'inserts a block should show a blue line indicator', async ( {
+		admin,
+		editor,
+		page,
+		insertingBlocksUtils,
+	} ) => {
+		await admin.createNewPost();
+		await page.keyboard.press( 'Enter' );
+		await page.keyboard.type( 'First paragraph' );
+		await editor.insertBlock( { name: 'core/image' } );
+
+		const paragraphBlock = editor.canvas.getByRole( 'document', {
+			name: 'Block: Paragraph',
+		} );
+
+		await editor.selectBlocks( paragraphBlock );
+		await page
+			.getByRole( 'toolbar', { name: 'Document tools' } )
+			.getByRole( 'button', { name: 'Toggle block inserter' } )
+			.click();
+		await page
+			.getByRole( 'listbox', { name: 'Text' } )
+			.getByRole( 'option', { name: 'Heading' } )
+			.hover();
+
+		await expect( insertingBlocksUtils.indicator ).toBeVisible();
+
+		const paragraphBoundingBox = await paragraphBlock.boundingBox();
+		const indicatorBoundingBox =
+			await insertingBlocksUtils.indicator.boundingBox();
+
+		// Expect the indicator to be below the selected block.
+		expect( indicatorBoundingBox.y ).toBeGreaterThan(
+			paragraphBoundingBox.y
+		);
+	} );
+
+	// Check for regression of https://github.com/WordPress/gutenberg/issues/24403.
+	test( 'inserts a block in proper place after having clicked `Browse All` from block appender', async ( {
+		admin,
+		editor,
+		page,
+	} ) => {
+		await admin.createNewPost();
+		await editor.insertBlock( { name: 'core/group' } );
+		await editor.insertBlock( {
+			name: 'core/paragraph',
+			attributes: { content: 'Paragraph after group' },
+		} );
+
+		await editor.canvas
+			.getByRole( 'button', {
+				name: 'Group: Gather blocks in a container.',
+			} )
+			.click();
+		await editor.canvas
+			.getByRole( 'button', {
+				name: 'Add block',
+			} )
+			.click();
+		await page.getByRole( 'button', { name: 'Browse All' } ).click();
+		await page
+			.getByRole( 'listbox', { name: 'Text' } )
+			.getByRole( 'option', { name: 'Paragraph' } )
+			.click();
+		await editor.canvas
+			.getByRole( 'document', { name: 'Empty block' } )
+			.fill( 'Paragraph inside group' );
+
+		await expect.poll( editor.getBlocks ).toMatchObject( [
+			{
+				name: 'core/group',
+				innerBlocks: [
+					{
+						name: 'core/paragraph',
+						attributes: { content: 'Paragraph inside group' },
+					},
+				],
+			},
+			{
+				name: 'core/paragraph',
+				attributes: { content: 'Paragraph after group' },
+			},
+		] );
+	} );
+
+	test( 'passes the search value in the main inserter when clicking `Browse all`', async ( {
+		admin,
+		editor,
+		page,
+	} ) => {
+		await admin.createNewPost();
+		await editor.insertBlock( { name: 'core/group' } );
+		await editor.insertBlock( {
+			name: 'core/paragraph',
+			attributes: { content: 'Paragraph after group' },
+		} );
+
+		await editor.canvas
+			.getByRole( 'button', {
+				name: 'Group: Gather blocks in a container.',
+			} )
+			.click();
+		await editor.canvas
+			.getByRole( 'button', {
+				name: 'Add block',
+			} )
+			.click();
+
+		const searchBox = page.getByRole( 'searchbox', {
+			name: 'Search for blocks and patterns',
+		} );
+
+		await searchBox.fill( 'Verse' );
+		await page.getByRole( 'button', { name: 'Browse All' } ).click();
+
+		await expect( searchBox ).toHaveValue( 'Verse' );
+		await expect(
+			page.getByRole( 'listbox', { name: 'Blocks' } )
+		).toHaveCount( 1 );
+	} );
+
+	// Check for regression of https://github.com/WordPress/gutenberg/issues/27586.
+	test( 'can close the main inserter after inserting a single-use block, like the More block', async ( {
+		admin,
+		editor,
+		page,
+	} ) => {
+		await admin.createNewPost();
+		await page
+			.getByRole( 'toolbar', { name: 'Document tools' } )
+			.getByRole( 'button', { name: 'Toggle block inserter' } )
+			.click();
+		await page.getByRole( 'option', { name: 'More', exact: true } ).click();
+
+		// Moving focus to the More block should close the inserter.
+		await editor.canvas
+			.getByRole( 'textbox', { name: 'Read more' } )
+			.fill( 'More' );
+		await expect(
+			page.getByRole( 'region', {
+				name: 'Block Library',
+			} )
+		).toBeHidden();
+	} );
+
+	test( 'shows block preview when hovering over block in inserter', async ( {
+		admin,
+		page,
+	} ) => {
+		await admin.createNewPost();
+		await page
+			.getByRole( 'toolbar', { name: 'Document tools' } )
+			.getByRole( 'button', { name: 'Toggle block inserter' } )
+			.click();
+		await page
+			.getByRole( 'listbox', { name: 'Text' } )
+			.getByRole( 'option', { name: 'Paragraph' } )
+			.hover();
+
+		await expect(
+			page.locator( '.block-editor-inserter__preview' )
+		).toBeInViewport();
+	} );
+
+	[ 'large', 'small' ].forEach( ( viewport ) => {
+		test( `last-inserted block should be given and keep the selection (${ viewport } viewport)`, async ( {
+			admin,
+			editor,
+			page,
+			pageUtils,
+		} ) => {
+			await pageUtils.setBrowserViewport( viewport );
+			await admin.createNewPost();
+			await editor.insertBlock( {
+				name: 'core/paragraph',
+				attributes: { content: 'Testing inserted block selection' },
+			} );
+
+			await page
+				.getByRole( 'toolbar', { name: 'Document tools' } )
+				.getByRole( 'button', { name: 'Toggle block inserter' } )
+				.click();
+			await page
+				.getByRole( 'listbox', { name: 'Media' } )
+				.getByRole( 'option', { name: 'Image' } )
+				.click();
+
+			await expect(
+				editor.canvas.getByRole( 'document', { name: 'Block: Image' } )
+			).toBeVisible();
+			await expect
+				.poll( () =>
+					page.evaluate(
+						() =>
+							window.wp.data
+								.select( 'core/block-editor' )
+								.getSelectedBlock()?.name
+					)
+				)
+				.toBe( 'core/image' );
+		} );
+	} );
 } );
 
 test.describe( 'insert media from inserter', () => {

From a4ed789e8a9b72638fce4ef62f89fa274ea8774d Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Tue, 23 Jan 2024 13:10:32 +0400
Subject: [PATCH 2/8] Remove migrated tests

---
 .../inserting-blocks.test.js.snap             |  64 -----
 .../editor/various/inserting-blocks.test.js   | 256 ------------------
 2 files changed, 320 deletions(-)

diff --git a/packages/e2e-tests/specs/editor/various/__snapshots__/inserting-blocks.test.js.snap b/packages/e2e-tests/specs/editor/various/__snapshots__/inserting-blocks.test.js.snap
index fa3400670a602d..143d529c0c19cb 100644
--- a/packages/e2e-tests/specs/editor/various/__snapshots__/inserting-blocks.test.js.snap
+++ b/packages/e2e-tests/specs/editor/various/__snapshots__/inserting-blocks.test.js.snap
@@ -52,67 +52,3 @@ Foo</pre>
 lines preserved[/myshortcode]
 <!-- /wp:shortcode -->"
 `;
-
-exports[`Inserting blocks inserts a block in proper place after having clicked \`Browse All\` from block appender 1`] = `
-"<!-- wp:group {"layout":{"type":"constrained"}} -->
-<div class="wp-block-group"><!-- wp:paragraph -->
-<p>Paragraph inside group</p>
-<!-- /wp:paragraph --></div>
-<!-- /wp:group -->
-
-<!-- wp:paragraph -->
-<p>Paragraph after group</p>
-<!-- /wp:paragraph -->"
-`;
-
-exports[`Inserting blocks inserts a block in proper place after having clicked \`Browse All\` from inline inserter 1`] = `
-"<!-- wp:paragraph -->
-<p>First paragraph</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:heading -->
-<h2 class="wp-block-heading">Heading</h2>
-<!-- /wp:heading -->
-
-<!-- wp:paragraph -->
-<p>Second paragraph</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:paragraph -->
-<p>Third paragraph</p>
-<!-- /wp:paragraph -->"
-`;
-
-exports[`Inserting blocks inserts a block in proper place after having clicked \`Browse All\` from inline inserter 2`] = `
-"<!-- wp:paragraph -->
-<p>First paragraph</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:cover {"layout":{"type":"constrained"}} -->
-<div class="wp-block-cover"><span aria-hidden="true" class="wp-block-cover__background has-background-dim-100 has-background-dim"></span><div class="wp-block-cover__inner-container"></div></div>
-<!-- /wp:cover -->
-
-<!-- wp:heading -->
-<h2 class="wp-block-heading">Heading</h2>
-<!-- /wp:heading -->
-
-<!-- wp:paragraph -->
-<p>Second paragraph</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:paragraph -->
-<p>Third paragraph</p>
-<!-- /wp:paragraph -->"
-`;
-
-exports[`Inserting blocks inserts blocks at root level when using the root appender while selection is in an inner block 1`] = `
-"<!-- wp:buttons -->
-<div class="wp-block-buttons"><!-- wp:button -->
-<div class="wp-block-button"><a class="wp-block-button__link wp-element-button">1.1</a></div>
-<!-- /wp:button --></div>
-<!-- /wp:buttons -->
-
-<!-- wp:paragraph -->
-<p>2</p>
-<!-- /wp:paragraph -->"
-`;
diff --git a/packages/e2e-tests/specs/editor/various/inserting-blocks.test.js b/packages/e2e-tests/specs/editor/various/inserting-blocks.test.js
index 13e19a154e0f2b..b1b7bf9fa52a83 100644
--- a/packages/e2e-tests/specs/editor/various/inserting-blocks.test.js
+++ b/packages/e2e-tests/specs/editor/various/inserting-blocks.test.js
@@ -6,39 +6,12 @@ import {
 	createNewPost,
 	getEditedPostContent,
 	insertBlock,
-	openGlobalBlockInserter,
 	pressKeyTimes,
-	searchForBlock,
 	setBrowserViewport,
-	pressKeyWithModifier,
-	canvas,
 } from '@wordpress/e2e-test-utils';
 
 /** @typedef {import('puppeteer-core').ElementHandle} ElementHandle */
 
-/**
- * Waits for all patterns in the inserter to have a height, which should
- * indicate they've been parsed and are visible.
- *
- * This allows a test to wait for the layout in the inserter menu to stabilize
- * before attempting to interact with the menu contents.
- */
-async function waitForInserterPatternLoad() {
-	await page.waitForFunction( () => {
-		const previewElements = document.querySelectorAll(
-			'.block-editor-block-preview__container'
-		);
-
-		if ( ! previewElements.length ) {
-			return true;
-		}
-
-		return Array.from( previewElements ).every(
-			( previewElement ) => previewElement.offsetHeight > 0
-		);
-	} );
-}
-
 describe( 'Inserting blocks', () => {
 	beforeEach( async () => {
 		await createNewPost();
@@ -156,233 +129,4 @@ describe( 'Inserting blocks', () => {
 
 		expect( await getEditedPostContent() ).toMatchSnapshot();
 	} );
-
-	it( 'should insert block with the slash inserter when using multiple words', async () => {
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( '/tag cloud' );
-		await page.waitForXPath(
-			`//*[contains(@class, "components-autocomplete__result") and contains(@class, "is-selected") and contains(text(), 'Tag Cloud')]`
-		);
-		await page.keyboard.press( 'Enter' );
-
-		expect(
-			await canvas().waitForSelector( '[data-type="core/tag-cloud"]' )
-		).not.toBeNull();
-	} );
-
-	// Check for regression of https://github.com/WordPress/gutenberg/issues/23263
-	it( 'inserts blocks at root level when using the root appender while selection is in an inner block', async () => {
-		await insertBlock( 'Buttons' );
-		await page.keyboard.type( '1.1' );
-
-		// After inserting the Buttons block the inner button block should be selected.
-		const selectedButtonBlocks = await canvas().$$(
-			'.wp-block-button.is-selected'
-		);
-		expect( selectedButtonBlocks.length ).toBe( 1 );
-
-		// The block appender is only visible when there's no selection.
-		await page.evaluate( () =>
-			window.wp.data.dispatch( 'core/block-editor' ).clearSelectedBlock()
-		);
-		// Specifically click the root container appender.
-		await canvas().click(
-			'.block-editor-block-list__layout.is-root-container > .block-list-appender .block-editor-inserter__toggle'
-		);
-
-		// Insert a paragraph block.
-		await page.waitForSelector( '.block-editor-inserter__search input' );
-
-		// Search for the paragraph block if it's not in the list of blocks shown.
-		if ( ! page.$( '.editor-block-list-item-paragraph' ) ) {
-			await page.keyboard.type( 'Paragraph' );
-			await page.waitForSelector( '.editor-block-list-item-paragraph' );
-			await waitForInserterPatternLoad();
-		}
-
-		// Add the block.
-		await page.click( '.editor-block-list-item-paragraph' );
-		await page.keyboard.type( '2' );
-
-		// The snapshot should show a buttons block followed by a paragraph.
-		// The buttons block should contain a single button.
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	// Check for regression of https://github.com/WordPress/gutenberg/issues/24262
-	it( 'inserts a block in proper place after having clicked `Browse All` from inline inserter', async () => {
-		await insertBlock( 'Paragraph' );
-		await page.keyboard.type( 'First paragraph' );
-		await insertBlock( 'Heading' );
-		await page.keyboard.type( 'Heading' );
-		await page.keyboard.press( 'Enter' );
-		await insertBlock( 'Paragraph' );
-		await page.keyboard.type( 'Second paragraph' );
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( 'Third paragraph' );
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-
-		// Using the between inserter.
-		const insertionPoint = await canvas().$( '[data-type="core/heading"]' );
-		const rect = await insertionPoint.boundingBox();
-		await page.mouse.move( rect.x + rect.width / 2, rect.y - 10, {
-			steps: 10,
-		} );
-		const insertionLine = await page.waitForSelector(
-			'.block-editor-block-list__insertion-point .block-editor-inserter__toggle'
-		);
-		await insertionLine.click();
-		const browseAll = await page.waitForSelector(
-			'button.block-editor-inserter__quick-inserter-expand'
-		);
-		await browseAll.click();
-		// `insertBlock` uses the currently open panel.
-		await insertBlock( 'Cover' );
-
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	// Check for regression of https://github.com/WordPress/gutenberg/issues/25785
-	it( 'inserts a block should show a blue line indicator', async () => {
-		// First insert a random Paragraph.
-		await insertBlock( 'Paragraph' );
-		await page.keyboard.type( 'First paragraph' );
-		await insertBlock( 'Image' );
-		const paragraphBlock = await canvas().$(
-			'p[aria-label="Block: Paragraph"]'
-		);
-		paragraphBlock.click();
-		await page.evaluate( () => new Promise( window.requestIdleCallback ) );
-
-		// Open the global inserter and search for the Heading block.
-		await searchForBlock( 'Heading' );
-
-		const headingButton = (
-			await page.$x( `//button//span[contains(text(), 'Heading')]` )
-		)[ 0 ];
-		// Hover over the block should show the blue line indicator.
-		await headingButton.hover();
-
-		// Should show the blue line indicator somewhere.
-		const indicator = await page.waitForSelector(
-			'.block-editor-block-list__insertion-point-indicator'
-		);
-		const indicatorRect = await indicator.boundingBox();
-		const paragraphRect = await paragraphBlock.boundingBox();
-
-		// The blue line indicator should be below the last block.
-		expect( indicatorRect.x ).toBe( paragraphRect.x );
-		expect( indicatorRect.y > paragraphRect.y ).toBe( true );
-	} );
-
-	// Check for regression of https://github.com/WordPress/gutenberg/issues/24403
-	it( 'inserts a block in proper place after having clicked `Browse All` from block appender', async () => {
-		await insertBlock( 'Group' );
-		// Select the default, selected Group layout from the variation picker.
-		await canvas().click(
-			'button[aria-label="Group: Gather blocks in a container."]'
-		);
-		await insertBlock( 'Paragraph' );
-		await page.keyboard.type( 'Paragraph after group' );
-		// Click the Group first to make the appender inside it clickable.
-		await canvas().click( '[data-type="core/group"]' );
-		await canvas().click(
-			'[data-type="core/group"] [aria-label="Add block"]'
-		);
-		const browseAll = await page.waitForXPath(
-			'//button[text()="Browse all"]'
-		);
-		await browseAll.click();
-		await insertBlock( 'Paragraph' );
-		await page.keyboard.type( 'Paragraph inside group' );
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	it( 'passes the search value in the main inserter when clicking `Browse all`', async () => {
-		const INSERTER_SEARCH_SELECTOR =
-			'.block-editor-inserter__search input,.block-editor-inserter__search-input,input.block-editor-inserter__search';
-		await insertBlock( 'Group' );
-		// Select the default, selected Group layout from the variation picker.
-		await canvas().click(
-			'button[aria-label="Group: Gather blocks in a container."]'
-		);
-		await insertBlock( 'Paragraph' );
-		await page.keyboard.type( 'Text' );
-		// Click the Group first to make the appender inside it clickable.
-		await canvas().click( '[data-type="core/group"]' );
-		await canvas().click(
-			'[data-type="core/group"] [aria-label="Add block"]'
-		);
-		await page.waitForSelector( INSERTER_SEARCH_SELECTOR );
-		await page.focus( INSERTER_SEARCH_SELECTOR );
-		await pressKeyWithModifier( 'primary', 'a' );
-		const searchTerm = 'Verse';
-		await page.keyboard.type( searchTerm );
-		const browseAll = await page.waitForXPath(
-			'//button[text()="Browse all"]'
-		);
-		await browseAll.click();
-		const availableBlocks = await page.$$(
-			'.editor-inserter-sidebar .block-editor-block-types-list__list-item'
-		);
-		expect( availableBlocks ).toHaveLength( 1 );
-	} );
-
-	// Check for regression of https://github.com/WordPress/gutenberg/issues/27586
-	it( 'closes the main inserter after inserting a single-use block, like the More block', async () => {
-		await insertBlock( 'More' );
-		await page.waitForSelector(
-			'.editor-document-tools__inserter-toggle:not(.is-pressed)'
-		);
-
-		// The inserter panel should've closed.
-		const inserterPanels = await page.$$( '.editor-inserter-sidebar' );
-		expect( inserterPanels.length ).toBe( 0 );
-
-		// The editable 'Read More' text should be focused.
-		const isFocusInBlock = await canvas().evaluate( () =>
-			document
-				.querySelector( '[data-type="core/more"]' )
-				.contains( document.activeElement )
-		);
-		expect( isFocusInBlock ).toBe( true );
-	} );
-
-	it( 'shows block preview when hovering over block in inserter', async () => {
-		await openGlobalBlockInserter();
-		const paragraphButton = (
-			await page.$x( `//button//span[contains(text(), 'Paragraph')]` )
-		)[ 0 ];
-		await paragraphButton.hover();
-		const preview = await page.waitForSelector(
-			'.block-editor-inserter__preview',
-			{
-				visible: true,
-			}
-		);
-		const isPreviewVisible = await preview.isIntersectingViewport();
-		expect( isPreviewVisible ).toBe( true );
-	} );
-
-	it.each( [ 'large', 'small' ] )(
-		'last-inserted block should be given and keep the focus (%s viewport)',
-		async ( viewport ) => {
-			await setBrowserViewport( viewport );
-
-			await canvas().type(
-				'.block-editor-default-block-appender__content',
-				'Testing inserted block focus'
-			);
-
-			await insertBlock( 'Image' );
-
-			await canvas().waitForSelector( 'figure[data-type="core/image"]' );
-
-			const selectedBlock = await page.evaluate( () => {
-				return wp.data.select( 'core/block-editor' ).getSelectedBlock();
-			} );
-
-			expect( selectedBlock.name ).toBe( 'core/image' );
-		}
-	);
 } );

From 970e821dd2d6cd55a9c64af7508deb7c62d082a1 Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Tue, 23 Jan 2024 14:06:16 +0400
Subject: [PATCH 3/8] Restore viewport

---
 test/e2e/specs/editor/various/inserting-blocks.spec.js | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/test/e2e/specs/editor/various/inserting-blocks.spec.js b/test/e2e/specs/editor/various/inserting-blocks.spec.js
index a1337db0d500d9..65f75f594c024a 100644
--- a/test/e2e/specs/editor/various/inserting-blocks.spec.js
+++ b/test/e2e/specs/editor/various/inserting-blocks.spec.js
@@ -698,6 +698,9 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => {
 					)
 				)
 				.toBe( 'core/image' );
+
+			// Restore the viewport.
+			await pageUtils.setBrowserViewport( 'large' );
 		} );
 	} );
 } );

From 63bc00affb3c4e723b18e0db42b78da7b56bf16e Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Tue, 23 Jan 2024 15:41:14 +0400
Subject: [PATCH 4/8] Fix failing e2e test

---
 .../e2e/specs/editor/various/keyboard-navigable-blocks.spec.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/test/e2e/specs/editor/various/keyboard-navigable-blocks.spec.js b/test/e2e/specs/editor/various/keyboard-navigable-blocks.spec.js
index 84536c88227ce9..51b08359d12698 100644
--- a/test/e2e/specs/editor/various/keyboard-navigable-blocks.spec.js
+++ b/test/e2e/specs/editor/various/keyboard-navigable-blocks.spec.js
@@ -12,8 +12,9 @@ test.use( {
 } );
 
 test.describe( 'Order of block keyboard navigation', () => {
-	test.beforeEach( async ( { admin } ) => {
+	test.beforeEach( async ( { admin, editor } ) => {
 		await admin.createNewPost();
+		await editor.openDocumentSettingsSidebar();
 	} );
 
 	test( 'permits tabbing through paragraph blocks in the expected order', async ( {

From 0c68f692149d5dbc82fa98be8d8b063e0923eb67 Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Wed, 24 Jan 2024 11:27:23 +0400
Subject: [PATCH 5/8] Remove test

---
 .../editor/various/inserting-blocks.spec.js   | 41 -------------------
 1 file changed, 41 deletions(-)

diff --git a/test/e2e/specs/editor/various/inserting-blocks.spec.js b/test/e2e/specs/editor/various/inserting-blocks.spec.js
index 65f75f594c024a..17205b997ce4a9 100644
--- a/test/e2e/specs/editor/various/inserting-blocks.spec.js
+++ b/test/e2e/specs/editor/various/inserting-blocks.spec.js
@@ -406,47 +406,6 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => {
 		).toBeVisible();
 	} );
 
-	// Check for regression of https://github.com/WordPress/gutenberg/issues/23263
-	test( 'inserts blocks at root level when using the root appender while selection is in an inner block', async ( {
-		admin,
-		editor,
-		page,
-	} ) => {
-		await admin.createNewPost();
-		await editor.insertBlock( { name: 'core/buttons' } );
-
-		// After inserting the Buttons block the inner button block should be selected.
-		await expect(
-			editor.canvas.getByRole( 'textbox', { name: 'Button text' } )
-		).toBeFocused();
-		await page.keyboard.type( '1.1' );
-
-		// The block appender is only visible when there's no selection.
-		await page.evaluate( () =>
-			window.wp.data.dispatch( 'core/block-editor' ).clearSelectedBlock()
-		);
-
-		// Insert a new block using the root appender.
-		await editor.canvas
-			.getByRole( 'button', { name: 'Add block' } )
-			.click();
-		await page
-			.getByRole( 'searchbox', {
-				name: 'Search for blocks and patterns',
-			} )
-			.fill( 'Paragraph' );
-		await page.getByRole( 'option', { name: 'Paragraph' } ).click();
-		await page.keyboard.type( '2' );
-
-		// Should show a buttons block followed by a paragraph.
-		await expect
-			.poll( editor.getBlocks )
-			.toMatchObject( [
-				{ name: 'core/buttons' },
-				{ name: 'core/paragraph' },
-			] );
-	} );
-
 	// // Check for regression of https://github.com/WordPress/gutenberg/issues/24262.
 	test( 'inserts a block in proper place after having clicked `Browse All` from inline inserter', async ( {
 		admin,

From 1f320e1fe6ffd702dd8d6e9d7d988eb281db5f35 Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Thu, 25 Jan 2024 11:34:02 +0400
Subject: [PATCH 6/8] Add explanation for steps

---
 test/e2e/specs/editor/various/inserting-blocks.spec.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/test/e2e/specs/editor/various/inserting-blocks.spec.js b/test/e2e/specs/editor/various/inserting-blocks.spec.js
index 17205b997ce4a9..dc89f56f6908f1 100644
--- a/test/e2e/specs/editor/various/inserting-blocks.spec.js
+++ b/test/e2e/specs/editor/various/inserting-blocks.spec.js
@@ -430,6 +430,8 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => {
 		await page.mouse.move(
 			boundingBox.x + boundingBox.width / 2,
 			boundingBox.y - 10,
+			// An arbitrary number of `steps` imitates cursor movement in the test environment,
+			// activating the in-between inserter.
 			{ steps: 10 }
 		);
 

From 42bf6e6880bab97af5578c2bfcdf59cc9a3ef570 Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Thu, 25 Jan 2024 13:41:22 +0400
Subject: [PATCH 7/8] Remove old test files

---
 .../inserting-blocks.test.js.snap             |  54 -------
 .../editor/various/inserting-blocks.test.js   | 132 ------------------
 2 files changed, 186 deletions(-)
 delete mode 100644 packages/e2e-tests/specs/editor/various/__snapshots__/inserting-blocks.test.js.snap
 delete mode 100644 packages/e2e-tests/specs/editor/various/inserting-blocks.test.js

diff --git a/packages/e2e-tests/specs/editor/various/__snapshots__/inserting-blocks.test.js.snap b/packages/e2e-tests/specs/editor/various/__snapshots__/inserting-blocks.test.js.snap
deleted file mode 100644
index 143d529c0c19cb..00000000000000
--- a/packages/e2e-tests/specs/editor/various/__snapshots__/inserting-blocks.test.js.snap
+++ /dev/null
@@ -1,54 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Inserting blocks Should insert content using the placeholder and the regular inserter 1`] = `
-"<!-- wp:paragraph -->
-<p>Paragraph block</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:quote -->
-<blockquote class=\\"wp-block-quote\\"><p>Quote block</p></blockquote>
-<!-- /wp:quote -->
-
-<!-- wp:image -->
-<figure class=\\"wp-block-image\\"><img alt=\\"\\"/></figure>
-<!-- /wp:image -->
-
-<!-- wp:paragraph -->
-<p></p>
-<!-- /wp:paragraph -->"
-`;
-
-exports[`Inserting blocks Should insert content using the placeholder and the regular inserter 2`] = `
-"<!-- wp:paragraph -->
-<p>Paragraph block</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:quote -->
-<blockquote class=\\"wp-block-quote\\"><p>Quote block</p></blockquote>
-<!-- /wp:quote -->"
-`;
-
-exports[`Inserting blocks Should insert content using the placeholder and the regular inserter 3`] = `
-"<!-- wp:paragraph -->
-<p>Paragraph block</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:paragraph -->
-<p>Second paragraph</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:quote -->
-<blockquote class=\\"wp-block-quote\\"><p>Quote block</p></blockquote>
-<!-- /wp:quote -->
-
-<!-- wp:preformatted -->
-<pre class=\\"wp-block-preformatted\\">Pre text
-
-Foo</pre>
-<!-- /wp:preformatted -->
-
-<!-- wp:shortcode -->
-[myshortcode]With multiple
-lines preserved[/myshortcode]
-<!-- /wp:shortcode -->"
-`;
diff --git a/packages/e2e-tests/specs/editor/various/inserting-blocks.test.js b/packages/e2e-tests/specs/editor/various/inserting-blocks.test.js
deleted file mode 100644
index b1b7bf9fa52a83..00000000000000
--- a/packages/e2e-tests/specs/editor/various/inserting-blocks.test.js
+++ /dev/null
@@ -1,132 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	closeGlobalBlockInserter,
-	createNewPost,
-	getEditedPostContent,
-	insertBlock,
-	pressKeyTimes,
-	setBrowserViewport,
-} from '@wordpress/e2e-test-utils';
-
-/** @typedef {import('puppeteer-core').ElementHandle} ElementHandle */
-
-describe( 'Inserting blocks', () => {
-	beforeEach( async () => {
-		await createNewPost();
-	} );
-
-	/**
-	 * Given a Puppeteer ElementHandle, clicks below its bounding box.
-	 *
-	 * @param {ElementHandle} elementHandle Element handle.
-	 *
-	 * @return {Promise} Promise resolving when click occurs.
-	 */
-	async function clickAtBottom( elementHandle ) {
-		const box = await elementHandle.boundingBox();
-		const x = box.x + box.width / 2;
-		const y = box.y + box.height - 50;
-		return page.mouse.click( x, y );
-	}
-
-	it.skip( 'Should insert content using the placeholder and the regular inserter', async () => {
-		// This ensures the editor is loaded in navigation mode.
-		await page.reload();
-		await page.waitForSelector( '.edit-post-layout' );
-
-		// Set a tall viewport. The typewriter's intrinsic height can be enough
-		// to scroll the page on a shorter viewport, thus obscuring the presence
-		// of any potential buggy behavior with the "stretched" click redirect.
-		await setBrowserViewport( { width: 960, height: 1400 } );
-
-		// Click below editor to focus last field (block appender)
-		await clickAtBottom(
-			await page.$( '.interface-interface-skeleton__content' )
-		);
-		expect(
-			await page.waitForSelector( '[data-type="core/paragraph"]' )
-		).not.toBeNull();
-		await page.keyboard.type( 'Paragraph block' );
-
-		// Using the slash command.
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( '/quote' );
-		await page.waitForXPath(
-			`//*[contains(@class, "components-autocomplete__result") and contains(@class, "is-selected") and contains(text(), 'Quote')]`
-		);
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( 'Quote block' );
-
-		// Arrow down into default appender.
-		await page.keyboard.press( 'ArrowDown' );
-		await page.keyboard.press( 'ArrowDown' );
-
-		// Focus should be moved to block focus boundary on a block which does
-		// not have its own inputs (e.g. image). Proceeding to press enter will
-		// append the default block. Pressing backspace on the focused block
-		// will remove it.
-		await page.keyboard.type( '/image' );
-		await page.waitForXPath(
-			`//*[contains(@class, "components-autocomplete__result") and contains(@class, "is-selected") and contains(text(), 'Image')]`
-		);
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.press( 'Enter' );
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-		await page.keyboard.press( 'Backspace' );
-		await page.keyboard.press( 'Backspace' );
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-
-		// Using the regular inserter.
-		await insertBlock( 'Preformatted' );
-		await page.keyboard.type( 'Pre block' );
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.press( 'Enter' );
-
-		// Verify vertical traversal at offset. This has been buggy in the past
-		// where verticality on a blank newline would skip into previous block.
-		await page.keyboard.type( 'Foo' );
-		await page.keyboard.press( 'ArrowUp' );
-		await page.keyboard.press( 'ArrowUp' );
-		await pressKeyTimes( 'Delete', 6 );
-		await page.keyboard.type( ' text' );
-
-		// Ensure newline preservation in shortcode block.
-		// See: https://github.com/WordPress/gutenberg/issues/4456
-		await insertBlock( 'Shortcode' );
-		await page.keyboard.type( '[myshortcode]With multiple' );
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( 'lines preserved[/myshortcode]' );
-
-		// Unselect blocks to avoid conflicts with the inbetween inserter
-		await page.click( '.editor-post-title__input' );
-		await closeGlobalBlockInserter();
-
-		// Using the between inserter.
-		const insertionPoint = await page.$( '[data-type="core/quote"]' );
-		const rect = await insertionPoint.boundingBox();
-		await page.mouse.move( rect.x + rect.width / 2, rect.y - 10, {
-			steps: 10,
-		} );
-		const lineInserter = await page.waitForSelector(
-			'.block-editor-block-list__insertion-point .block-editor-inserter__toggle'
-		);
-		await lineInserter.click();
-		// [TODO]: Search input should be focused immediately. It shouldn't be
-		// necessary to have `waitForFunction`.
-		await page.waitForFunction(
-			() =>
-				document.activeElement &&
-				document.activeElement.classList.contains(
-					'components-search-control__input'
-				)
-		);
-		await page.keyboard.type( 'para' );
-		await pressKeyTimes( 'Tab', 2 );
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( 'Second paragraph' );
-
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-} );

From a1f9e6be5b6ba4b5c9822299b3f0cf44f1066fa4 Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Tue, 6 Feb 2024 21:58:47 +0400
Subject: [PATCH 8/8] Fix comment

---
 test/e2e/specs/editor/various/inserting-blocks.spec.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/test/e2e/specs/editor/various/inserting-blocks.spec.js b/test/e2e/specs/editor/various/inserting-blocks.spec.js
index dc89f56f6908f1..a247f482020882 100644
--- a/test/e2e/specs/editor/various/inserting-blocks.spec.js
+++ b/test/e2e/specs/editor/various/inserting-blocks.spec.js
@@ -406,7 +406,7 @@ test.describe( 'Inserting blocks (@firefox, @webkit)', () => {
 		).toBeVisible();
 	} );
 
-	// // Check for regression of https://github.com/WordPress/gutenberg/issues/24262.
+	// Check for regression of https://github.com/WordPress/gutenberg/issues/24262.
 	test( 'inserts a block in proper place after having clicked `Browse All` from inline inserter', async ( {
 		admin,
 		editor,