@wordpress/e2e-tests 4.9.1 → 5.0.1-next.957ca95e4c.0

package/specs/editor/various/multi-block-selection.test.js

@@ -331,6 +331,9 @@ describe( 'Multi-block selection', () => {
 		await page.keyboard.up( 'Shift' );
 		await transformBlockTo( 'Group' );
 
+		// Confirm setup.
+		expect( await getEditedPostContent() ).toMatchSnapshot();
+
 		// Click the first paragraph in the first Group block while pressing `shift` key.
 		const firstParagraph = await page.waitForXPath( "//p[text()='first']" );
 		await page.keyboard.down( 'Shift' );
@@ -356,7 +359,7 @@ describe( 'Multi-block selection', () => {
 		await page.mouse.up();
 		await page.keyboard.type( 'hi' );
 		expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-		"<!-- wp:group -->
+		"<!-- wp:group {\\"layout\\":{\\"type\\":\\"constrained\\"}} -->
 		<div class=\\"wp-block-group\\"><!-- wp:paragraph -->
 		<p>hih text in group</p>
 		<!-- /wp:paragraph --></div>
@@ -676,6 +679,10 @@ describe( 'Multi-block selection', () => {
 
 		await pressKeyWithModifier( 'primary', 'a' );
 
+		await page.waitForSelector( '[data-type="core/column"].is-selected' );
+
+		await pressKeyWithModifier( 'primary', 'a' );
+
 		await page.waitForSelector(
 			'[data-type="core/column"].is-multi-selected'
 		);
@@ -699,6 +706,7 @@ describe( 'Multi-block selection', () => {
 		// Confirm correct setup: a paragraph and a list.
 		expect( await getEditedPostContent() ).toMatchSnapshot();
 
+		await pressKeyWithModifier( 'primary', 'a' );
 		await pressKeyWithModifier( 'primary', 'a' );
 		await pressKeyWithModifier( 'primary', 'a' );
 
@@ -907,11 +915,16 @@ describe( 'Multi-block selection', () => {
 
 	it( 'should select separator (single element block)', async () => {
 		await clickBlockAppender();
-		await page.keyboard.type( '/hr' );
+		await page.keyboard.type( 'a' );
 		await page.keyboard.press( 'Enter' );
 		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( 'a' );
-		await pressKeyWithModifier( 'shift', 'ArrowUp' );
+		await page.keyboard.type( '/hr' );
+		await page.keyboard.press( 'Enter' );
+		await page.keyboard.press( 'ArrowUp' );
+		await page.keyboard.press( 'ArrowUp' );
+		await page.keyboard.press( 'ArrowRight' );
+		await pressKeyWithModifier( 'shift', 'ArrowDown' );
+		await pressKeyWithModifier( 'shift', 'ArrowDown' );
 
 		// Test setup.
 		expect( await getEditedPostContent() ).toMatchSnapshot();
@@ -921,7 +934,7 @@ describe( 'Multi-block selection', () => {
 		// Ensure selection is in the correct place.
 		await page.keyboard.type( '&' );
 
-		// Expect two blocks with "&" in between.
+		// Expect a paragraph with "&".
 		expect( await getEditedPostContent() ).toMatchSnapshot();
 	} );
 
@@ -996,4 +1009,22 @@ describe( 'Multi-block selection', () => {
 			expect( selectedBlocks.length ).toBe( 2 );
 		} );
 	} );
+
+	it( 'should select by dragging into separator', async () => {
+		await clickBlockAppender();
+		await page.keyboard.type( '1' );
+		await insertBlock( 'Separator' );
+		await page.keyboard.press( 'ArrowUp' );
+
+		const [ paragraph, hr ] = await page.$$( '[data-type]' );
+		const coord1 = await paragraph.clickablePoint();
+		const coord2 = await hr.clickablePoint();
+
+		await page.mouse.move( coord1.x, coord1.y );
+		await page.mouse.down();
+		await page.mouse.move( coord2.x, coord2.y, { steps: 10 } );
+		await page.mouse.up();
+
+		expect( await getSelectedFlatIndices() ).toEqual( [ 1, 2 ] );
+	} );
 } );

package/specs/editor/various/post-visibility.test.js

@@ -91,12 +91,10 @@ describe( 'Post visibility', () => {
 
 		// Set a publish date for the next month.
 		await page.click( '*[aria-label^="Change date"]' );
-		await page.click(
-			'*[aria-label="Move forward to switch to the next month."]'
-		);
+		await page.click( '*[aria-label="View next month"]' );
 		await (
 			await page.$x(
-				'//*[@role="application"][@aria-label="Calendar"]//td[@role="button"]/*[text() = "15"]'
+				'//*[@role="application"][@aria-label="Calendar"]//button[text()="15"]'
 			)
 		 )[ 0 ].click();
 

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

@@ -473,15 +473,18 @@ describe( 'RichText', () => {
 		await page.keyboard.press( 'Enter' );
 		await page.keyboard.type( ' 2' );
 
-		// Select all and copy.
+		// Select all text.
+		await pressKeyWithModifier( 'primary', 'a' );
+		// Select the nested list.
+		await pressKeyWithModifier( 'primary', 'a' );
+		// Select the parent list item.
+		await pressKeyWithModifier( 'primary', 'a' );
+		// Select all the parent list item text.
+		await pressKeyWithModifier( 'primary', 'a' );
+		// Select the entire list.
 		await pressKeyWithModifier( 'primary', 'a' );
 		await pressKeyWithModifier( 'primary', 'c' );
 
-		// Collapse the selection to the end.
-		await page.keyboard.press( 'ArrowRight' );
-
-		// Create a paragraph.
-		await page.keyboard.press( 'Enter' );
 		await page.keyboard.press( 'Enter' );
 
 		// Paste paragraph contents.

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

@@ -57,13 +57,9 @@ describe( 'Scheduling', () => {
 		await createNewPost();
 
 		await page.click( '*[aria-label^="Change date"]' );
-		await page.click(
-			'*[aria-label="Move backward to switch to the previous month."]'
-		);
+		await page.click( '*[aria-label="View previous month"]' );
 		expect( await isDateTimeComponentFocused() ).toBe( true );
-		await page.click(
-			'*[aria-label="Move forward to switch to the next month."]'
-		);
+		await page.click( '*[aria-label="View next month"]' );
 		expect( await isDateTimeComponentFocused() ).toBe( true );
 	} );
 } );

package/specs/editor/various/splitting-merging.test.js

@@ -235,7 +235,7 @@ describe( 'splitting and merging blocks', () => {
 			await page.keyboard.type( 'item 1' );
 			await page.keyboard.press( 'Enter' );
 			await page.keyboard.type( 'item 2' );
-			await pressKeyTimes( 'ArrowUp', 2 );
+			await pressKeyTimes( 'ArrowUp', 5 );
 			await page.keyboard.press( 'Delete' );
 			// Carret should be in the first block and at the proper position.
 			await page.keyboard.type( '-' );
@@ -257,13 +257,18 @@ describe( 'splitting and merging blocks', () => {
 			await page.keyboard.press( 'Enter' );
 			await page.keyboard.type( 'item 2' );
 			await page.keyboard.press( 'ArrowUp' );
+			await page.keyboard.press( 'ArrowUp' );
 			await pressKeyTimes( 'ArrowLeft', 6 );
 			await page.keyboard.press( 'Backspace' );
 			// Carret should be in the first block and at the proper position.
 			await page.keyboard.type( '-' );
 			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
 			"<!-- wp:paragraph -->
-			<p>hi-item 1</p>
+			<p>hi</p>
+			<!-- /wp:paragraph -->
+
+			<!-- wp:paragraph -->
+			<p>-item 1</p>
 			<!-- /wp:paragraph -->
 
 			<!-- wp:paragraph -->

package/specs/editor/various/switch-to-draft.test.js

@@ -62,13 +62,11 @@ async function scheduleTestPost( postType, viewport ) {
 	}
 	// Set a publish date for the next month.
 	await page.click( '.edit-post-post-schedule__toggle' );
-	await page.click(
-		'*[aria-label="Move forward to switch to the next month."]'
-	);
+	await page.click( '*[aria-label="View next month"]' );
 
 	await (
 		await page.$x(
-			'//*[@role="application"][@aria-label="Calendar"]//td[@role="button"]/*[text() = "15"]'
+			'//*[@role="application"][@aria-label="Calendar"]//button[text()="15"]'
 		)
 	 )[ 0 ].click();
 

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

@@ -86,7 +86,8 @@ describe( 'Toolbar roving tabindex', () => {
 	it( 'ensures list block toolbar uses roving tabindex', async () => {
 		await insertBlock( 'List' );
 		await page.keyboard.type( 'List' );
-		await testBlockToolbarKeyboardNavigation( 'Block: List', 'List' );
+		await testBlockToolbarKeyboardNavigation( 'List text', 'Select List' );
+		await page.click( `[aria-label="Select List"]` );
 		await wrapCurrentBlockWithGroup( 'List' );
 		await testGroupKeyboardNavigation( 'Block: List', 'List' );
 	} );

package/specs/editor/various/writing-flow.test.js

@@ -570,21 +570,25 @@ describe( 'Writing Flow', () => {
 		expect( await getEditedPostContent() ).toMatchSnapshot();
 	} );
 
-	it( 'should allow selecting entire list with longer last item', async () => {
+	it( 'should extend selection into paragraph for list with longer last item', async () => {
 		await page.keyboard.press( 'Enter' );
 		await page.keyboard.type( 'a' );
 		await page.keyboard.press( 'Enter' );
 		await page.keyboard.type( '* b' );
 		await page.keyboard.press( 'Enter' );
 		await page.keyboard.type( 'cd' );
+
+		// Selects part of the first list item, although invisible.
 		await pressKeyWithModifier( 'shift', 'ArrowUp' );
+		await page.evaluate( () => new Promise( window.requestIdleCallback ) );
+		// Extends selection into the first paragraph
 		await pressKeyWithModifier( 'shift', 'ArrowUp' );
+		await page.evaluate( () => new Promise( window.requestIdleCallback ) );
 
-		// Ensure multi selection is not triggered and selection stays within
-		// the list.
+		// Mixed selection, so all content will be removed.
 		await page.keyboard.press( 'Backspace' );
 
-		expect( await getEditedPostContent() ).toMatchSnapshot();
+		expect( await getEditedPostContent() ).toBe( '' );
 	} );
 
 	it( 'should not have a dead zone between blocks (lower)', async () => {

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

@@ -157,9 +157,9 @@ describe( 'Post Editor Performance', () => {
 		await page.evaluate( () => {
 			const { createBlock } = window.wp.blocks;
 			const { dispatch } = window.wp.data;
-			const blocks = window.lodash
-				.times( 1000 )
-				.map( () => createBlock( 'core/paragraph' ) );
+			const blocks = Array.from( { length: 1000 } ).map( () =>
+				createBlock( 'core/paragraph' )
+			);
 			dispatch( 'core/block-editor' ).resetBlocks( blocks );
 		} );
 		const paragraphs = await page.$$( '.wp-block' );

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

@@ -36,7 +36,8 @@ describe( 'Global styles sidebar', () => {
 			const results = await page.$$(
 				'.edit-site-block-types-item-list div[role="listitem"]'
 			);
-			expect( results.length ).toEqual( 1 );
+			// Matches both Heading and Table of Contents blocks. (The latter contains "heading" in its description.)
+			expect( results.length ).toEqual( 2 );
 		} );
 	} );
 } );

package/specs/editor/plugins/register-block-type-hooks.test.js

@@ -1,32 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	activatePlugin,
-	createNewPost,
-	deactivatePlugin,
-	openGlobalBlockInserter,
-} from '@wordpress/e2e-test-utils';
-
-describe( 'Register block type hooks', () => {
-	beforeEach( async () => {
-		await activatePlugin( 'gutenberg-test-register-block-type-hooks' );
-		await createNewPost();
-	} );
-
-	afterEach( async () => {
-		await deactivatePlugin( 'gutenberg-test-register-block-type-hooks' );
-	} );
-
-	it( 'has a custom category for Paragraph block', async () => {
-		await openGlobalBlockInserter();
-
-		const widgetsCategory = await page.waitForSelector(
-			'.block-editor-block-types-list[aria-label="Widgets"]'
-		);
-
-		expect(
-			await widgetsCategory.$( '.editor-block-list-item-paragraph' )
-		).toBeDefined();
-	} );
-} );

package/specs/editor/plugins/wp-editor-meta-box.test.js

@@ -1,58 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	activatePlugin,
-	createNewPost,
-	deactivatePlugin,
-	publishPost,
-} from '@wordpress/e2e-test-utils';
-
-describe( 'WP Editor Meta Boxes', () => {
-	beforeAll( async () => {
-		await activatePlugin( 'gutenberg-test-plugin-wp-editor-meta-box' );
-		await createNewPost();
-	} );
-
-	afterAll( async () => {
-		await deactivatePlugin( 'gutenberg-test-plugin-wp-editor-meta-box' );
-	} );
-
-	it( 'Should save the changes', async () => {
-		// Add title to enable valid non-empty post save.
-		await page.type( '.editor-post-title__input', 'Hello Meta' );
-
-		// Type something.
-		await expect( page ).toClick( '#test_tinymce_id-html' );
-		await page.type( '#test_tinymce_id', 'Typing in a metabox' );
-		await page.click( '#test_tinymce_id-tmce' );
-
-		await publishPost();
-
-		await page.reload();
-		await page.waitForSelector( '.edit-post-layout' );
-
-		await expect( page ).toClick( '#test_tinymce_id-html' );
-		await page.waitForSelector( '#test_tinymce_id' );
-		const content = await page.$eval(
-			'#test_tinymce_id',
-			( textarea ) => textarea.value
-		);
-
-		/*
-		 * `content` may or may not contain the <p> tags depending on hasWpautop value in this line:
-		 * https://github.com/WordPress/wordpress-develop/blob/2382765afa36e10bf3c74420024ad4e85763a47c/src/js/_enqueues/vendor/tinymce/plugins/wordpress/plugin.js#L15
-		 *
-		 * Now, for the purposes of this e2e test we explicitly set wpautop to true in the test plugin:
-		 * https://github.com/WordPress/gutenberg/blob/3da717b8d0ac7d7821fc6d0475695ccf3ae2829f/packages/e2e-tests/plugins/wp-editor-metabox.php#L36
-		 *
-		 * If this test randomly fails because of the actual value being wrapped in <p> like <p>Typing in a metabox</p>, it means that
-		 * hasWpautop has been errorneously set to false in the line above. You may want to check:
-		 * * Is window.wp.editor.autop a function? It should be one since https://github.com/WordPress/gutenberg/pull/33228
-		 * * Is wpautop still true in the second link mentioned in this comment?
-		 *
-		 * For more context, see https://github.com/WordPress/gutenberg/pull/33228/files#r666897885
-		 */
-		expect( content ).toBe( 'Typing in a metabox' );
-	} );
-} );

package/specs/editor/various/__snapshots__/duplicating-blocks.test.js.snap

@@ -1,21 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Duplicating blocks should duplicate blocks using the block settings menu 1`] = `
-"<!-- wp:paragraph -->
-<p>Clone me</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:paragraph -->
-<p>Clone me</p>
-<!-- /wp:paragraph -->"
-`;
-
-exports[`Duplicating blocks should duplicate blocks using the keyboard shortcut 1`] = `
-"<!-- wp:paragraph -->
-<p>Clone me</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:paragraph -->
-<p>Clone me</p>
-<!-- /wp:paragraph -->"
-`;

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

@@ -1,47 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	clickMenuItem,
-	createNewPost,
-	insertBlock,
-	getEditedPostContent,
-	clickBlockToolbarButton,
-	pressKeyWithModifier,
-} from '@wordpress/e2e-test-utils';
-
-describe( 'Duplicating blocks', () => {
-	beforeEach( async () => {
-		await createNewPost();
-	} );
-
-	it( 'should duplicate blocks using the block settings menu', async () => {
-		await insertBlock( 'Paragraph' );
-		await page.keyboard.type( 'Clone me' );
-
-		// Select the test we just typed
-		// This doesn't do anything but we previously had a duplicationi bug
-		// When the selection was not collapsed.
-		await pressKeyWithModifier( 'primary', 'a' );
-
-		await clickBlockToolbarButton( 'Options' );
-		await clickMenuItem( 'Duplicate' );
-
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	it( 'should duplicate blocks using the keyboard shortcut', async () => {
-		await insertBlock( 'Paragraph' );
-		await page.keyboard.type( 'Clone me' );
-
-		// Select the test we just typed
-		// This doesn't do anything but we previously had a duplicationi bug
-		// When the selection was not collapsed.
-		await pressKeyWithModifier( 'primary', 'a' );
-
-		// Duplicate using the keyboard shortccut.
-		await pressKeyWithModifier( 'primaryShift', 'd' );
-
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-} );