@wordpress/e2e-tests 7.19.0 → 7.20.0

package/specs/editor/various/invalid-block.test.js

@@ -1,100 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	clickMenuItem,
-	createNewPost,
-	clickBlockAppender,
-	clickBlockToolbarButton,
-	setPostContent,
-	canvas,
-} from '@wordpress/e2e-test-utils';
-
-describe( 'invalid blocks', () => {
-	beforeEach( async () => {
-		await createNewPost();
-	} );
-
-	it( 'Should show an invalid block message with clickable options', async () => {
-		// Create an empty paragraph with the focus in the block.
-		await clickBlockAppender();
-		await page.keyboard.type( 'hello' );
-
-		await clickBlockToolbarButton( 'Options' );
-
-		// Change to HTML mode and close the options.
-		await clickMenuItem( 'Edit as HTML' );
-
-		// Focus on the textarea and enter an invalid paragraph
-		await canvas().click(
-			'.block-editor-block-list__layout .block-editor-block-list__block .block-editor-block-list__block-html-textarea'
-		);
-		await page.keyboard.type( '<p>invalid paragraph' );
-
-		// Takes the focus away from the block so the invalid warning is triggered
-		await page.click( '.editor-post-save-draft' );
-
-		// Click on the 'three-dots' menu toggle.
-		await canvas().click(
-			'.block-editor-warning__actions button[aria-label="More options"]'
-		);
-
-		await clickMenuItem( 'Resolve' );
-
-		// Check we get the resolve modal with the appropriate contents.
-		const htmlBlockContent = await page.$eval(
-			'.block-editor-block-compare__html',
-			( node ) => node.textContent
-		);
-		expect( htmlBlockContent ).toEqual(
-			'<p>hello</p><p>invalid paragraph'
-		);
-	} );
-
-	it( 'should strip potentially malicious on* attributes', async () => {
-		let hasAlert = false;
-
-		page.on( 'dialog', () => {
-			hasAlert = true;
-		} );
-
-		// The paragraph block contains invalid HTML, which causes it to be an
-		// invalid block.
-		await setPostContent(
-			`
-			<!-- wp:paragraph -->
-			<p>aaaa <img src onerror=alert(1)></x dde></x>1
-			<!-- /wp:paragraph -->
-			`
-		);
-
-		// Give the browser time to show the alert.
-		await page.evaluate( () => new Promise( window.requestIdleCallback ) );
-
-		expect( console ).toHaveWarned();
-		expect( console ).toHaveErrored();
-		expect( hasAlert ).toBe( false );
-	} );
-
-	it( 'should not trigger malicious script tags when using a shortcode block', async () => {
-		let hasAlert = false;
-
-		page.on( 'dialog', () => {
-			hasAlert = true;
-		} );
-
-		// The shortcode block contains invalid HTML, which causes it to be an
-		// invalid block.
-		await setPostContent(
-			`
-			<!-- wp:shortcode -->
-			<animate onbegin=alert(1) attributeName=x dur=1s><script>alert("EVIL");</script><style>@keyframes x{}</style><a style="animation-name:x" onanimationstart="alert(2)"></a>
-			<!-- /wp:shortcode -->
-			`
-		);
-
-		// Give the browser time to show the alert.
-		await page.evaluate( () => new Promise( window.requestIdleCallback ) );
-		expect( hasAlert ).toBe( false );
-	} );
-} );

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

