Skip to content

Commit

Permalink
Update font size picker reset e2e tests for ToolsPanel
Browse files Browse the repository at this point in the history
  • Loading branch information
aaronrobertshaw committed Oct 21, 2021
1 parent e79628d commit eaac5c4
Showing 1 changed file with 19 additions and 16 deletions.
35 changes: 19 additions & 16 deletions packages/e2e-tests/specs/editor/various/font-size-picker.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,13 @@ const openFontSizeSelectControl = async () => {
return selectControl.click();
};

const openTypographyToolsPanelMenu = async () => {
const toggleSelector =
"//div[contains(@class, 'typography-block-support-panel')]//button[contains(@class, 'components-dropdown-menu__toggle')]";
const toggle = await page.waitForXPath( toggleSelector );
return toggle.click();
};

const FONT_SIZE_TOGGLE_GROUP_SELECTOR =
"//div[contains(@class, 'components-font-size-picker__controls')]//div[contains(@class, 'components-toggle-group-control')]";

Expand Down Expand Up @@ -122,31 +129,29 @@ describe( 'Font Size Picker', () => {
<!-- /wp:paragraph -->"
` );
} );
it( 'should reset a named font size using the reset button', async () => {
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 button'
'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\\":\\"normal\\"} -->
<p class=\\"has-normal-font-size\\">Paragraph with font size reset using button</p>
<p class=\\"has-normal-font-size\\">Paragraph with font size reset using tools panel menu</p>
<!-- /wp:paragraph -->"
` );

await toggleCustomInput( true );
await page.keyboard.press( 'Tab' );
await page.keyboard.press( 'Tab' );
await page.keyboard.press( 'Tab' );
// 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 button</p>
<p>Paragraph with font size reset using tools panel menu</p>
<!-- /wp:paragraph -->"
` );
} );
Expand Down Expand Up @@ -205,29 +210,27 @@ describe( 'Font Size Picker', () => {
` );
} );

it( 'should reset a named font size using the reset button', async () => {
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 button'
'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 button</p>
<p class=\\"has-small-font-size\\">Paragraph with font size reset using tools panel menu</p>
<!-- /wp:paragraph -->"
` );

await toggleCustomInput( true );
await page.keyboard.press( 'Tab' );
await page.keyboard.press( 'Tab' );
await page.keyboard.press( 'Tab' );
// 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 button</p>
<p>Paragraph with font size reset using tools panel menu</p>
<!-- /wp:paragraph -->"
` );
} );
Expand Down

0 comments on commit eaac5c4

Please sign in to comment.