@wordpress/e2e-tests 4.0.0 → 4.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/e2e-tests",
-	"version": "4.0.0",
+	"version": "4.1.0",
 	"description": "End-To-End (E2E) tests for WordPress.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -23,11 +23,11 @@
 		"node": ">=12"
 	},
 	"dependencies": {
-		"@wordpress/e2e-test-utils": "^7.2.0",
+		"@wordpress/e2e-test-utils": "^7.3.0",
 		"@wordpress/jest-console": "^5.0.2",
 		"@wordpress/jest-puppeteer-axe": "^4.0.2",
-		"@wordpress/scripts": "^22.4.0",
-		"@wordpress/url": "^3.7.0",
+		"@wordpress/scripts": "^22.5.0",
+		"@wordpress/url": "^3.8.0",
 		"chalk": "^4.0.0",
 		"expect-puppeteer": "^4.4.0",
 		"filenamify": "^4.2.0",
@@ -46,5 +46,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "11eb1241e63c9240018323551c6753f8a5fa96f9"
+	"gitHead": "1ba52312b56db563df2d8d4fba5b00613fb46d8c"
 }

package/specs/{experiments → editor}/blocks/comments-query.test.js

@@ -24,11 +24,21 @@ describe( 'Comment Query Loop', () => {
 			'newest'
 		);
 	} );