@@ -1,158 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	createNewPost,
-	clickOnMoreMenuItem,
-	canvas,
-} from '@wordpress/e2e-test-utils';
-
-describe( 'New User Experience (NUX)', () => {
-	it( 'should show the guide to first-time users', async () => {
-		let welcomeGuideText, welcomeGuide;
-
-		// Create a new post as a first-time user.
-		await createNewPost( { showWelcomeGuide: true } );
-
-		// Guide should be on page 1 of 4
-		welcomeGuideText = await page.$eval(
-			'.edit-post-welcome-guide',
-			( element ) => element.innerText
-		);
-		expect( welcomeGuideText ).toContain( 'Welcome to the block editor' );
-
-		// Click on the 'Next' button.
-		const [ nextButton ] = await page.$x(
-			'//button[contains(text(), "Next")]'
-		);
-		await nextButton.click();
-
-		// Guide should be on page 2 of 4
-		welcomeGuideText = await page.$eval(
-			'.edit-post-welcome-guide',
-			( element ) => element.innerText
-		);
-		expect( welcomeGuideText ).toContain( 'Make each block your own' );
-
-		// Click on the 'Previous' button.
-		const [ previousButton ] = await page.$x(
-			'//button[contains(text(), "Previous")]'
-		);
-		await previousButton.click();
-
-		// Guide should be on page 1 of 4
-		welcomeGuideText = await page.$eval(
-			'.edit-post-welcome-guide',
-			( element ) => element.innerText
-		);
-		expect( welcomeGuideText ).toContain( 'Welcome to the block editor' );
-
-		// Press the button for Page 2.
-		await page.click( 'button[aria-label="Page 2 of 4"]' );
-		await page.waitForXPath(
-			'//h1[contains(text(), "Make each block your own")]'
-		);
-		// This shouldn't be necessary
-		// eslint-disable-next-line no-restricted-syntax
-		await page.waitForTimeout( 500 );
-
-		// Press the right arrow key for Page 3.
-		await page.keyboard.press( 'ArrowRight' );
-		await page.waitForXPath(
-			'//h1[contains(text(), "Get to know the block library")]'
-		);
-
-		// Press the right arrow key for Page 4.
-		await page.keyboard.press( 'ArrowRight' );
-		await page.waitForXPath(
-			'//h1[contains(text(), "Learn how to use the block editor")]'
-		);
-
-		// Click on the *visible* 'Get started' button. There are two in the DOM
-		// but only one is shown depending on viewport size.
-		let getStartedButton;
-		for ( const buttonHandle of await page.$x(
-			'//button[contains(text(), "Get started")]'
-		) ) {
-			if (
-				await page.evaluate(
-					( button ) => button.style.display !== 'none',
-					buttonHandle
-				)
-			) {
-				getStartedButton = buttonHandle;
-			}
-		}
-		await getStartedButton.click();
-
-		// Guide should be closed
-		welcomeGuide = await page.$( '.edit-post-welcome-guide' );
-		expect( welcomeGuide ).toBeNull();
-
-		// Reload the editor.
-		await page.reload();
-		await page.waitForSelector( '.edit-post-layout' );
-
-		// Guide should be closed
-		welcomeGuide = await page.$( '.edit-post-welcome-guide' );
-		expect( welcomeGuide ).toBeNull();
-	} );
-
-	it( 'should not show the welcome guide again if it is dismissed', async () => {
-		let welcomeGuide;
-
-		// Create a new post as a first-time user.
-		await createNewPost( { showWelcomeGuide: true } );
-
-		// Guide should be open
-		welcomeGuide = await page.$( '.edit-post-welcome-guide' );
-		expect( welcomeGuide ).not.toBeNull();
-
-		// Close the guide
-		await page.click( '[role="dialog"] button[aria-label="Close"]' );
-
-		// Reload the editor.
-		await page.reload();
-		await page.waitForSelector( '.edit-post-layout' );
-
-		// Guide should be closed
-		welcomeGuide = await page.$( '.edit-post-welcome-guide' );
-		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( '[role="dialog"] button[aria-label="Close"]' );
-
-		// Focus should be in post title field.
-		const postTitle = await canvas().waitForSelector(
-			'h1[aria-label="Add title"'
-		);
-		await expect( postTitle ).toHaveFocus();
-	} );
-
-	it( 'should show the welcome guide if it is manually opened', async () => {
-		let welcomeGuide;
-
-		// Create a new post as a returning user.
-		await createNewPost();
-
-		// Guide should be closed
-		welcomeGuide = await page.$( '.edit-post-welcome-guide' );
-		expect( welcomeGuide ).toBeNull();
-
-		// Manually open the guide
-		await clickOnMoreMenuItem( 'Welcome Guide' );
-
-		// Guide should be open
-		welcomeGuide = await page.$( '.edit-post-welcome-guide' );
-		expect( welcomeGuide ).not.toBeNull();
-	} );
-} );

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

