@wordpress/e2e-tests 7.6.0 → 7.6.1

package/mu-plugins/nocache-headers.php

@@ -0,0 +1,21 @@
+<?php
+/**
+ * Plugin Name: Gutenberg Test Plugin, No-cache Headers
+ * Plugin URI: https://github.com/WordPress/gutenberg
+ * Author: Gutenberg Team
+ *
+ * @package gutenberg-test-nocache-headers
+ */
+
+// Remove 'no-store' from the Cache-Control header set by WordPress when running
+// E2E tests. This is a workaround for an issue where E2E tests time out waiting
+// for 'networkidle'.
+add_filter(
+	'nocache_headers',
+	static function( $headers ) {
+		$cache_control_parts      = explode( ', ', $headers['Cache-Control'] );
+		$cache_control_parts      = array_diff( $cache_control_parts, array( 'no-store' ) );
+		$headers['Cache-Control'] = implode( ', ', $cache_control_parts );
+		return $headers;
+	}
+);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/e2e-tests",
-	"version": "7.6.0",
+	"version": "7.6.1",
 	"description": "End-To-End (E2E) tests for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -23,11 +23,11 @@
 		"node": ">=14"
 	},
 	"dependencies": {
-		"@wordpress/e2e-test-utils": "^10.6.0",
-		"@wordpress/jest-console": "^7.6.0",
-		"@wordpress/jest-puppeteer-axe": "^6.6.0",
-		"@wordpress/scripts": "^26.6.0",
-		"@wordpress/url": "^3.36.0",
+		"@wordpress/e2e-test-utils": "^10.6.1",
+		"@wordpress/jest-console": "^7.6.1",
+		"@wordpress/jest-puppeteer-axe": "^6.6.1",
+		"@wordpress/scripts": "^26.6.1",
+		"@wordpress/url": "^3.36.1",
 		"chalk": "^4.0.0",
 		"expect-puppeteer": "^4.4.0",
 		"filenamify": "^4.2.0",
@@ -45,5 +45,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "a92f606309b1541b834ff9b0a76ed2a466fc45ed"
+	"gitHead": "ce5639111c30763dbdf07f40eeb136ea6030ecf1"
 }

package/plugins/inner-blocks-allowed-blocks/index.js

@@ -1,87 +1,46 @@
 ( function () {
-	const { withSelect } = wp.data;
+	const { useSelect } = wp.data;
 	const { registerBlockType } = wp.blocks;
 	const { createElement: el } = wp.element;
 	const { InnerBlocks } = wp.blockEditor;
-	const __ = wp.i18n.__;
 	const divProps = {
 		className: 'product',
 		style: { outline: '1px solid gray', padding: 5 },
 	};
-	const template = [
-		[ 'core/image' ],
-		[ 'core/paragraph', { placeholder: __( 'Add a description' ) } ],
-		[ 'core/quote' ],
-	];
+
 	const allowedBlocksWhenSingleEmptyChild = [ 'core/image', 'core/list' ];
 	const allowedBlocksWhenMultipleChildren = [ 'core/gallery', 'core/video' ];
 
-	const save = function () {
-		return el( 'div', divProps, el( InnerBlocks.Content ) );
-	};
-	registerBlockType( 'test/allowed-blocks-unset', {
-		title: 'Allowed Blocks Unset',
-		icon: 'carrot',
-		category: 'text',
-
-		edit() {
-			return el( 'div', divProps, el( InnerBlocks, { template } ) );
-		},
-
-		save,
-	} );
-
-	registerBlockType( 'test/allowed-blocks-set', {
-		title: 'Allowed Blocks Set',
-		icon: 'carrot',
-		category: 'text',
-
-		edit() {
-			return el(
-				'div',
-				divProps,
-				el( InnerBlocks, {
-					template,
-					allowedBlocks: [
-						'core/button',
-						'core/gallery',
-						'core/list',
-						'core/media-text',
-						'core/quote',
-					],
-				} )
-			);
-		},
-
-		save,
-	} );
-
 	registerBlockType( 'test/allowed-blocks-dynamic', {
 		title: 'Allowed Blocks Dynamic',
 		icon: 'carrot',
 		category: 'text',
 
-		edit: withSelect( function ( select, ownProps ) {
-			const getBlockOrder = select( 'core/block-editor' ).getBlockOrder;
-			return {
-				numberOfChildren: getBlockOrder( ownProps.clientId ).length,
-			};
-		} )( function ( props ) {
+		edit: function Edit( props ) {
+			const numberOfChildren = useSelect(
+				( select ) => {
+					const { getBlockCount } = select( 'core/block-editor' );
+					return getBlockCount( props.clientId );
+				},
+				[ props.clientId ]
+			);
+
 			return el(
 				'div',
 				{
 					...divProps,
-					'data-number-of-children': props.numberOfChildren,
+					'data-number-of-children': numberOfChildren,
 				},
 				el( InnerBlocks, {
 					allowedBlocks:
-						props.numberOfChildren < 2
+						numberOfChildren < 2
 							? allowedBlocksWhenSingleEmptyChild
 							: allowedBlocksWhenMultipleChildren,
 				} )
 			);
-		} ),
-
-		save,
+		},
+		save() {
+			return el( 'div', divProps, el( InnerBlocks.Content ) );
+		}
 	} );
 } )();