+	it( 'We show no results message if there are no comments', async () => {
+		await trashAllComments();
+		await createNewPost();
+		await insertBlock( 'Comments Query Loop' );
+		await page.waitForSelector( '[data-testid="noresults"]' );
+		expect(
+			await page.evaluate(
+				( el ) => el.innerText,
+				await page.$( '[data-testid="noresults"]' )
+			)
+		).toEqual( 'No results found.' );
+	} );
 	it( 'Pagination links are working as expected', async () => {
 		await createNewPost();
-		// Insert the Query Comment Loop block.
 		await insertBlock( 'Comments Query Loop' );
-		// Insert the Comment Loop form.
 		await insertBlock( 'Post Comments Form' );
 		await publishPost();
 		// Visit the post that was just published.
@@ -89,9 +99,7 @@ describe( 'Comment Query Loop', () => {
 	it( 'Pagination links are not appearing if break comments is not enabled', async () => {
 		await setOption( 'page_comments', '0' );
 		await createNewPost();
-		// Insert the Query Comment Loop block.
 		await insertBlock( 'Comments Query Loop' );
-		// Insert the Comment Loop form.
 		await insertBlock( 'Post Comments Form' );
 		await publishPost();
 		// Visit the post that was just published.

package/specs/editor/blocks/navigation.test.js

@@ -1429,5 +1429,43 @@ describe( 'Navigation', () => {
 				'//*[contains(@class, "components-snackbar")]/*[text()="Navigation Menu successfully created."]'
 			);
 		} );
+
+		it( 'should always focus select menu button after item selection', async () => {
+			// Create some navigation menus to work with.
+			await createNavigationMenu( {
+				title: 'Example Navigation',
+				content:
+					'<!-- wp:navigation-link {"label":"WordPress","type":"custom","url":"http://www.wordpress.org/","kind":"custom","isTopLevelLink":true} /-->',
+			} );
+			await createNavigationMenu( {
+				title: 'Second Example Navigation',
+				content:
+					'<!-- wp:navigation-link {"label":"WordPress","type":"custom","url":"http://www.wordpress.org/","kind":"custom","isTopLevelLink":true} /-->',
+			} );
+
+			// Create new post.
+			await createNewPost();
+
+			// Insert new block and wait for the insert to complete.
+			await insertBlock( 'Navigation' );
+			await waitForBlock( 'Navigation' );
+			await page.waitForXPath( START_EMPTY_XPATH );
+
+			// Change menus via the select menu toolbar button.
+			const selectMenuDropdown = await page.waitForSelector(
+				'[aria-label="Select Menu"]'
+			);
+			await selectMenuDropdown.click();
+			const exampleNavigationOption = await page.waitForXPath(
+				'//span[contains(text(), "Second Example Navigation")]'
+			);
+			await exampleNavigationOption.click();
+
+			// Once the options are closed, does select menu button receive focus?
+			const selectMenuDropdown2 = await page.waitForSelector(
+				'[aria-label="Select Menu"]'
+			);
+			await expect( selectMenuDropdown2 ).toHaveFocus();
+		} );
 	} );
 } );

package/specs/editor/blocks/query.test.js

@@ -33,9 +33,14 @@ describe( 'Query block', () => {
 	describe( 'Query block insertion', () => {
 		it( 'Carousel', async () => {
 			await insertBlock( 'Query' );
+			// Wait for the choose pattern button
+			const choosePatternButton = await page.waitForSelector(
+				'div[data-type="core/query"] button.is-primary'
+			);
+			await choosePatternButton.click();
 			// Wait for pattern blocks to be loaded.
 			await page.waitForSelector(
-				'.block-editor-block-pattern-setup__container .wp-block-post-title'
+				'.block-editor-block-pattern-setup__container iframe[title="Editor canvas"]'
 			);
 			/**
 			 * Ensure that carousel is working by checking slider css classes
@@ -70,6 +75,11 @@ describe( 'Query block', () => {
 		} );
 		it( 'Grid view', async () => {
 			await insertBlock( 'Query' );
+			// Wait for the choose pattern button
+			const choosePatternButton = await page.waitForSelector(
+				'div[data-type="core/query"] button.is-primary'
+			);
+			await choosePatternButton.click();
 			// Wait for patterns setup to be loaded.
 			await page.waitForSelector(
 				'.block-editor-block-pattern-setup__display-controls'
@@ -80,8 +90,8 @@ describe( 'Query block', () => {
 			);
 			await gridViewButton.click();
 			// Wait for patterns to be loaded and click the wanted pattern.
-			const gridPattern = await page.waitForXPath(
-				'//div[@class="block-editor-block-pattern-setup-list__item-title" and contains(text(), "Query Test 2")]'
+			const gridPattern = await page.waitForSelector(
+				'.block-editor-block-pattern-setup-list__list-item[aria-label="Query Test 2"]'
 			);
 			await gridPattern.click();
 			// Wait for pattern setup to go away.

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

@@ -10,7 +10,6 @@ import {
 	pressKeyTimes,
 	searchForBlock,
 	setBrowserViewport,
-	showBlockToolbar,
 	pressKeyWithModifier,
 } from '@wordpress/e2e-test-utils';
 
@@ -170,68 +169,6 @@ describe( 'Inserting blocks', () => {
 		).not.toBeNull();
 	} );
 
-	// Check for regression of https://github.com/WordPress/gutenberg/issues/9583
-	it( 'should not allow transfer of focus outside of the block-insertion menu once open', async () => {
-		// Enter the default block and click the inserter toggle button to the left of it.
-		await page.keyboard.press( 'Enter' );
-		await showBlockToolbar();
-		await page.click(
-			'.block-editor-block-list__empty-block-inserter .block-editor-inserter__toggle'
-		);
-
-		// Expect the inserter search input to be the active element.
-		let activeElementClassList = await page.evaluate(
-			() => document.activeElement.classList
-		);
-		expect( Object.values( activeElementClassList ) ).toContain(
-			'components-search-control__input'
-		);
-
-		// Try using the up arrow key (vertical navigation triggers the issue described in #9583).
-		await page.keyboard.press( 'ArrowUp' );
-
-		// Expect the inserter search input to still be the active element.
-		activeElementClassList = await page.evaluate(
-			() => document.activeElement.classList
-		);
-		expect( Object.values( activeElementClassList ) ).toContain(
-			'components-search-control__input'
-		);
-
-		// Tab to the block list.
-		await page.keyboard.press( 'Tab' );
-
-		// Expect the block list to be the active element.
-		activeElementClassList = await page.evaluate(
-			() => document.activeElement.classList
-		);
-		expect( Object.values( activeElementClassList ) ).toContain(
-			'block-editor-block-types-list__item'
-		);
-
-		// Try using the up arrow key.
-		await page.keyboard.press( 'ArrowUp' );
-
-		// Expect the block list to still be the active element.
-		activeElementClassList = await page.evaluate(
-			() => document.activeElement.classList
-		);
-		expect( Object.values( activeElementClassList ) ).toContain(
-			'block-editor-block-types-list__item'
-		);
-
-		// Press escape to close the block inserter.
-		await page.keyboard.press( 'Escape' );
-
-		// Expect focus to have transferred back to the inserter toggle button.
-		activeElementClassList = await page.evaluate(
-			() => document.activeElement.classList
-		);
-		expect( Object.values( activeElementClassList ) ).toContain(
-			'block-editor-inserter__toggle'
-		);
-	} );
-
 	// 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' );
@@ -310,12 +247,11 @@ describe( 'Inserting blocks', () => {
 		await insertBlock( 'Paragraph' );
 		await page.keyboard.type( 'First paragraph' );
 		await insertBlock( 'Image' );
-		await showBlockToolbar();
 		const paragraphBlock = await page.$(
 			'p[aria-label="Paragraph block"]'
 		);
 		paragraphBlock.click();
-		await showBlockToolbar();
+		await page.evaluate( () => new Promise( window.requestIdleCallback ) );
 
 		// Open the global inserter and search for the Heading block.
 		await searchForBlock( 'Heading' );
@@ -323,7 +259,6 @@ describe( 'Inserting blocks', () => {
 		const headingButton = (
 			await page.$x( `//button//span[contains(text(), 'Heading')]` )
 		 )[ 0 ];
-
 		// Hover over the block should show the blue line indicator.
 		await headingButton.hover();
 

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

@@ -116,6 +116,24 @@ describe( 'New User Experience (NUX)', () => {
 		expect( welcomeGuide ).toBeNull();
 	} );
 
+	it( 'should focus post title field after welcome guide is dismissed and post is empty', async () => {
+		// Create a new post as a first-time user.
+		await createNewPost( { showWelcomeGuide: true } );
+
+		// Guide should be open.
+		const welcomeGuide = await page.$( '.edit-post-welcome-guide' );
+		expect( welcomeGuide ).not.toBeNull();
+
+		// Close the guide.
+		await page.click( 'button[aria-label="Close dialog"]' );
+
+		// Focus should be in post title field.
+		const postTitle = await page.waitForSelector(
+			'h1[aria-label="Add title"'
+		);
+		await expect( postTitle ).toHaveFocus();
+	} );
+
 	it( 'should show the welcome guide if it is manually opened', async () => {
 		let welcomeGuide;
 

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

@@ -485,28 +485,6 @@ describe( 'RichText', () => {
 		expect( await getEditedPostContent() ).toMatchSnapshot();
 	} );
 
-	it( 'should show/hide toolbar when entering/exiting format', async () => {
-		const blockToolbarSelector = '.block-editor-block-toolbar';
-		await clickBlockAppender();
-		await page.keyboard.type( '1' );
-		expect( await page.$( blockToolbarSelector ) ).toBe( null );
-		await pressKeyWithModifier( 'primary', 'b' );
-		expect( await page.$( blockToolbarSelector ) ).not.toBe( null );
-		await page.keyboard.type( '2' );
-		expect( await page.$( blockToolbarSelector ) ).not.toBe( null );
-		await pressKeyWithModifier( 'primary', 'b' );
-		expect( await page.$( blockToolbarSelector ) ).toBe( null );
-		await page.keyboard.type( '3' );
-		await page.keyboard.press( 'ArrowLeft' );
-		expect( await page.$( blockToolbarSelector ) ).toBe( null );
-		await page.keyboard.press( 'ArrowLeft' );
-		expect( await page.$( blockToolbarSelector ) ).not.toBe( null );
-		await page.keyboard.press( 'ArrowLeft' );
-		expect( await page.$( blockToolbarSelector ) ).not.toBe( null );
-		await page.keyboard.press( 'ArrowLeft' );
-		expect( await page.$( blockToolbarSelector ) ).toBe( null );
-	} );
-
 	it( 'should run input rules after composition end', async () => {
 		await clickBlockAppender();
 		// Puppeteer doesn't support composition, so emulate it by inserting

package/specs/editor/various/toolbar-roving-tabindex.test.js

@@ -4,7 +4,6 @@
 import {
 	createNewPost,
 	pressKeyWithModifier,
-	clickBlockToolbarButton,
 	insertBlock,
 } from '@wordpress/e2e-test-utils';
 
@@ -42,9 +41,7 @@ async function testBlockToolbarKeyboardNavigation(
 
 async function wrapCurrentBlockWithGroup( currentBlockTitle ) {
 	await page.click( `[aria-label="${ currentBlockTitle }"]` );
-	await page.evaluate( () => {
-		document.querySelector( '.editor-block-list-item-group' ).click();
-	} );
+	await page.click( '.editor-block-list-item-group' );
 }
 
 async function testGroupKeyboardNavigation(
@@ -128,10 +125,11 @@ describe( 'Toolbar roving tabindex', () => {
 		await insertBlock( 'Paragraph' );
 		await page.keyboard.type( 'Paragraph' );
 		await focusBlockToolbar();
-		await clickBlockToolbarButton( 'Bold' );
-		await page.keyboard.type( 'a' );
+		await page.keyboard.press( 'ArrowRight' );
+		await expectLabelToHaveFocus( 'Move up' );
+		await page.keyboard.press( 'Tab' );
 		await pressKeyWithModifier( 'shift', 'Tab' );
-		await expectLabelToHaveFocus( 'Bold' );
+		await expectLabelToHaveFocus( 'Move up' );
 	} );
 
 	it( 'can reach toolbar items with arrow keys after pressing alt+F10', async () => {

package/specs/site-editor/global-styles-sidebar.test.js

@@ -0,0 +1,42 @@
+/**
+ * WordPress dependencies
+ */
+import {
+	deleteAllTemplates,
+	activateTheme,
+	visitSiteEditor,
+	toggleGlobalStyles,
+	openGlobalStylesPanel,
+} from '@wordpress/e2e-test-utils';
+
+describe( 'Global styles sidebar', () => {
+	beforeAll( async () => {
+		await activateTheme( 'emptytheme' );
+		await Promise.all( [
+			deleteAllTemplates( 'wp_template' ),
+			deleteAllTemplates( 'wp_template_part' ),
+		] );
+	} );
+	afterAll( async () => {
+		await Promise.all( [
+			deleteAllTemplates( 'wp_template' ),
+			deleteAllTemplates( 'wp_template_part' ),
+		] );
+		await activateTheme( 'twentytwentyone' );
+	} );
+	beforeEach( async () => {
+		await visitSiteEditor();
+	} );
+	describe( 'blocks list', () => {
+		it( 'should filter results properly', async () => {
+			await toggleGlobalStyles();
+			await openGlobalStylesPanel( 'Blocks' );
+			await page.focus( '.edit-site-block-types-search input' );
+			await page.keyboard.type( 'heading' );
+			const results = await page.$$(
+				'.edit-site-block-types-item-list div[role="listitem"]'
+			);
+			expect( results.length ).toEqual( 1 );
+		} );
+	} );
+} );

package/specs/editor/plugins/block-api.test.js

@@ -1,33 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	activatePlugin,
-	createNewPost,
-	deactivatePlugin,
-	insertBlock,
-} from '@wordpress/e2e-test-utils';
-
-describe( 'Using Block API', () => {
-	beforeAll( async () => {
-		await activatePlugin( 'gutenberg-test-block-api' );
-	} );
-
-	afterAll( async () => {
-		await deactivatePlugin( 'gutenberg-test-block-api' );
-	} );
-
-	beforeEach( async () => {
-		await createNewPost();
-	} );
-
-	test( 'Inserts the filtered hello world block even when filter added after block registration', async () => {
-		await insertBlock( 'Filtered Hello World' );
-
-		const blockContent = await page.$eval(
-			'div[data-type="e2e-tests/hello-world"]',
-			( element ) => element.textContent
-		);
-		expect( blockContent ).toEqual( 'Hello Editor!' );
-	} );
-} );

package/specs/editor/various/__snapshots__/post-editor-template-mode.test.js.snap

@@ -1,27 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Post Editor Template mode Allow creating custom block templates in classic themes 1`] = `
-"<a class=\\"skip-link screen-reader-text\\" href=\\"#wp--skip-link--target\\">Skip to content</a>
-<header class=\\"wp-block-group\\"><h1 class=\\"wp-block-site-title\\"><a href=\\"http://localhost:8889\\" rel=\\"home\\">gutenberg</a></h1>
-
-<p class=\\"wp-block-site-tagline\\">Just another WordPress site</p></header>
-
-
-
-<hr class=\\"wp-block-separator\\">
-
-
-
-<main class=\\"wp-block-group\\" id=\\"wp--skip-link--target\\">
-<div class=\\"wp-block-group\\"><div class=\\"wp-block-group__inner-container\\"><div class=\\"wp-block-group__inner-container\\"><h2 class=\\"wp-block-post-title\\">Another FSE Post</h2></div></div></div>
-
-
-<div class=\\"entry-content wp-block-post-content\\">
-<p>Hello World</p>
-</div></main>
-
-
-
-<p>Just a random paragraph added to the template</p>
-"
-`;

package/specs/editor/various/post-editor-template-mode.test.js

@@ -1,377 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	activateTheme,
-	createNewPost,
-	insertBlock,
-	saveDraft,
-	openPreviewPage,
-	openDocumentSettingsSidebar,
-	activatePlugin,
-	deactivatePlugin,
-	deleteAllTemplates,
-	setBrowserViewport,
-} from '@wordpress/e2e-test-utils';
-
-const openSidebarPanelWithTitle = async ( title ) => {
-	const panel = await page.waitForXPath(
-		`//div[contains(@class,"edit-post-sidebar")]//button[@class="components-button components-panel__body-toggle"][contains(text(),"${ title }")]`
-	);
-
-	const expanded = await page.evaluate(
-		( element ) => element.getAttribute( 'aria-expanded' ),
-		panel
-	);
-	if ( expanded === 'false' ) {
-		await panel.click();
-	}
-};
-
-const disableTemplateWelcomeGuide = async () => {
-	// Turn off the welcome guide if it's visible.
-	const isWelcomeGuideActive = await page.evaluate( () =>
-		wp.data
-			.select( 'core/edit-post' )
-			.isFeatureActive( 'welcomeGuideTemplate' )
-	);
-	if ( isWelcomeGuideActive ) {
-		await page.evaluate( () =>
-			wp.data
-				.dispatch( 'core/edit-post' )
-				.toggleFeature( 'welcomeGuideTemplate' )
-		);
-	}
-};
-
-const switchToTemplateMode = async () => {
-	await disableTemplateWelcomeGuide();
-
-	// Switch to template mode.
-	await openDocumentSettingsSidebar();
-	await openSidebarPanelWithTitle( 'Template' );
-	const editTemplateXPath =
-		"//*[contains(@class, 'edit-post-template__actions')]//button[contains(text(), 'Edit')]";
-	const switchLink = await page.waitForXPath( editTemplateXPath );
-	await switchLink.click();
-
-	// Check that we switched properly to edit mode.
-	await page.waitForXPath(
-		'//*[text()="Editing template. Changes made here affect all posts and pages that use the template."]'
-	);
-	const title = await page.$eval(
-		'.edit-post-template-top-area',
-		( el ) => el.innerText
-	);
-	expect( title ).toContain( 'Just an FSE Post\n' );
-};
-
-const createNewTemplate = async ( templateName ) => {
-	await disableTemplateWelcomeGuide();
-
-	// Create a new custom template.
-	await openDocumentSettingsSidebar();
-	await openSidebarPanelWithTitle( 'Template' );
-	const newTemplateXPath =
-		"//*[contains(@class, 'edit-post-template__actions')]//button[contains(text(), 'New')]";
-	const newButton = await page.waitForXPath( newTemplateXPath );
-	await newButton.click();
-
-	// Fill the template title and submit.
-	const templateNameInputSelector =
-		'.edit-post-template__modal .components-text-control__input';
-	await page.click( templateNameInputSelector );
-	await page.keyboard.type( templateName );
-	await page.keyboard.press( 'Enter' );
-
-	// Check that we switched properly to edit mode.
-	await page.waitForXPath(
-		'//*[contains(@class, "components-snackbar")]/*[text()="Custom template created. You\'re in template mode now."]'
-	);
-};
-
-describe( 'Post Editor Template mode', () => {
-	beforeAll( async () => {
-		await activatePlugin( 'gutenberg-test-block-templates' );
-		await deleteAllTemplates( 'wp_template' );
-		await deleteAllTemplates( 'wp_template_part' );
-	} );
-
-	afterAll( async () => {
-		await activateTheme( 'twentytwentyone' );
-		await deactivatePlugin( 'gutenberg-test-block-templates' );
-	} );
-
-	it( 'Allow to switch to template mode, edit the template and check the result', async () => {
-		await activateTheme( 'emptytheme' );
-		await createNewPost();
-		// Create a random post.
-		await page.type( '.editor-post-title__input', 'Just an FSE Post' );
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( 'Hello World' );
-
-		// Unselect the blocks.
-		await page.evaluate( () => {
-			wp.data.dispatch( 'core/block-editor' ).clearSelectedBlock();
-		} );
-
-		// Save the post
-		// Saving shouldn't be necessary but unfortunately,
-		// there's a template resolution bug forcing us to do so.
-		await saveDraft();
-		await page.reload();
-		await switchToTemplateMode();
-
-		// Edit the template.
-		await insertBlock( 'Paragraph' );
-		await page.keyboard.type(
-			'Just a random paragraph added to the template'
-		);
-
-		// Save changes.
-		const publishButton = await page.waitForXPath(
-			`//button[contains(text(), 'Publish')]`
-		);
-		await publishButton.click();
-		const saveButton = await page.waitForXPath(
-			`//div[contains(@class, "entities-saved-states__panel-header")]/button[contains(text(), 'Save')]`
-		);
-		await saveButton.click();
-
-		// Preview changes.
-		const previewPage = await openPreviewPage();
-		await previewPage.waitForXPath(
-			'//p[contains(text(), "Just a random paragraph added to the template")]'
-		);
-	} );
-
-	it.skip( 'Allow creating custom block templates in classic themes', async () => {
-		await activateTheme( 'twentytwentyone' );
-		await createNewPost();
-		// Create a random post.
-		await page.type( '.editor-post-title__input', 'Another FSE Post' );
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( 'Hello World' );
-
-		// Unselect the blocks.
-		await page.evaluate( () => {
-			wp.data.dispatch( 'core/block-editor' ).clearSelectedBlock();
-		} );
-
-		// Save the post
-		// Saving shouldn't be necessary but unfortunately,
-		// there's a template resolution bug forcing us to do so.
-		await saveDraft();
-		await page.reload();
-
-		await createNewTemplate( 'Blank Template' );
-
-		// Edit the template.
-		await insertBlock( 'Paragraph' );
-		await page.keyboard.type(
-			'Just a random paragraph added to the template'
-		);
-
-		// Save changes.
-		const publishButton = await page.waitForXPath(
-			`//button[contains(text(), 'Publish')]`
-		);
-		await publishButton.click();
-		const saveButton = await page.waitForXPath(
-			`//div[contains(@class, "entities-saved-states__panel-header")]/button[contains(text(), 'Save')]`
-		);
-		await saveButton.click();
-		// Avoid publishing the post
-		const cancelButton = await page.waitForXPath(
-			`//button[contains(text(), 'Cancel')]`
-		);
-		await cancelButton.click();
-
-		// Preview changes.
-		const previewPage = await openPreviewPage();
-		await previewPage.waitForSelector( '.wp-site-blocks' );
-		const content = await previewPage.evaluate(
-			() => document.querySelector( '.wp-site-blocks' ).innerHTML
-		);
-
-		expect( content ).toMatchSnapshot();
-	} );
-} );
-
-describe( 'Delete Post Template Confirmation Dialog', () => {
-	beforeAll( async () => {
-		await activatePlugin( 'gutenberg-test-block-templates' );
-		await deleteAllTemplates( 'wp_template' );
-		await deleteAllTemplates( 'wp_template_part' );
-		await activateTheme( 'twentytwentyone' );
-		await createNewPost();
-		// Create a random post.
-		await page.type( '.editor-post-title__input', 'Just an FSE Post' );
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( 'Hello World' );
-
-		// Save the post
-		// Saving shouldn't be necessary but unfortunately,
-		// there's a template resolution bug forcing us to do so.
-		await saveDraft();
-		await page.reload();
-		// Unselect the blocks.
-		await page.evaluate( () => {
-			wp.data.dispatch( 'core/block-editor' ).clearSelectedBlock();
-		} );
-	} );
-
-	afterAll( async () => {
-		await activateTheme( 'twentytwentyone' );
-		await deactivatePlugin( 'gutenberg-test-block-templates' );
-	} );
-
-	[ 'large', 'small' ].forEach( ( viewport ) => {
-		it( `should retain template if deletion is canceled when the viewport is ${ viewport }`, async () => {
-			await setBrowserViewport( viewport );
-
-			const isWelcomeGuideActive = await page.evaluate(
-				() =>
-					!! wp.data
-						.select( 'core/preferences' )
-						.get( 'core/edit-post', 'welcomeGuide' )
-			);
-			if ( isWelcomeGuideActive === true ) {
-				await page.evaluate( () =>
-					wp.data
-						.dispatch( 'core/preferences' )
-						.toggle( 'core/edit-post', 'welcomeGuide' )
-				);
-				await page.reload();
-				await page.waitForSelector( '.edit-post-layout' );
-			}
-			if ( viewport === 'small' ) {
-				await page.waitForXPath( '//button[@aria-label="Settings"]' );
-				await openDocumentSettingsSidebar();
-			}
-			const templateTitle = `${ viewport } Viewport Deletion Test`;
-
-			await createNewTemplate( templateTitle );
-			// Edit the template
-			if ( viewport === 'small' ) {
-				await page.waitForXPath( `//h2[text()="${ templateTitle }"]` );
-				const closeDocumentSettingsButton = await page.waitForXPath(
-					'//button[@aria-label="Close settings"]'
-				);
-				await closeDocumentSettingsButton.click();
-			}
-			await insertBlock( 'Paragraph' );
-			await page.keyboard.type(
-				'Just a random paragraph added to the template'
-			);
-
-			// Save changes
-			const publishButton = await page.waitForXPath(
-				`//button[contains(text(), 'Publish')]`
-			);
-			await publishButton.click();
-			const saveButton = await page.waitForXPath(
-				`//div[contains(@class, "entities-saved-states__panel-header")]/button[contains(text(), 'Save')]`
-			);
-			await saveButton.click();
-			// Avoid publishing the post
-			// Select the cancel button via parent div's class, because the text `Cancel` is used on another button as well
-			const cancelButton = await page.waitForXPath(
-				`//div[contains(@class,"editor-post-publish-panel__header-cancel-button")]/button[not(@disabled)]`
-			);
-			await cancelButton.click();
-
-			const templateDropdown = await page.waitForXPath(
-				`//button[contains(text(), '${ templateTitle }')]`
-			);
-			await templateDropdown.click();
-			const deleteTemplateButton = await page.waitForXPath(
-				'//button[@role="menuitem"][@aria-label="Delete template"]'
-			);
-			await deleteTemplateButton.click();
-
-			await page.waitForXPath(
-				`//*[text()="Are you sure you want to delete the ${ templateTitle } template? It may be used by other pages or posts."]`
-			);
-			const dialogCancelButton = await page.waitForXPath(
-				'//*[@role="dialog"][not(@id="wp-link-wrap")]//button[text()="Cancel"]'
-			);
-			await dialogCancelButton.click();
-
-			const exitTemplateModeButton = await page.waitForXPath(
-				'//button[text()="Back"]'
-			);
-			await exitTemplateModeButton.click();
-
-			await page.waitForXPath(
-				'//button[@aria-label="Settings"][@aria-expanded="false"]'
-			);
-			await openDocumentSettingsSidebar();
-
-			const element = await page.waitForXPath(
-				'//h2/button[contains(text(), "Template")]/../..//select'
-			);
-			const value = await element.getProperty( 'value' );
-			const currentTemplateSlug = await value.jsonValue();
-
-			expect( currentTemplateSlug ).toBe(
-				`wp-custom-template-${ viewport }-viewport-deletion-test`
-			);
-		} );
-
-		it( `should delete template if deletion is confirmed when the viewport is ${ viewport }`, async () => {
-			const templateTitle = `${ viewport } Viewport Deletion Test`;
-
-			await setBrowserViewport( viewport );
-
-			await switchToTemplateMode();
-			if ( viewport === 'small' ) {
-				const closeDocumentSettingsButton = await page.waitForXPath(
-					'//div[contains(@class,"interface-complementary-area-header__small")]/button[@aria-label="Close settings"]'
-				);
-				await closeDocumentSettingsButton.click();
-			}
-
-			const templateDropdown = await page.waitForXPath(
-				`//button[contains(text(), '${ templateTitle }')]`
-			);
-			await templateDropdown.click();
-
-			const deleteTemplateButton = await page.waitForXPath(
-				'//button[@role="menuitem"][@aria-label="Delete template"]'
-			);
-			await deleteTemplateButton.click();
-
-			await page.waitForXPath(
-				`//*[text()="Are you sure you want to delete the ${ templateTitle } template? It may be used by other pages or posts."]`
-			);
-			const dialogConfirmButton = await page.waitForXPath(
-				'//*[@role="dialog"][not(@id="wp-link-wrap")]//button[text()="OK"]'
-			);
-
-			await dialogConfirmButton.click();
-
-			// Saving isn't technically necessary, but for themes without any specified templates,
-			// the removal of the Templates dropdown is delayed. A save and reload allows for this
-			// delay and prevents flakiness
-			await saveDraft();
-			await page.reload();
-
-			const optionElementHandlers = await page.$x(
-				'//h2/button[contains(text(), "Template")]/../..//select/option'
-			);
-			const availableTemplates = [];
-			for ( const elem of optionElementHandlers ) {
-				const elemName = await elem.getProperty( 'textContent' );
-				const templateName = await elemName.jsonValue();
-				availableTemplates.push( templateName );
-			}
-
-			expect(
-				availableTemplates.includes(
-					`${ viewport } Viewport Deletion Test`
-				)
-			).toBe( false );
-		} );
-	} );
-} );

package/specs/editor/various/style-variation.test.js

@@ -1,36 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	createNewPost,
-	clickBlockToolbarButton,
-	insertBlock,
-	getEditedPostContent,
-} from '@wordpress/e2e-test-utils';
-
-describe( 'adding blocks', () => {
-	beforeAll( async () => {
-		await createNewPost();
-	} );
-
-	it( 'Should switch to the plain style of the quote block', async () => {
-		// Inserting a quote block.
-		await insertBlock( 'Quote' );
-		await page.keyboard.type( 'Quote content' );
-
-		await clickBlockToolbarButton( 'Quote' );
-
-		const plainStyleButton = await page.waitForXPath(
-			'//*[@role="menuitem"][contains(., "Plain")]'
-		);
-		await plainStyleButton.click();
-
-		// Check the content.
-		const content = await getEditedPostContent();
-		expect( content ).toMatchInlineSnapshot( `
-		"<!-- wp:quote {\\"className\\":\\"is-style-plain\\"} -->
-		<blockquote class=\\"wp-block-quote is-style-plain\\"><p>Quote content</p></blockquote>
-		<!-- /wp:quote -->"
-	` );
-	} );
-} );

package/specs/site-editor/document-settings.test.js

@@ -1,90 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	deleteAllTemplates,
-	activateTheme,
-	visitSiteEditor,
-} from '@wordpress/e2e-test-utils';
-
-async function getDocumentSettingsTitle() {
-	const titleElement = await page.waitForSelector(
-		'.edit-site-document-actions__title'
-	);
-
-	return titleElement.evaluate( ( el ) => el.textContent );
-}
-
-async function getDocumentSettingsSecondaryTitle() {
-	const secondaryTitleElement = await page.waitForSelector(
-		'.edit-site-document-actions__secondary-item'
-	);
-
-	return secondaryTitleElement.evaluate( ( el ) => el.textContent );
-}
-
-describe( 'Document Settings', () => {
-	beforeAll( async () => {
-		await activateTheme( 'emptytheme' );
-		await deleteAllTemplates( 'wp_template' );
-		await deleteAllTemplates( 'wp_template_part' );
-	} );
-	afterAll( async () => {
-		await activateTheme( 'twentytwentyone' );
-	} );
-
-	beforeEach( async () => {
-		await visitSiteEditor();
-	} );
-
-	describe( 'when a template is selected from the navigation sidebar', () => {
-		it( 'should display the selected templates name in the document header', async () => {
-			// Navigate to a template.
-			await visitSiteEditor( {
-				postId: 'emptytheme//index',
-				postType: 'wp_template',
-			} );
-
-			// Evaluate the document settings title.
-			const actual = await getDocumentSettingsTitle();
-
-			expect( actual ).toEqual( 'Editing template: Index' );
-		} );
-
-		describe( 'and a template part is clicked in the template', () => {
-			it.skip( "should display the selected template part's name in the document header", async () => {
-				// Select the header template part via list view.
-				await page.click(
-					'.edit-post-header-toolbar__list-view-toggle'
-				);
-				const headerTemplatePartListViewButton = await page.waitForXPath(
-					'//a[contains(@class, "block-editor-list-view-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();
-
-				expect( actual ).toEqual( 'Editing template part: header' );
-			} );
-		} );
-	} );
-
-	describe( 'when a template part is selected from the navigation sidebar', () => {
-		it( "should display the selected template part's name in the document header", async () => {
-			// Navigate to a template part.
-			await visitSiteEditor( {
-				postId: 'emptytheme//header',
-				postType: 'wp_template_part',
-			} );
-
-			// Evaluate the document settings title.
-			const actual = await getDocumentSettingsTitle();
-
-			expect( actual ).toEqual( 'Editing template part: header' );
-		} );
-	} );
-} );