@@ -1,62 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { createNewPost } from '@wordpress/e2e-test-utils';
-
-describe( 'preferences', () => {
-	beforeAll( async () => {
-		await createNewPost();
-	} );
-
-	/**
-	 * Returns a promise which resolves to the text content of the active
-	 * editor sidebar tab, or null if there is no active sidebar tab (closed).
-	 *
-	 * @return {Promise} Promise resolving to active tab.
-	 */
-	async function getActiveSidebarTabText() {
-		try {
-			return await page.$eval(
-				'div[aria-label="Editor settings"] [role="tab"][aria-selected="true"]',
-				( node ) => node.textContent
-			);
-		} catch ( error ) {
-			// page.$eval throws when it does not find the selector, which we
-			// can intentionally intercept and consider as there being no
-			// active sidebar tab (no sidebar).
-			return null;
-		}
-	}
-
-	it( 'remembers sidebar dismissal between sessions', async () => {
-		const blockTab = await page.waitForXPath(
-			`//button[@role="tab"][contains(text(), 'Block')]`
-		);
-
-		// Open by default.
-		expect( await getActiveSidebarTabText() ).toBe( 'Post' );
-
-		// Change to "Block" tab.
-		await blockTab.click();
-		expect( await getActiveSidebarTabText() ).toBe( 'Block' );
-
-		// Regression test: Reload resets to document tab.
-		//
-		// See: https://github.com/WordPress/gutenberg/issues/6377
-		// See: https://github.com/WordPress/gutenberg/pull/8995
-		await page.reload();
-		await page.waitForSelector( '.edit-post-layout' );
-		expect( await getActiveSidebarTabText() ).toBe( 'Post' );
-
-		// Dismiss.
-		await page.click(
-			'div[aria-label="Editor settings"] div[role="tablist"] + button[aria-label="Close Settings"]'
-		);
-		expect( await getActiveSidebarTabText() ).toBe( null );
-
-		// Remember after reload.
-		await page.reload();
-		await page.waitForSelector( '.edit-post-layout' );
-		expect( await getActiveSidebarTabText() ).toBe( null );
-	} );
-} );

package/specs/editor/various/publish-panel.test.js

@@ -1,82 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	arePrePublishChecksEnabled,
-	disablePrePublishChecks,
-	enablePrePublishChecks,
-	createNewPost,
-	openPublishPanel,
-	pressKeyWithModifier,
-	publishPost,
-	canvas,
-} from '@wordpress/e2e-test-utils';
-
-describe( 'PostPublishPanel', () => {
-	let werePrePublishChecksEnabled;
-	beforeEach( async () => {
-		await createNewPost();
-		werePrePublishChecksEnabled = await arePrePublishChecksEnabled();
-		if ( ! werePrePublishChecksEnabled ) {
-			await enablePrePublishChecks();
-		}
-	} );
-
-	afterEach( async () => {
-		if ( ! werePrePublishChecksEnabled ) {
-			await disablePrePublishChecks();
-		}
-	} );
-
-	it( 'PrePublish: publish button should have the focus', async () => {
-		await canvas().type( '.editor-post-title__input', 'E2E Test Post' );
-		await openPublishPanel();
-
-		const focusedElementClassList = await page.$eval(
-			':focus',
-			( focusedElement ) => {
-				return Object.values( focusedElement.classList );
-			}
-		);
-		expect( focusedElementClassList ).toContain(
-			'editor-post-publish-button'
-		);
-	} );
-
-	it( 'PostPublish: post link should have the focus', async () => {
-		const postTitle = 'E2E Test Post';
-		await canvas().type( '.editor-post-title__input', postTitle );
-		await publishPost();
-
-		const focusedElementTag = await page.$eval(
-			':focus',
-			( focusedElement ) => {
-				return focusedElement.tagName.toLowerCase();
-			}
-		);
-		const focusedElementText = await page.$eval(
-			':focus',
-			( focusedElement ) => {
-				return focusedElement.text;
-			}
-		);
-		expect( focusedElementTag ).toBe( 'a' );
-		expect( focusedElementText ).toBe( postTitle );
-	} );
-
-	it( 'should retain focus within the panel', async () => {
-		await canvas().type( '.editor-post-title__input', 'E2E Test Post' );
-		await openPublishPanel();
-		await pressKeyWithModifier( 'shift', 'Tab' );
-
-		const focusedElementClassList = await page.$eval(
-			':focus',
-			( focusedElement ) => {
-				return Object.values( focusedElement.classList );
-			}
-		);
-		expect( focusedElementClassList ).toContain(
-			'components-checkbox-control__input'
-		);
-	} );
-} );

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

