Skip to content

Commit

Permalink
Fix flaky tests in navigation.spec.js and other tests related to th…
Browse files Browse the repository at this point in the history 
…e Post Editor Template mode (WordPress#51790)

* Add delay between consecutive keystrokes

* Fix post editor template mode tests
  • Loading branch information
@DAreRodz @sethrubenstein
DAreRodz authored and sethrubenstein committed Jul 13, 2023
1 parent d7d5b63 commit 47150c7
Show file tree
Hide file tree
Showing 2 changed files with 24 additions and 27 deletions.
50 changes: 23 additions & 27 deletions test/e2e/specs/editor/blocks/navigation.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -971,7 +971,7 @@ test.describe( 'Navigation block - Frontend interactivity', () => {
await editor.saveSiteEditorEntities();
} );

test( 'Overlay menu interactions', async ( { page } ) => {
test( 'Overlay menu interactions', async ( { page, pageUtils } ) => {
await page.goto( '/' );
const overlayMenuFirstElement = page.getByRole( 'link', {
name: 'Item 1',
Expand All @@ -993,11 +993,9 @@ test.describe( 'Navigation block - Frontend interactivity', () => {
await expect( overlayMenuFirstElement ).toBeFocused();

// Test: overlay menu traps focus
await page.keyboard.press( 'Tab' );
await page.keyboard.press( 'Tab' );
await pageUtils.pressKeys( 'Tab', { times: 2, delay: 50 } );
await expect( closeMenuButton ).toBeFocused();
await page.keyboard.press( 'Shift+Tab' );
await page.keyboard.press( 'Shift+Tab' );
await pageUtils.pressKeys( 'Shift+Tab', { times: 2, delay: 50 } );
await expect( overlayMenuFirstElement ).toBeFocused();

// Test: overlay menu closes on click on close menu button
Expand All @@ -1007,7 +1005,7 @@ test.describe( 'Navigation block - Frontend interactivity', () => {
// Test: overlay menu closes on ESC key
await openMenuButton.click();
await expect( overlayMenuFirstElement ).toBeVisible();
await page.keyboard.press( 'Escape' );
await pageUtils.pressKeys( 'Escape' );
await expect( overlayMenuFirstElement ).toBeHidden();
await expect( openMenuButton ).toBeFocused();
} );
Expand Down Expand Up @@ -1044,7 +1042,7 @@ test.describe( 'Navigation block - Frontend interactivity', () => {
await editor.saveSiteEditorEntities();
} );

test( 'Submenu interactions', async ( { page } ) => {
test( 'Submenu interactions', async ( { page, pageUtils } ) => {
await page.goto( '/' );
const simpleSubmenuButton = page.getByRole( 'button', {
name: 'Simple Submenu',
Expand Down Expand Up @@ -1090,39 +1088,36 @@ test.describe( 'Navigation block - Frontend interactivity', () => {

// Test: submenu opens on Enter keypress
await simpleSubmenuButton.focus();
await page.keyboard.press( 'Enter' );
await pageUtils.pressKeys( 'Enter' );
await expect( innerElement ).toBeVisible();

// Test: submenu closes on ESC key and focuses parent link
await page.keyboard.press( 'Escape' );
await pageUtils.pressKeys( 'Escape' );
await expect( innerElement ).toBeHidden();
await expect( simpleSubmenuButton ).toBeFocused();

// Test: submenu closes on tab outside submenu
await simpleSubmenuButton.focus();
await page.keyboard.press( 'Enter' );
await pageUtils.pressKeys( 'Enter' );
await expect( innerElement ).toBeVisible();
// Tab to first element.
await page.keyboard.press( 'Tab' );
// Tab outside the submenu.
await page.keyboard.press( 'Tab' );
// Tab to first element, then tab outside the submenu.
await pageUtils.pressKeys( 'Tab', { times: 2, delay: 50 } );
await expect( innerElement ).toBeHidden();
await expect( complexSubmenuButton ).toBeFocused();

// Test: only nested submenu closes on tab outside
await complexSubmenuButton.focus();
await page.keyboard.press( 'Enter' );
await pageUtils.pressKeys( 'Enter' );
await expect( firstLevelElement ).toBeVisible();
await expect( secondLevelElement ).toBeHidden();

await nestedSubmenuButton.click();
await expect( firstLevelElement ).toBeVisible();
await expect( secondLevelElement ).toBeVisible();

// Tab to nested submenu first element.
await page.keyboard.press( 'Tab' );
// Tab outside the nested submenu.
await page.keyboard.press( 'Tab' );
// Tab to nested submenu first element, then tab outside the nested
// submenu.
await pageUtils.pressKeys( 'Tab', { times: 2, delay: 50 } );
await expect( firstLevelElement ).toBeVisible();
await expect( secondLevelElement ).toBeHidden();
// Tab outside the complex submenu.
Expand Down Expand Up @@ -1217,7 +1212,10 @@ test.describe( 'Navigation block - Frontend interactivity', () => {
await editor.saveSiteEditorEntities();
} );

test( 'page-list submenu user interactions', async ( { page } ) => {
test( 'page-list submenu user interactions', async ( {
page,
pageUtils,
} ) => {
await page.goto( '/' );
const submenuButton = page.getByRole( 'button', {
name: 'Parent Page',
Expand All @@ -1237,20 +1235,18 @@ test.describe( 'Navigation block - Frontend interactivity', () => {

// page-list submenu opens on enter keypress
await submenuButton.focus();
await page.keyboard.press( 'Enter' );
await pageUtils.pressKeys( 'Enter' );
await expect( innerElement ).toBeVisible();

// page-list submenu closes on ESC key and focuses submenu button
await page.keyboard.press( 'Escape' );
await pageUtils.pressKeys( 'Escape' );
await expect( innerElement ).toBeHidden();
await expect( submenuButton ).toBeFocused();

// page-list submenu closes on tab outside submenu
await page.keyboard.press( 'Enter' );
// Tab to first element.
await page.keyboard.press( 'Tab' );
// Tab outside the submenu.
await page.keyboard.press( 'Tab' );
await pageUtils.pressKeys( 'Enter', { delay: 50 } );
// Tab to first element, then tab outside the submenu.
await pageUtils.pressKeys( 'Tab', { times: 2, delay: 50 } );
await expect( innerElement ).toBeHidden();
} );
} );
Expand Down
1 change: 1 addition & 0 deletions test/e2e/specs/editor/various/post-editor-template-mode.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -156,6 +156,7 @@ class PostEditorTemplateMode {

async createPostAndSaveDraft() {
await this.admin.createNewPost();
await this.editor.canvas.waitForLoadState();
// Create a random post.
await this.page.keyboard.type( 'Just an FSE Post' );
await this.page.keyboard.press( 'Enter' );
Expand Down

0 comments on commit 47150c7

Please sign in to comment.