package/plugins/inner-blocks-allowed-blocks.php

@@ -12,7 +12,7 @@
  */
 function enqueue_inner_blocks_allowed_blocks_script() {
 	wp_enqueue_script(
-		'gutenberg-test-block-icons',
+		'gutenberg-test-inner-blocks-allowed-blocks',
 		plugins_url( 'inner-blocks-allowed-blocks/index.js', __FILE__ ),
 		array(
 			'wp-blocks',
@@ -24,5 +24,4 @@ function enqueue_inner_blocks_allowed_blocks_script() {
 		true
 	);
 }
-
-add_action( 'init', 'enqueue_inner_blocks_allowed_blocks_script' );
+add_action( 'enqueue_block_assets', 'enqueue_inner_blocks_allowed_blocks_script' );

package/specs/editor/various/block-editor-keyboard-shortcuts.test.js

@@ -90,7 +90,7 @@ describe( 'block editor keyboard shortcuts', () => {
 		} );
 		it( 'should prevent deleting multiple selected blocks from inputs', async () => {
 			await clickBlockToolbarButton( 'Options' );
-			await clickMenuItem( 'Create Reusable block' );
+			await clickMenuItem( 'Create pattern' );
 			const reusableBlockNameInputSelector =
 				'.reusable-blocks-menu-items__convert-modal .components-text-control__input';
 			const nameInput = await page.waitForSelector(

package/specs/editor/various/links.test.js

@@ -585,7 +585,9 @@ describe( 'Links', () => {
 
 			await editButton.click();
 
-			// Tabbing back should land us in the text input.
+			// Tabbing forward should land us in the "Text" input.
+			await page.keyboard.press( 'Tab' );
+
 			const textInputValue = await page.evaluate(
 				() => document.activeElement.value
 			);
@@ -612,7 +614,9 @@ describe( 'Links', () => {
 			);
 			await editButton.click();
 
-			// Tabbing should land us in the text input.
+			// tab forward to the text input.
+			await page.keyboard.press( 'Tab' );
+
 			const textInputValue = await page.evaluate(
 				() => document.activeElement.value
 			);
@@ -665,7 +669,9 @@ describe( 'Links', () => {
 			await page.waitForXPath( `//label[text()='Open in new tab']` );
 
 			// Move focus back to RichText for the underlying link.
-			await pressKeyTimes( 'Tab', 4 );
+			await pressKeyWithModifier( 'shift', 'Tab' );
+			await pressKeyWithModifier( 'shift', 'Tab' );
+			await pressKeyWithModifier( 'shift', 'Tab' );
 
 			// Make a selection within the RichText.
 			await pressKeyWithModifier( 'shift', 'ArrowRight' );

package/specs/editor/various/reusable-blocks.test.js

@@ -23,6 +23,10 @@ const reusableBlockNameInputSelector =
 	'.reusable-blocks-menu-items__convert-modal .components-text-control__input';
 const reusableBlockInspectorNameInputSelector =
 	'.block-editor-block-inspector .components-text-control__input';
+const syncToggleSelector =
+	'.reusable-blocks-menu-items__convert-modal .components-form-toggle__input';
+const syncToggleSelectorChecked =
+	'.reusable-blocks-menu-items__convert-modal .components-form-toggle.is-checked';
 
 const saveAll = async () => {
 	const publishButtonSelector =
@@ -193,7 +197,7 @@ describe( 'Reusable blocks', () => {
 
 		// Convert block to a reusable block.
 		await clickBlockToolbarButton( 'Options' );
-		await clickMenuItem( 'Create Reusable block' );
+		await clickMenuItem( 'Create pattern' );
 
 		// Set title.
 		const nameInput = await page.waitForSelector(
@@ -201,11 +205,14 @@ describe( 'Reusable blocks', () => {
 		);
 		await nameInput.click();
 		await page.keyboard.type( 'Multi-selection reusable block' );
+		const syncToggle = await page.waitForSelector( syncToggleSelector );
+		syncToggle.click();
+		await page.waitForSelector( syncToggleSelectorChecked );
 		await page.keyboard.press( 'Enter' );
 
 		// Wait for creation to finish.
 		await page.waitForXPath(
-			'//*[contains(@class, "components-snackbar")]/*[text()="Reusable block created."]'
+			'//*[contains(@class, "components-snackbar")]/*[text()="Synced Pattern created."]'
 		);
 
 		await clearAllBlocks();
@@ -259,7 +266,7 @@ describe( 'Reusable blocks', () => {
 		// Save the reusable block.
 		await page.click( publishButtonSelector );
 		await page.waitForXPath(
-			'//*[contains(@class, "components-snackbar")]/*[text()="Reusable block updated."]'
+			'//*[contains(@class, "components-snackbar")]/*[text()="Pattern updated."]'
 		);
 
 		await createNewPost();
@@ -340,12 +347,12 @@ describe( 'Reusable blocks', () => {
 		await canvas().click( 'p[aria-label="Paragraph block"]' );
 		await page.keyboard.type( '2' );
 		const selector =
-			'//div[@aria-label="Block: Reusable block"]//p[@aria-label="Paragraph block"][.="12"]';
+			'//div[@aria-label="Block: Pattern"]//p[@aria-label="Paragraph block"][.="12"]';
 		const reusableBlockWithParagraph = await page.$x( selector );
 		expect( reusableBlockWithParagraph ).toBeTruthy();
 
 		// Convert back to regular blocks.
-		await clickBlockToolbarButton( 'Select Reusable block' );
+		await clickBlockToolbarButton( 'Select Pattern' );
 		await clickBlockToolbarButton( 'Convert to regular block' );
 		await page.waitForXPath( selector, {
 			hidden: true,
@@ -376,15 +383,18 @@ describe( 'Reusable blocks', () => {
 
 		// Convert to reusable.
 		await clickBlockToolbarButton( 'Options' );
-		await clickMenuItem( 'Create Reusable block' );
+		await clickMenuItem( 'Create pattern' );
 		const nameInput = await page.waitForSelector(
 			reusableBlockNameInputSelector
 		);
 		await nameInput.click();
 		await page.keyboard.type( 'Block with styles' );
+		const syncToggle = await page.waitForSelector( syncToggleSelector );
+		syncToggle.click();
+		await page.waitForSelector( syncToggleSelectorChecked );
 		await page.keyboard.press( 'Enter' );
 		const reusableBlock = await canvas().waitForSelector(
-			'.block-editor-block-list__block[aria-label="Block: Reusable block"]'
+			'.block-editor-block-list__block[aria-label="Block: Pattern"]'
 		);
 		expect( reusableBlock ).toBeTruthy();
 	} );

package/specs/editor/various/rich-text.test.js

@@ -25,8 +25,8 @@ describe( 'RichText', () => {
 		//
 		// See: https://github.com/WordPress/gutenberg/issues/3091
 		await insertBlock( 'Heading' );
-		await page.waitForSelector( '[aria-label="Change heading level"]' );
-		await page.click( '[aria-label="Change heading level"]' );
+		await page.waitForSelector( '[aria-label="Change level"]' );
+		await page.click( '[aria-label="Change level"]' );
 		await page.click( '[aria-label="Heading 3"]' );
 
 		expect( await getEditedPostContent() ).toMatchSnapshot();

package/specs/performance/front-end-block-theme.test.js

@@ -16,13 +16,12 @@ describe( 'Front End Performance', () => {
 	};
 
 	beforeAll( async () => {
-		await activateTheme( 'twentytwentythree' );
+		await activateTheme( 'gutenberg-test-themes/twentytwentythree' );
 		await logout();
 	} );
 
 	afterAll( async () => {
 		saveResultsFile( __filename, results );
-		await activateTheme( 'twentytwentyone' );
 	} );
 
 	it( 'Report TTFB, LCP, and LCP-TTFB', async () => {

package/specs/performance/front-end-classic-theme.test.js

@@ -16,7 +16,7 @@ describe( 'Front End Performance', () => {
 	};
 
 	beforeAll( async () => {
-		await activateTheme( 'twentytwentyone' );
+		await activateTheme( 'gutenberg-test-themes/twentytwentyone' );
 		await logout();
 	} );
 

package/specs/performance/post-editor.test.js

@@ -7,6 +7,7 @@ import path from 'path';
  * WordPress dependencies
  */
 import {
+	activateTheme,
 	createNewPost,
 	saveDraft,
 	insertBlock,
@@ -83,6 +84,11 @@ describe( 'Post Editor Performance', () => {
 
 	let traceResults;
 
+	beforeAll( async () => {
+		// See https://github.com/WordPress/gutenberg/pull/50905/files#r1209014677;
+		await activateTheme( 'gutenberg-test-themes/twentytwentyone' );
+	} );
+
 	afterAll( async () => {
 		saveResultsFile( __filename, results );
 		deleteFile( traceFilePath );

package/specs/performance/site-editor.test.js

@@ -87,7 +87,6 @@ describe( 'Site Editor Performance', () => {
 		saveResultsFile( __filename, results );
 		await deleteAllTemplates( 'wp_template' );
 		await deleteAllTemplates( 'wp_template_part' );
-		await activateTheme( 'twentytwentyone' );
 	} );
 
 	// Number of loading measurements to take.
@@ -142,17 +141,21 @@ describe( 'Site Editor Performance', () => {
 			postType: 'page',
 		} );
 
-		// Wait for the first paragraph to be ready.
-		const firstParagraph = await canvas().waitForXPath(
-			'//p[contains(text(), "Lorem ipsum dolor sit amet")]'
-		);
+		// Wait for the first block to be ready.
+		await canvas().waitForSelector( '.wp-block' );
 
 		// Get inside the post content.
 		await enterEditMode();
 
-		// Insert a new paragraph right under the first one.
-		await firstParagraph.click(); // Once to select the block overlay.
-		await firstParagraph.click(); // Once again to select the paragraph.
+		// Select the post content block wrapper.
+		await canvas().click( '.wp-block-post-content' );
+
+		// Select the first paragraph in the post content block.
+		const firstParagraph = await canvas().waitForXPath(
+			'//p[contains(text(), "Lorem ipsum dolor sit amet")]'
+		);
+		await firstParagraph.click();
+
 		await insertBlock( 'Paragraph' );
 
 		// Start tracing.

package/specs/editor/plugins/inner-blocks-allowed-blocks.test.js

@@ -1,97 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	activatePlugin,
-	createNewPost,
-	deactivatePlugin,
-	getAllBlockInserterItemTitles,
-	insertBlock,
-	openGlobalBlockInserter,
-	closeGlobalBlockInserter,
-	clickBlockToolbarButton,
-	canvas,
-} from '@wordpress/e2e-test-utils';
-
-describe( 'Allowed Blocks Setting on InnerBlocks', () => {
-	const paragraphSelector =
-		'.block-editor-rich-text__editable[data-type="core/paragraph"]';
-	beforeAll( async () => {
-		await activatePlugin( 'gutenberg-test-innerblocks-allowed-blocks' );
-	} );
-
-	beforeEach( async () => {
-		await createNewPost();
-	} );
-
-	afterAll( async () => {
-		await deactivatePlugin( 'gutenberg-test-innerblocks-allowed-blocks' );
-	} );
-
-	it( 'allows all blocks if the allowed blocks setting was not set', async () => {
-		const parentBlockSelector = '[data-type="test/allowed-blocks-unset"]';
-		const childParagraphSelector = `${ parentBlockSelector } ${ paragraphSelector }`;
-		await insertBlock( 'Allowed Blocks Unset' );
-		await closeGlobalBlockInserter();
-		await canvas().waitForSelector( childParagraphSelector );
-		await canvas().click( childParagraphSelector );
-		await openGlobalBlockInserter();
-		await expect(
-			(
-				await getAllBlockInserterItemTitles()
-			 ).length
-		).toBeGreaterThan( 20 );
-	} );
-
-	it( 'allows the blocks if the allowed blocks setting was set', async () => {
-		const parentBlockSelector = '[data-type="test/allowed-blocks-set"]';
-		const childParagraphSelector = `${ parentBlockSelector } ${ paragraphSelector }`;
-		await insertBlock( 'Allowed Blocks Set' );
-		await closeGlobalBlockInserter();
-		await canvas().waitForSelector( childParagraphSelector );
-		await canvas().click( childParagraphSelector );
-		await openGlobalBlockInserter();
-		const allowedBlocks = await getAllBlockInserterItemTitles();
-		expect( allowedBlocks.sort() ).toEqual( [
-			'Button',
-			'Gallery',
-			'List',
-			'Media & Text',
-			'Quote',
-		] );
-	} );
-
-	it( 'correctly applies dynamic allowed blocks restrictions', async () => {
-		await insertBlock( 'Allowed Blocks Dynamic' );
-		await closeGlobalBlockInserter();
-		const parentBlockSelector = '[data-type="test/allowed-blocks-dynamic"]';
-		const blockAppender = '.block-list-appender button';
-		const appenderSelector = `${ parentBlockSelector } ${ blockAppender }`;
-		await canvas().waitForSelector( appenderSelector );
-		await canvas().click( appenderSelector );
-		expect( await getAllBlockInserterItemTitles() ).toEqual( [
-			'Image',
-			'List',
-		] );
-		const insertButton = (
-			await page.$x( `//button//span[contains(text(), 'List')]` )
-		 )[ 0 ];
-		await insertButton.click();
-		// Select the list wrapper so the image is insertable.
-		await page.keyboard.press( 'ArrowUp' );
-		await insertBlock( 'Image' );
-		await closeGlobalBlockInserter();
-		await page.waitForSelector( '.product[data-number-of-children="2"]' );
-		await clickBlockToolbarButton( 'Select Allowed Blocks Dynamic' );
-		// This focus shouldn't be neessary but there's a bug in trunk right now
-		// Where if you open the inserter, don't do anything and click the "appender" on the canvas
-		// the appender is not opened right away.
-		// It needs to be investigated on its own.
-		await page.focus( appenderSelector );
-		await page.click( appenderSelector );
-		expect( await getAllBlockInserterItemTitles() ).toEqual( [
-			'Gallery',
-			'Video',
-		] );
-	} );
-} );

package/specs/editor/various/__snapshots__/block-hierarchy-navigation.test.js.snap

@@ -1,63 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Navigating the block hierarchy should appear and function even without nested blocks 1`] = `
-"<!-- wp:paragraph -->
-<p>and I say hello</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:image -->
-<figure class="wp-block-image"><img alt=""/></figure>
-<!-- /wp:image -->"
-`;
-
-exports[`Navigating the block hierarchy should navigate block hierarchy using only the keyboard 1`] = `
-"<!-- wp:columns -->
-<div class="wp-block-columns"><!-- wp:column -->
-<div class="wp-block-column"><!-- wp:paragraph -->
-<p>First column</p>
-<!-- /wp:paragraph --></div>
-<!-- /wp:column -->
-
-<!-- wp:column -->
-<div class="wp-block-column"></div>
-<!-- /wp:column -->
-
-<!-- wp:column -->
-<div class="wp-block-column"><!-- wp:paragraph -->
-<p>Third column</p>
-<!-- /wp:paragraph --></div>
-<!-- /wp:column --></div>
-<!-- /wp:columns -->"
-`;
-
-exports[`Navigating the block hierarchy should navigate using the list view sidebar 1`] = `
-"<!-- wp:columns -->
-<div class="wp-block-columns"><!-- wp:column -->
-<div class="wp-block-column"><!-- wp:paragraph -->
-<p>First column</p>
-<!-- /wp:paragraph --></div>
-<!-- /wp:column -->
-
-<!-- wp:column -->
-<div class="wp-block-column"></div>
-<!-- /wp:column -->
-
-<!-- wp:column -->
-<div class="wp-block-column"><!-- wp:paragraph -->
-<p>Third column</p>
-<!-- /wp:paragraph --></div>
-<!-- /wp:column --></div>
-<!-- /wp:columns -->"
-`;
-
-exports[`Navigating the block hierarchy should select the wrapper div for a group 1`] = `
-"<!-- wp:group {"layout":{"type":"constrained"}} -->
-<div class="wp-block-group"><!-- wp:paragraph -->
-<p>just a paragraph</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:separator -->
-<hr class="wp-block-separator has-alpha-channel-opacity"/>
-<!-- /wp:separator --></div>
-<!-- /wp:group -->"
-`;

package/specs/editor/various/block-hierarchy-navigation.test.js

@@ -1,230 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	createNewPost,
-	insertBlock,
-	getEditedPostContent,
-	pressKeyTimes,
-	pressKeyWithModifier,
-	openDocumentSettingsSidebar,
-	getListViewBlocks,
-	switchBlockInspectorTab,
-	canvas,
-} from '@wordpress/e2e-test-utils';
-
-async function openListViewSidebar() {
-	await pressKeyWithModifier( 'access', 'o' );
-	await page.waitForSelector( '.block-editor-list-view-leaf.is-selected' );
-}
-
-async function tabToColumnsControl() {
-	let isColumnsControl = false;
-	do {
-		await page.keyboard.press( 'Tab' );
-
-		const isBlockInspectorTab = await page.evaluate( () => {
-			const activeElement = document.activeElement;
-			return (
-				activeElement.getAttribute( 'role' ) === 'tab' &&
-				activeElement.attributes.getNamedItem( 'aria-label' ).value ===
-					'Styles'
-			);
-		} );
-
-		if ( isBlockInspectorTab ) {
-			await page.keyboard.press( 'ArrowRight' );
-		}
-
-		isColumnsControl = await page.evaluate( () => {
-			const activeElement = document.activeElement;
-			return (
-				activeElement.tagName === 'INPUT' &&
-				activeElement.attributes.getNamedItem( 'aria-label' ).value ===
-					'Columns'
-			);
-		} );
-	} while ( ! isColumnsControl );
-}
-
-describe( 'Navigating the block hierarchy', () => {
-	beforeEach( async () => {
-		await createNewPost();
-	} );
-
-	it( 'should navigate using the list view sidebar', async () => {
-		await insertBlock( 'Columns' );
-		await canvas().click( '[aria-label="Two columns; equal split"]' );
-
-		// Add a paragraph in the first column.
-		await page.keyboard.press( 'ArrowDown' ); // Navigate to inserter.
-		await page.keyboard.press( 'Enter' ); // Activate inserter.
-		// Wait for inserter results to appear and then insert a paragraph.
-		await page.waitForSelector(
-			'.block-editor-inserter__quick-inserter-results .editor-block-list-item-paragraph'
-		);
-		await page.click( '.editor-block-list-item-paragraph' );
-		await page.keyboard.type( 'First column' );
-
-		// Navigate to the columns blocks.
-		await page.click(
-			'.edit-post-header-toolbar__document-overview-toggle'
-		);
-
-		const firstColumnsBlockMenuItem = (
-			await getListViewBlocks( 'Columns' )
-		 )[ 0 ];
-		await firstColumnsBlockMenuItem.click();
-
-		// Tweak the columns count.
-		await openDocumentSettingsSidebar();
-		await switchBlockInspectorTab( 'Settings' );
-		await page.focus(
-			'.block-editor-block-inspector [aria-label="Columns"][type="number"]'
-		);
-		await page.keyboard.down( 'Shift' );
-		await page.keyboard.press( 'ArrowLeft' );
-		await page.keyboard.up( 'Shift' );
-		await page.keyboard.type( '3' );
-
-		// Wait for the new column block to appear in the list view
-		// 5 = Columns, Column, Paragraph, Column, *Column*
-		await page.waitForSelector(
-			'tr.block-editor-list-view-leaf:nth-of-type(5)'
-		);
-
-		// Navigate to the last column block.
-		const lastColumnBlockMenuItem = (
-			await getListViewBlocks( 'Column' )
-		 )[ 2 ];
-		await lastColumnBlockMenuItem.click();
-
-		// Insert text in the last column block.
-		await page.keyboard.press( 'ArrowDown' ); // Navigate to inserter.
-		await page.keyboard.press( 'Enter' ); // Activate inserter.
-		// Wait for inserter results to appear and then insert a paragraph.
-		await page.waitForSelector(
-			'.block-editor-inserter__quick-inserter-results .editor-block-list-item-paragraph'
-		);
-		await page.click( '.editor-block-list-item-paragraph' );
-		await page.keyboard.type( 'Third column' );
-
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	it( 'should navigate block hierarchy using only the keyboard', async () => {
-		await insertBlock( 'Columns' );
-		await openDocumentSettingsSidebar();
-		await canvas().click( '[aria-label="Two columns; equal split"]' );
-
-		// Add a paragraph in the first column.
-		await page.keyboard.press( 'ArrowDown' ); // Navigate to inserter.
-		await page.keyboard.press( 'Enter' ); // Activate inserter.
-		// Wait for inserter results to appear and then insert a paragraph.
-		await page.waitForSelector(
-			'.block-editor-inserter__quick-inserter-results .editor-block-list-item-paragraph'
-		);
-		await page.click( '.editor-block-list-item-paragraph' );
-		await page.keyboard.type( 'First column' );
-
-		// Navigate to the columns blocks using the keyboard.
-		await openListViewSidebar();
-		await pressKeyTimes( 'ArrowUp', 2 );
-		await page.keyboard.press( 'Enter' );
-
-		// Move focus to the sidebar area.
-		await pressKeyWithModifier( 'ctrl', '`' );
-		await tabToColumnsControl();
-
-		// Tweak the columns count by increasing it by one.
-		await page.keyboard.press( 'ArrowRight' );
-
-		// Navigate to the third column in the columns block.
-		await pressKeyWithModifier( 'ctrlShift', '`' );
-		await pressKeyWithModifier( 'ctrlShift', '`' );
-		await pressKeyTimes( 'Tab', 3 );
-		await pressKeyTimes( 'ArrowDown', 4 );
-		await canvas().waitForSelector(
-			'.is-highlighted[aria-label="Block: Column (3 of 3)"]'
-		);
-		await page.keyboard.press( 'Enter' );
-		await canvas().waitForSelector(
-			'.is-selected[data-type="core/column"]'
-		);
-
-		// Insert text in the last column block.
-		await page.keyboard.press( 'ArrowDown' ); // Navigate to inserter.
-		await page.keyboard.press( 'Enter' ); // Activate inserter.
-		// Wait for inserter results to appear and then insert a paragraph.
-		await page.waitForSelector(
-			'.block-editor-inserter__quick-inserter-results .editor-block-list-item-paragraph'
-		);
-		await page.click( '.editor-block-list-item-paragraph' );
-		await page.keyboard.type( 'Third column' );
-
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	it( 'should appear and function even without nested blocks', async () => {
-		const textString = 'You say goodbye';
-
-		await insertBlock( 'Paragraph' );
-
-		// Add content so there is a block in the hierarchy.
-		await page.keyboard.type( textString );
-
-		// Create an image block too.
-		await page.keyboard.press( 'Enter' );
-		await insertBlock( 'Image' );
-
-		// Return to first block.
-		await openListViewSidebar();
-		await page.keyboard.press( 'ArrowUp' );
-		await page.keyboard.press( 'Space' );
-
-		// Replace its content.
-		await pressKeyWithModifier( 'primary', 'a' );
-		await page.keyboard.type( 'and I say hello' );
-
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	it( 'should select the wrapper div for a group', async () => {
-		// Insert a group block.
-		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."]'
-		);
-		// Insert some random blocks.
-		// The last block shouldn't be a textual block.
-		await canvas().click( '.block-list-appender .block-editor-inserter' );
-		const paragraphMenuItem = (
-			await page.$x( `//button//span[contains(text(), 'Paragraph')]` )
-		 )[ 0 ];
-		await paragraphMenuItem.click();
-		await page.keyboard.type( 'just a paragraph' );
-		await insertBlock( 'Separator' );
-
-		// Check the Group block content.
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-
-		// Unselect the blocks.
-		await canvas().click( '.editor-post-title' );
-
-		// Try selecting the group block using the Outline.
-		await page.click(
-			'.edit-post-header-toolbar__document-overview-toggle'
-		);
-		const groupMenuItem = ( await getListViewBlocks( 'Group' ) )[ 0 ];
-		await groupMenuItem.click();
-
-		// The group block's wrapper should be selected.
-		const isGroupBlockSelected = await canvas().evaluate(
-			() =>
-				document.activeElement.getAttribute( 'data-type' ) ===
-				'core/group'
-		);
-		expect( isGroupBlockSelected ).toBe( true );
-	} );
-} );

package/specs/editor/various/navigable-toolbar.test.js

@@ -1,104 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { createNewPost, pressKeyWithModifier } from '@wordpress/e2e-test-utils';
-
-async function isInBlockToolbar() {
-	return await page.evaluate( () => {
-		return !! document.activeElement.closest(
-			'.block-editor-block-toolbar'
-		);
-	} );
-}
-
-describe( 'Block Toolbar', () => {
-	beforeEach( async () => {
-		await createNewPost();
-	} );
-
-	describe( 'Contextual Toolbar', () => {
-		it( 'should not scroll page', async () => {
-			while (
-				await page.evaluate( () => {
-					const { activeElement } =
-						document.activeElement?.contentDocument ?? document;
-					const scrollable =
-						wp.dom.getScrollContainer( activeElement );
-					return ! scrollable || scrollable.scrollTop === 0;
-				} )
-			) {
-				await page.keyboard.press( 'Enter' );
-			}
-
-			await page.keyboard.type( 'a' );
-
-			const scrollTopBefore = await page.evaluate( () => {
-				const { activeElement } =
-					document.activeElement?.contentDocument ?? document;
-				window.scrollContainer =
-					wp.dom.getScrollContainer( activeElement );
-				return window.scrollContainer.scrollTop;
-			} );
-
-			await pressKeyWithModifier( 'alt', 'F10' );
-			expect( await isInBlockToolbar() ).toBe( true );
-
-			const scrollTopAfter = await page.evaluate( () => {
-				return window.scrollContainer.scrollTop;
-			} );
-			expect( scrollTopBefore ).toBe( scrollTopAfter );
-		} );
-
-		it( 'navigates into the toolbar by keyboard (Alt+F10)', async () => {
-			// Assumes new post focus starts in title. Create first new
-			// block by Enter.
-			await page.keyboard.press( 'Enter' );
-
-			// [TEMPORARY]: A new paragraph is not technically a block yet
-			// until starting to type within it.
-			await page.keyboard.type( 'Example' );
-
-			// Upward.
-			await pressKeyWithModifier( 'alt', 'F10' );
-
-			expect( await isInBlockToolbar() ).toBe( true );
-		} );
-	} );
-
-	describe( 'Unified Toolbar', () => {
-		beforeEach( async () => {
-			// Enable unified toolbar
-			await page.evaluate( () => {
-				const { select, dispatch } = wp.data;
-				const isCurrentlyUnified =
-					select( 'core/edit-post' ).isFeatureActive(
-						'fixedToolbar'
-					);
-				if ( ! isCurrentlyUnified ) {
-					dispatch( 'core/edit-post' ).toggleFeature(
-						'fixedToolbar'
-					);
-				}
-			} );
-		} );
-
-		it( 'navigates into the toolbar by keyboard (Alt+F10)', async () => {
-			// Assumes new post focus starts in title. Create first new
-			// block by Enter.
-			await page.keyboard.press( 'Enter' );
-
-			// [TEMPORARY]: A new paragraph is not technically a block yet
-			// until starting to type within it.
-			await page.keyboard.type( 'Example' );
-
-			// Upward.
-			await pressKeyWithModifier( 'alt', 'F10' );
-
-			expect(
-				await page.evaluate( () => {
-					return document.activeElement.getAttribute( 'aria-label' );
-				} )
-			).toBe( 'Show document tools' );
-		} );
-	} );
-} );