@@ -1,176 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	createNewPost,
-	publishPost,
-	publishPostWithPrePublishChecksDisabled,
-	enablePrePublishChecks,
-	disablePrePublishChecks,
-	arePrePublishChecksEnabled,
-	setBrowserViewport,
-	openPublishPanel,
-	pressKeyWithModifier,
-	canvas,
-} from '@wordpress/e2e-test-utils';
-
-describe( 'Publishing', () => {
-	describe.each( [ 'post', 'page' ] )(
-		'%s locking prevent saving',
-		( postType ) => {
-			beforeEach( async () => {
-				await createNewPost( postType );
-			} );
-
-			it( `disables the publish button when a ${ postType } is locked`, async () => {
-				await canvas().type(
-					'.editor-post-title__input',
-					'E2E Test Post lock check publish button'
-				);
-				await page.evaluate( () =>
-					wp.data
-						.dispatch( 'core/editor' )
-						.lockPostSaving( 'futurelock' )
-				);
-
-				await openPublishPanel();
-
-				expect(
-					await page.$(
-						'.editor-post-publish-button[aria-disabled="true"]'
-					)
-				).not.toBeNull();
-			} );
-
-			it( `disables the save shortcut when a ${ postType } is locked`, async () => {
-				await canvas().type(
-					'.editor-post-title__input',
-					'E2E Test Post check save shortcut'
-				);
-				await page.evaluate( () =>
-					wp.data
-						.dispatch( 'core/editor' )
-						.lockPostSaving( 'futurelock' )
-				);
-				await pressKeyWithModifier( 'primary', 'S' );
-
-				expect( await page.$( '.editor-post-saved-state' ) ).toBeNull();
-				expect(
-					await page.$( '.editor-post-save-draft' )
-				).not.toBeNull();
-			} );
-		}
-	);
-
-	describe.each( [ 'post', 'page' ] )( 'a %s', ( postType ) => {
-		let werePrePublishChecksEnabled;
-
-		beforeEach( async () => {
-			await createNewPost( postType );
-			werePrePublishChecksEnabled = await arePrePublishChecksEnabled();
-			if ( ! werePrePublishChecksEnabled ) {
-				await enablePrePublishChecks();
-			}
-		} );
-
-		afterEach( async () => {
-			if ( ! werePrePublishChecksEnabled ) {
-				await disablePrePublishChecks();
-			}
-		} );
-
-		it( `should publish the ${ postType } and close the panel once we start editing again.`, async () => {
-			await canvas().type( '.editor-post-title__input', 'E2E Test Post' );
-
-			await publishPost();
-
-			// The post-publishing panel is visible.
-			expect(
-				await page.$( '.editor-post-publish-panel' )
-			).not.toBeNull();
-
-			// Start editing again.
-			await canvas().type( '.editor-post-title__input', ' (Updated)' );
-
-			// The post-publishing panel is not visible anymore.
-			expect( await page.$( '.editor-post-publish-panel' ) ).toBeNull();
-		} );
-	} );
-
-	describe.each( [ 'post', 'page' ] )(
-		'a %s with pre-publish checks disabled',
-		( postType ) => {
-			let werePrePublishChecksEnabled;
-
-			beforeEach( async () => {
-				await createNewPost( postType );
-				werePrePublishChecksEnabled =
-					await arePrePublishChecksEnabled();
-				if ( werePrePublishChecksEnabled ) {
-					await disablePrePublishChecks();
-				}
-			} );
-
-			afterEach( async () => {
-				if ( werePrePublishChecksEnabled ) {
-					await enablePrePublishChecks();
-				}
-			} );
-
-			it( `should publish the ${ postType } without opening the post-publish sidebar.`, async () => {
-				await canvas().type(
-					'.editor-post-title__input',
-					'E2E Test Post'
-				);
-
-				// The "Publish" button should be shown instead of the "Publish..." toggle.
-				expect(
-					await page.$( '.editor-post-publish-panel__toggle' )
-				).toBeNull();
-				expect(
-					await page.$( '.editor-post-publish-button' )
-				).not.toBeNull();
-
-				await publishPostWithPrePublishChecksDisabled();
-
-				// The post-publishing panel should have been not shown.
-				expect(
-					await page.$( '.editor-post-publish-panel' )
-				).toBeNull();
-			} );
-		}
-	);
-
-	describe.each( [ 'post', 'page' ] )(
-		'a %s in small viewports',
-		( postType ) => {
-			let werePrePublishChecksEnabled;
-
-			beforeEach( async () => {
-				await createNewPost( postType );
-				werePrePublishChecksEnabled =
-					await arePrePublishChecksEnabled();
-				if ( werePrePublishChecksEnabled ) {
-					await disablePrePublishChecks();
-				}
-				await setBrowserViewport( 'small' );
-			} );
-
-			afterEach( async () => {
-				await setBrowserViewport( 'large' );
-				if ( werePrePublishChecksEnabled ) {
-					await enablePrePublishChecks();
-				}
-			} );
-
-			it( `should ignore the pre-publish checks and show the Publish... toggle instead of the Publish button`, async () => {
-				expect(
-					await page.$( '.editor-post-publish-panel__toggle' )
-				).not.toBeNull();
-				expect(
-					await page.$( '.editor-post-publish-button' )
-				).toBeNull();
-			} );
-		}
-	);
-} );

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

