@wordpress/e2e-tests 2.5.0 → 2.5.1

package/specs/experiments/template-revert.test.js

@@ -67,7 +67,7 @@ const save = async () => {
 
 const revertTemplate = async () => {
 	await page.click( '.edit-site-document-actions__get-info' );
-	await page.click( '.edit-site-template-details__revert button' );
+	await page.click( '.edit-site-template-details__revert-button' );
 	await waitForNotice();
 	await assertSaveButtonIsEnabled();
 };

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

@@ -114,24 +114,9 @@ describe( 'Site Editor Performance', () => {
 			keyUpEvents,
 		] = getTypingEventDurations( traceResults );
 
-		// Both keydown and keypress events are bubbled from the iframe to the
-		// main frame, which must be ignored. These will be the odd values in
-		// the array.
-		const _keyDownEvents = keyDownEvents.filter(
-			( v, ii ) => ii % 2 === 0
-		);
-		const _keyPressEvents = keyPressEvents.filter(
-			( v, ii ) => ii % 2 === 0
-		);
-
-		expect(
-			_keyDownEvents.length === _keyPressEvents.length &&
-				_keyPressEvents.length === keyUpEvents.length
-		).toBe( true );
-
-		for ( let j = 0; j < _keyDownEvents.length; j++ ) {
+		for ( let j = 0; j < keyDownEvents.length; j++ ) {
 			results.type.push(
-				_keyDownEvents[ j ] + _keyPressEvents[ j ] + keyUpEvents[ j ]
+				keyDownEvents[ j ] + keyPressEvents[ j ] + keyUpEvents[ j ]
 			);
 		}
 

package/specs/widgets/customizing-widgets.test.js

@@ -16,7 +16,8 @@ import {
  * External dependencies
  */
 // eslint-disable-next-line no-restricted-imports
-import { find } from 'puppeteer-testing-library';
+import { find, findAll } from 'puppeteer-testing-library';
+import { first } from 'lodash';
 
 const twentyTwentyError = `Stylesheet twentytwenty-block-editor-styles-css was not properly added.
 For blocks, use the block API's style (https://developer.wordpress.org/block-editor/reference-guides/block-api/block-metadata/#style) or editorStyle (https://developer.wordpress.org/block-editor/reference-guides/block-api/block-metadata/#editor-style).
@@ -763,6 +764,98 @@ describe( 'Widgets Customizer', () => {
 
 		expect( console ).toHaveErrored( twentyTwentyError );
 	} );
+
+	it( 'should not render Block Settings sections', async () => {
+		// We add Block Settings as a section, but it shouldn't display to
+		// the user as a section on the main menu. It's simply how we
+		// integrate the G sidebar inside the customizer.
+		const findAllBlockSettingsHeader = findAll(
+			{
+				role: 'heading',
+				name: /Block Settings/,
+				level: 3,
+			},
+			{ timeout: 0 }
+		);
+		await expect( findAllBlockSettingsHeader ).toThrowQueryEmptyError();
+	} );
+
+	it( 'should stay in block settings after making a change in that area', async () => {
+		// Open footer block widgets
+		const widgetsPanel = await find( {
+			role: 'heading',
+			name: /Widgets/,
+			level: 3,
+		} );
+		await widgetsPanel.click();
+
+		const footer1Section = await find( {
+			role: 'heading',
+			name: /^Footer #1/,
+			level: 3,
+		} );
+		await footer1Section.click();
+
+		// Add a block to make the publish button active.
+		await addBlock( 'Paragraph' );
+		await page.keyboard.type( 'First Paragraph' );
+
+		await waitForPreviewIframe();
+
+		// Click Publish
+		const publishButton = await find( {
+			role: 'button',
+			name: 'Publish',
+		} );
+		await publishButton.click();
+
+		// Wait for publishing to finish.
+		await page.waitForResponse( createURL( '/wp-admin/admin-ajax.php' ) );
+		await expect( publishButton ).toMatchQuery( {
+			disabled: true,
+		} );
+
+		// Select the paragraph block
+		const paragraphBlock = await find( {
+			role: 'document',
+			name: 'Paragraph block',
+		} );
+		await paragraphBlock.focus();
+
+		// Click the three dots button, then click "Show More Settings".
+		await showBlockToolbar();
+		await clickBlockToolbarButton( 'Options' );
+		const showMoreSettingsButton = await find( {
+			role: 'menuitem',
+			name: 'Show more settings',
+		} );
+		await showMoreSettingsButton.click();
+
+		// Change font size (Any change made in this section is sufficient; not required to be font size)
+		const CUSTOM_FONT_SIZE_LABEL_SELECTOR =
+			"//fieldset[legend[contains(text(),'Font size')]]//label[contains(text(), 'Custom')]";
+		await first( await page.$x( CUSTOM_FONT_SIZE_LABEL_SELECTOR ) ).click();
+		await page.keyboard.type( '23' );
+		await page.keyboard.press( 'Enter' );
+
+		// Now that we've made a change:
+		// (1) Publish button should be active
+		// (2) We should still be in the "Block Settings" area
+		await find( {
+			role: 'button',
+			name: 'Publish',
+		} );
+
+		// This fails on 539cea09 and earlier; we get kicked back to the widgets area.
+		// We expect to stay in block settings.
+		await find( {
+			role: 'heading',
+			name: 'Customizing ▸ Widgets ▸ Footer #1 Block Settings',
+			level: 3,
+		} );
+
+		expect( console ).toHaveErrored( twentyTwentyError );
+	} );
 } );
 
 /**

package/specs/widgets/editing-widgets.test.js

@@ -822,6 +822,8 @@ describe( 'Widgets screen', () => {
 		// Delete the last block and save again.
 		await pressKeyWithModifier( 'access', 'z' );
 		await saveWidgets();
+		// To do: clicking on the Snackbar causes focus loss.
+		await page.focus( '.block-editor-writing-flow' );
 
 		// Undo block deletion and save again
 		await pressKeyWithModifier( 'primary', 'z' );
@@ -889,6 +891,10 @@ async function saveWidgets() {
 	// Close the snackbar.
 	const savedSnackbar = await find( savedSnackbarQuery );
 	await savedSnackbar.click();
+	// Expect focus not to be lost.
+	await expect(
+		await page.evaluate( () => document.activeElement.className )
+	).toBe( 'components-snackbar-list edit-widgets-notices__snackbar' );
 	await expect( savedSnackbarQuery ).not.toBeFound();
 }