@wordpress/e2e-tests 6.0.0 → 6.1.0

package/specs/editor/blocks/__snapshots__/quote.test.js.snap

@@ -1,123 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Quote can be converted to a pullquote 1`] = `
-"<!-- wp:pullquote -->
-<figure class=\\"wp-block-pullquote\\"><blockquote><p>one<br>two</p><cite>cite</cite></blockquote></figure>
-<!-- /wp:pullquote -->"
-`;
-
-exports[`Quote can be converted to paragraphs and renders a paragraph for the cite, if it exists 1`] = `
-"<!-- wp:paragraph -->
-<p>one</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:paragraph -->
-<p>two</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:paragraph -->
-<p>cite</p>
-<!-- /wp:paragraph -->"
-`;
-
-exports[`Quote can be converted to paragraphs and renders a void paragraph if both the cite and quote are void 1`] = `""`;
-
-exports[`Quote can be converted to paragraphs and renders one paragraph block per <p> within quote 1`] = `
-"<!-- wp:paragraph -->
-<p>one</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:paragraph -->
-<p>two</p>
-<!-- /wp:paragraph -->"
-`;
-
-exports[`Quote can be converted to paragraphs and renders only one paragraph for the cite, if the quote is void 1`] = `
-"<!-- wp:paragraph -->
-<p></p>
-<!-- /wp:paragraph -->
-
-<!-- wp:paragraph -->
-<p>cite</p>
-<!-- /wp:paragraph -->"
-`;
-
-exports[`Quote can be created by converting a heading 1`] = `
-"<!-- wp:quote -->
-<blockquote class=\\"wp-block-quote\\"><!-- wp:heading -->
-<h2 class=\\"wp-block-heading\\">test</h2>
-<!-- /wp:heading --></blockquote>
-<!-- /wp:quote -->"
-`;
-
-exports[`Quote can be created by converting a paragraph 1`] = `
-"<!-- wp:quote -->
-<blockquote class=\\"wp-block-quote\\"><!-- wp:paragraph -->
-<p>test</p>
-<!-- /wp:paragraph --></blockquote>
-<!-- /wp:quote -->"
-`;
-
-exports[`Quote can be created by converting multiple paragraphs 1`] = `
-"<!-- wp:quote -->
-<blockquote class=\\"wp-block-quote\\"><!-- wp:paragraph -->
-<p>one</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:paragraph -->
-<p>two</p>
-<!-- /wp:paragraph --></blockquote>
-<!-- /wp:quote -->"
-`;
-
-exports[`Quote can be created by typing "/quote" 1`] = `
-"<!-- wp:quote -->
-<blockquote class=\\"wp-block-quote\\"><!-- wp:paragraph -->
-<p>I’m a quote</p>
-<!-- /wp:paragraph --></blockquote>
-<!-- /wp:quote -->"
-`;
-
-exports[`Quote can be created by typing > in front of text of a paragraph block 1`] = `
-"<!-- wp:quote -->
-<blockquote class=\\"wp-block-quote\\"><!-- wp:paragraph -->
-<p>test</p>
-<!-- /wp:paragraph --></blockquote>
-<!-- /wp:quote -->"
-`;
-
-exports[`Quote can be created by using > at the start of a paragraph block 1`] = `
-"<!-- wp:quote -->
-<blockquote class=\\"wp-block-quote\\"><!-- wp:paragraph -->
-<p>A quote</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:paragraph -->
-<p>Another paragraph</p>
-<!-- /wp:paragraph --></blockquote>
-<!-- /wp:quote -->"
-`;
-
-exports[`Quote can be split at the end 1`] = `
-"<!-- wp:quote -->
-<blockquote class=\\"wp-block-quote\\"><!-- wp:paragraph -->
-<p>1</p>
-<!-- /wp:paragraph --></blockquote>
-<!-- /wp:quote -->
-
-<!-- wp:paragraph -->
-<p></p>
-<!-- /wp:paragraph -->"
-`;
-
-exports[`Quote can be split at the end 2`] = `
-"<!-- wp:quote -->
-<blockquote class=\\"wp-block-quote\\"><!-- wp:paragraph -->
-<p>1</p>
-<!-- /wp:paragraph -->
-
-<!-- wp:paragraph -->
-<p>2</p>
-<!-- /wp:paragraph --></blockquote>
-<!-- /wp:quote -->"
-`;

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

@@ -1,199 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	clickBlockAppender,
-	getEditedPostContent,
-	createNewPost,
-	pressKeyTimes,
-	transformBlockTo,
-	insertBlock,
-} from '@wordpress/e2e-test-utils';
-
-describe( 'Quote', () => {
-	beforeEach( async () => {
-		await createNewPost();
-	} );
-
-	it( 'can be created by using > at the start of a paragraph block', async () => {
-		// Create a block with some text that will trigger a list creation.
-		await clickBlockAppender();
-		await page.keyboard.type( '> A quote' );
-
-		// Create a second list item.
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( 'Another paragraph' );
-
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	it( 'can be created by typing > in front of text of a paragraph block', async () => {
-		// Create a list with the slash block shortcut.
-		await clickBlockAppender();
-		await page.keyboard.type( 'test' );
-		await pressKeyTimes( 'ArrowLeft', 4 );
-		await page.keyboard.type( '> ' );
-
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	it( 'can be created by typing "/quote"', async () => {
-		// Create a list with the slash block shortcut.
-		await clickBlockAppender();
-		await page.keyboard.type( '/quote' );
-		await page.waitForXPath(
-			`//*[contains(@class, "components-autocomplete__result") and contains(@class, "is-selected") and contains(text(), 'Quote')]`
-		);
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( 'I’m a quote' );
-
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	it( 'can be created by converting a paragraph', async () => {
-		await clickBlockAppender();
-		await page.keyboard.type( 'test' );
-		await transformBlockTo( 'Quote' );
-
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	it( 'can be created by converting multiple paragraphs', async () => {
-		await clickBlockAppender();
-		await page.keyboard.type( 'one' );
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( 'two' );
-		await page.keyboard.down( 'Shift' );
-		await page.click( '[data-type="core/paragraph"]' );
-		await page.keyboard.up( 'Shift' );
-		await transformBlockTo( 'Quote' );
-
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	describe( 'can be converted to paragraphs', () => {
-		it( 'and renders one paragraph block per <p> within quote', async () => {
-			await insertBlock( 'Quote' );
-			await page.keyboard.type( 'one' );
-			await page.keyboard.press( 'Enter' );
-			await page.keyboard.type( 'two' );
-			// Navigate to the citation to select the block.
-			await page.keyboard.press( 'ArrowRight' );
-			await transformBlockTo( 'Unwrap' );
-
-			expect( await getEditedPostContent() ).toMatchSnapshot();
-		} );
-
-		it( 'and renders a paragraph for the cite, if it exists', async () => {
-			await insertBlock( 'Quote' );
-			await page.keyboard.type( 'one' );
-			await page.keyboard.press( 'Enter' );
-			await page.keyboard.type( 'two' );
-			await page.keyboard.press( 'ArrowRight' );
-			await page.keyboard.type( 'cite' );
-			await transformBlockTo( 'Unwrap' );
-
-			expect( await getEditedPostContent() ).toMatchSnapshot();
-		} );
-
-		it( 'and renders only one paragraph for the cite, if the quote is void', async () => {
-			await insertBlock( 'Quote' );
-			await page.keyboard.press( 'ArrowRight' );
-			await page.keyboard.type( 'cite' );
-			await transformBlockTo( 'Unwrap' );
-
-			expect( await getEditedPostContent() ).toMatchSnapshot();
-		} );
-
-		it( 'and renders a void paragraph if both the cite and quote are void', async () => {
-			await insertBlock( 'Quote' );
-			await page.keyboard.press( 'ArrowRight' ); // Select the quote
-			await transformBlockTo( 'Unwrap' );
-
-			expect( await getEditedPostContent() ).toMatchSnapshot();
-		} );
-	} );
-
-	it( 'can be created by converting a heading', async () => {
-		await insertBlock( 'Heading' );
-		await page.keyboard.type( 'test' );
-		await transformBlockTo( 'Quote' );
-
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	it( 'can be converted to a pullquote', async () => {
-		await insertBlock( 'Quote' );
-		await page.keyboard.type( 'one' );
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.type( 'two' );
-		await page.keyboard.press( 'ArrowRight' );
-		await page.keyboard.type( 'cite' );
-		await transformBlockTo( 'Pullquote' );
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	it( 'can be split at the end', async () => {
-		await insertBlock( 'Quote' );
-		await page.keyboard.type( '1' );
-		await page.keyboard.press( 'Enter' );
-		await page.keyboard.press( 'Enter' );
-
-		// Expect empty paragraph outside quote block.
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-
-		await page.keyboard.press( 'Backspace' );
-		// Allow time for selection to update.
-		await page.evaluate( () => new Promise( window.requestIdleCallback ) );
-		await page.keyboard.type( '2' );
-
-		// Expect the paragraph to be merged into the quote block.
-		expect( await getEditedPostContent() ).toMatchSnapshot();
-	} );
-
-	it( 'can be unwrapped on Backspace', async () => {
-		await insertBlock( 'Quote' );
-
-		expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-		"<!-- wp:quote -->
-		<blockquote class=\\"wp-block-quote\\"><!-- wp:paragraph -->
-		<p></p>
-		<!-- /wp:paragraph --></blockquote>
-		<!-- /wp:quote -->"
-	` );
-
-		await page.keyboard.press( 'Backspace' );
-
-		expect( await getEditedPostContent() ).toMatchInlineSnapshot( `""` );
-	} );
-
-	it( 'can be unwrapped with content on Backspace', async () => {
-		await insertBlock( 'Quote' );
-		await page.keyboard.type( '1' );
-		await page.keyboard.press( 'ArrowRight' );
-		await page.keyboard.type( '2' );
-
-		expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-		"<!-- wp:quote -->
-		<blockquote class=\\"wp-block-quote\\"><!-- wp:paragraph -->
-		<p>1</p>
-		<!-- /wp:paragraph --><cite>2</cite></blockquote>
-		<!-- /wp:quote -->"
-	` );
-
-		await page.keyboard.press( 'ArrowLeft' );
-		await page.keyboard.press( 'ArrowUp' );
-		await page.keyboard.press( 'ArrowUp' );
-		await page.keyboard.press( 'Backspace' );
-
-		expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-		"<!-- wp:paragraph -->
-		<p>1</p>
-		<!-- /wp:paragraph -->
-
-		<!-- wp:quote -->
-		<blockquote class=\\"wp-block-quote\\"><cite>2</cite></blockquote>
-		<!-- /wp:quote -->"
-	` );
-	} );
-} );

package/specs/editor/various/font-size-picker.test.js

@@ -1,314 +0,0 @@
-/**
- * WordPress dependencies
- */
-import {
-	clickBlockAppender,
-	getEditedPostContent,
-	createNewPost,
-	pressKeyWithModifier,
-	pressKeyTimes,
-	openTypographyToolsPanelMenu,
-} from '@wordpress/e2e-test-utils';
-
-const openFontSizeSelectControl = async () => {
-	const selectControlSelector =
-		"//div[contains(@class, 'components-font-size-picker__controls')]//button[contains(@class, 'components-custom-select-control__button')]";
-	const selectControl = await page.waitForXPath( selectControlSelector );
-	return selectControl.click();
-};
-
-const FONT_SIZE_TOGGLE_GROUP_SELECTOR =
-	"//div[contains(@class, 'components-font-size-picker__controls')]//div[contains(@class, 'components-toggle-group-control')]";
-
-// Click a button by its label - applies when ToggleGroupControl is used.
-const clickFontSizeButtonByLabel = async ( label ) => {
-	const buttonSelector = `${ FONT_SIZE_TOGGLE_GROUP_SELECTOR }//button[@aria-label='${ label }']`;
-	const button = await page.waitForXPath( buttonSelector );
-	return button.click();
-};
-
-// Clicks the button to toggle between custom size input and the control for the presets.
-const toggleCustomInput = async ( showCustomInput ) => {
-	const label = showCustomInput ? 'Set custom size' : 'Use size preset';
-	const toggleButton = await page.waitForXPath(
-		`//button[@aria-label='${ label }']`
-	);
-	return toggleButton.click();
-};
-
-const clickCustomInput = async () => {
-	const customInput = await page.waitForXPath( "//input[@type='number']" );
-	return customInput.click();
-};
-
-describe( 'Font Size Picker', () => {
-	beforeEach( async () => {
-		await createNewPost();
-	} );
-	describe( 'Common', () => {
-		it( 'should apply a named font size using the font size input', async () => {
-			// Create a paragraph block with some content.
-			await clickBlockAppender();
-			await page.keyboard.type( 'Paragraph to be made "small"' );
-
-			await toggleCustomInput( true );
-			await clickCustomInput();
-			// This should be the "small" font-size of the editor defaults.
-			await page.keyboard.type( '13' );
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph {\\"fontSize\\":\\"small\\"} -->
-			<p class=\\"has-small-font-size\\">Paragraph to be made \\"small\\"</p>
-			<!-- /wp:paragraph -->"
-		` );
-		} );
-		it( 'should apply a custom font size using the font size input', async () => {
-			// Create a paragraph block with some content.
-			await clickBlockAppender();
-			await page.keyboard.type( 'Paragraph to be made "small"' );
-
-			await toggleCustomInput( true );
-			await clickCustomInput();
-			await page.keyboard.type( '23' );
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph {\\"style\\":{\\"typography\\":{\\"fontSize\\":\\"23px\\"}}} -->
-			<p style=\\"font-size:23px\\">Paragraph to be made \\"small\\"</p>
-			<!-- /wp:paragraph -->"
-		` );
-		} );
-		it( 'should reset a custom font size using input field', async () => {
-			// Create a paragraph block with some content.
-			await clickBlockAppender();
-			await page.keyboard.type( 'Paragraph reset - custom size' );
-
-			await toggleCustomInput( true );
-			await clickCustomInput();
-			await page.keyboard.type( '23' );
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph {\\"style\\":{\\"typography\\":{\\"fontSize\\":\\"23px\\"}}} -->
-			<p style=\\"font-size:23px\\">Paragraph reset - custom size</p>
-			<!-- /wp:paragraph -->"
-		` );
-
-			await pressKeyTimes( 'Backspace', 2 );
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph -->
-			<p>Paragraph reset - custom size</p>
-			<!-- /wp:paragraph -->"
-		` );
-		} );
-	} );
-
-	// A different control is rendered based on the available font sizes number.
-	describe( 'More font sizes', () => {
-		beforeEach( async () => {
-			await page.evaluate( () => {
-				// set a deep `path[]` property in object `obj` to `value`, immutably
-				function setDeep( obj, path, value ) {
-					function doSet( o, i ) {
-						if ( i < path.length ) {
-							const key = path[ i ];
-							return { ...o, [ key ]: doSet( o[ key ], i + 1 ) };
-						}
-						return value;
-					}
-					return doSet( obj, 0 );
-				}
-
-				wp.data.dispatch( 'core/block-editor' ).updateSettings(
-					setDeep(
-						wp.data.select( 'core/block-editor' ).getSettings(),
-						[
-							'__experimentalFeatures',
-							'typography',
-							'fontSizes',
-							'default',
-						],
-						[
-							{
-								name: 'Tiny',
-								slug: 'tiny',
-								size: '11px',
-							},
-							{
-								name: 'Small',
-								slug: 'small',
-								size: '13px',
-							},
-							{
-								name: 'Medium',
-								slug: 'medium',
-								size: '20px',
-							},
-							{
-								name: 'Large',
-								slug: 'large',
-								size: '36px',
-							},
-							{
-								name: 'Extra Large',
-								slug: 'x-large',
-								size: '42px',
-							},
-							{
-								name: 'Huge',
-								slug: 'huge',
-								size: '48px',
-							},
-						]
-					)
-				);
-			} );
-		} );
-
-		it( 'should apply a named font size using the font size buttons', async () => {
-			// Create a paragraph block with some content.
-			await clickBlockAppender();
-			await page.keyboard.type( 'Paragraph to be made "large"' );
-
-			await openFontSizeSelectControl();
-			await pressKeyTimes( 'ArrowDown', 4 );
-			await page.keyboard.press( 'Enter' );
-
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph {\\"fontSize\\":\\"large\\"} -->
-			<p class=\\"has-large-font-size\\">Paragraph to be made \\"large\\"</p>
-			<!-- /wp:paragraph -->"
-		` );
-		} );
-		it( 'should reset a named font size using the tools panel menu', async () => {
-			// Create a paragraph block with some content.
-			await clickBlockAppender();
-			await page.keyboard.type(
-				'Paragraph with font size reset using tools panel menu'
-			);
-
-			await openFontSizeSelectControl();
-			await pressKeyTimes( 'ArrowDown', 3 );
-			await page.keyboard.press( 'Enter' );
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph {\\"fontSize\\":\\"medium\\"} -->
-			<p class=\\"has-medium-font-size\\">Paragraph with font size reset using tools panel menu</p>
-			<!-- /wp:paragraph -->"
-		` );
-
-			// Open Typography ToolsPanel, font size will be first in menu and gain focus.
-			await openTypographyToolsPanelMenu();
-
-			await page.keyboard.press( 'Enter' );
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph -->
-			<p>Paragraph with font size reset using tools panel menu</p>
-			<!-- /wp:paragraph -->"
-		` );
-		} );
-
-		it( 'should reset a named font size using input field', async () => {
-			// Create a paragraph block with some content.
-			await clickBlockAppender();
-			await page.keyboard.type(
-				'Paragraph with font size reset using input field'
-			);
-
-			await openFontSizeSelectControl();
-			await pressKeyTimes( 'ArrowDown', 2 );
-			await page.keyboard.press( 'Enter' );
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph {\\"fontSize\\":\\"small\\"} -->
-			<p class=\\"has-small-font-size\\">Paragraph with font size reset using input field</p>
-			<!-- /wp:paragraph -->"
-		` );
-
-			await toggleCustomInput( true );
-			await clickCustomInput();
-			await pressKeyWithModifier( 'primary', 'A' );
-			await page.keyboard.press( 'Backspace' );
-
-			// Disable reason: Wait for changes to apply.
-			// eslint-disable-next-line no-restricted-syntax
-			await page.waitForTimeout( 1000 );
-
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph -->
-			<p>Paragraph with font size reset using input field</p>
-			<!-- /wp:paragraph -->"
-		` );
-		} );
-	} );
-	describe( 'Few font sizes', () => {
-		it( 'should apply a named font size using the font size buttons', async () => {
-			// Create a paragraph block with some content.
-			await clickBlockAppender();
-			await page.keyboard.type( 'Paragraph to be made "large"' );
-
-			await clickFontSizeButtonByLabel( 'Large' );
-			const buttonSelector = `${ FONT_SIZE_TOGGLE_GROUP_SELECTOR }//button[@aria-checked='true']`;
-			const [ activeButton ] = await page.$x( buttonSelector );
-			const activeLabel = await page.evaluate(
-				( element ) => element?.getAttribute( 'aria-label' ),
-				activeButton
-			);
-			expect( activeLabel ).toEqual( 'Large' );
-
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph {\\"fontSize\\":\\"large\\"} -->
-			<p class=\\"has-large-font-size\\">Paragraph to be made \\"large\\"</p>
-			<!-- /wp:paragraph -->"
-		` );
-		} );
-
-		it( 'should reset a named font size using the tools panel menu', async () => {
-			// Create a paragraph block with some content.
-			await clickBlockAppender();
-			await page.keyboard.type(
-				'Paragraph with font size reset using tools panel menu'
-			);
-
-			await clickFontSizeButtonByLabel( 'Small' );
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph {\\"fontSize\\":\\"small\\"} -->
-			<p class=\\"has-small-font-size\\">Paragraph with font size reset using tools panel menu</p>
-			<!-- /wp:paragraph -->"
-		` );
-
-			// Open Typography ToolsPanel, font size will be first in menu and gain focus.
-			await openTypographyToolsPanelMenu();
-
-			await page.keyboard.press( 'Enter' );
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph -->
-			<p>Paragraph with font size reset using tools panel menu</p>
-			<!-- /wp:paragraph -->"
-		` );
-		} );
-
-		it( 'should reset a named font size using input field', async () => {
-			// Create a paragraph block with some content.
-			await clickBlockAppender();
-			await page.keyboard.type(
-				'Paragraph with font size reset using input field'
-			);
-
-			await clickFontSizeButtonByLabel( 'Small' );
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph {\\"fontSize\\":\\"small\\"} -->
-			<p class=\\"has-small-font-size\\">Paragraph with font size reset using input field</p>
-			<!-- /wp:paragraph -->"
-		` );
-
-			await toggleCustomInput( true );
-			await clickCustomInput();
-			await pressKeyWithModifier( 'primary', 'A' );
-			await page.keyboard.press( 'Backspace' );
-
-			// Disable reason: Wait for changes to apply.
-			// eslint-disable-next-line no-restricted-syntax
-			await page.waitForTimeout( 1000 );
-
-			expect( await getEditedPostContent() ).toMatchInlineSnapshot( `
-			"<!-- wp:paragraph -->
-			<p>Paragraph with font size reset using input field</p>
-			<!-- /wp:paragraph -->"
-		` );
-		} );
-	} );
-} );