@@ -1,65 +0,0 @@
-/**
- * WordPress dependencies
- */
-import { createNewPost, changeSiteTimezone } from '@wordpress/e2e-test-utils';
-
-async function getPublishButtonText() {
-	return page.$eval(
-		'.editor-post-publish-button__button',
-		( element ) => element.textContent
-	);
-}
-
-describe( 'Scheduling', () => {
-	const isDateTimeComponentFocused = () => {
-		return page.evaluate( () => {
-			const dateTimeElement = document.querySelector(
-				'.components-datetime__date'
-			);
-			if ( ! dateTimeElement || ! document.activeElement ) {
-				return false;
-			}
-			return dateTimeElement.contains( document.activeElement );
-		} );
-	};
-
-	describe.each( [ [ 'UTC-10' ], [ 'UTC' ], [ 'UTC+10' ] ] )(
-		`Timezone %s`,
-		( timezone ) => {
-			let oldTimezone;
-			beforeEach( async () => {
-				oldTimezone = await changeSiteTimezone( timezone );
-				await createNewPost();
-			} );
-			afterEach( async () => {
-				await changeSiteTimezone( oldTimezone );
-			} );
-
-			it( `should change publishing button text from "Publish" to "Schedule"`, async () => {
-				expect( await getPublishButtonText() ).toBe( 'Publish' );
-
-				// Open the datepicker.
-				await page.click( '*[aria-label^="Change date"]' );
-
-				// Change the publishing date to a year in the future.
-				await page.click( '.components-datetime__time-field-year' );
-				await page.keyboard.press( 'ArrowUp' );
-
-				// Close the datepicker.
-				await page.click( '.editor-post-schedule__dialog-toggle' );
-
-				expect( await getPublishButtonText() ).toBe( 'Schedule…' );
-			} );
-		}
-	);
-
-	it( 'Should keep date time UI focused when the previous and next month buttons are clicked', async () => {
-		await createNewPost();
-
-		await page.click( '*[aria-label^="Change date"]' );
-		await page.click( '*[aria-label="View previous month"]' );
-		expect( await isDateTimeComponentFocused() ).toBe( true );
-		await page.click( '*[aria-label="View next month"]' );
-		expect( await isDateTimeComponentFocused() ).toBe( true );
-	} );
-} );