Skip to content

Commit

Permalink
Navigation block: e2e code quality fixes (#48071)
Browse files Browse the repository at this point in the history 
* code quality fixes

* add no pause rule

* Update .eslintrc.js

Co-authored-by: Kai Hao <kevin830726@gmail.com>

* Update test/e2e/specs/editor/blocks/navigation.spec.js

Co-authored-by: Kai Hao <kevin830726@gmail.com>

* Update test/e2e/specs/editor/blocks/navigation.spec.js

Co-authored-by: Kai Hao <kevin830726@gmail.com>

* Update test/e2e/specs/editor/blocks/navigation.spec.js

Co-authored-by: Kai Hao <kevin830726@gmail.com>

* Update test/e2e/specs/editor/blocks/navigation.spec.js

Co-authored-by: Kai Hao <kevin830726@gmail.com>

* remove type from docs

* add page as an argument

---------

Co-authored-by: Kai Hao <kevin830726@gmail.com>
  • Loading branch information
@MaggieCabrera @kevin940726
MaggieCabrera and kevin940726 committed Feb 15, 2023
1 parent fb92f08 commit 3d70283
Show file tree
Hide file tree
Showing 3 changed files with 42 additions and 59 deletions.
1 change: 1 addition & 0 deletions .eslintrc.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -392,6 +392,7 @@ module.exports = {
rules: {
'@wordpress/no-global-active-element': 'off',
'@wordpress/no-global-get-selection': 'off',
'playwright/no-page-pause': 'error',
'no-restricted-syntax': [
'error',
{
Expand Down
36 changes: 17 additions & 19 deletions packages/e2e-test-utils-playwright/src/request-utils/menus.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,8 @@ export interface NavigationMenu {
/**
* Create a classic menu
*
* @param {string} name Menu name.
* @return {string} Menu content.
* @param name Menu name.
* @return Menu content.
*/
export async function createClassicMenu( this: RequestUtils, name: string ) {
const menuItems = [
Expand All @@ -37,28 +37,26 @@ export async function createClassicMenu( this: RequestUtils, name: string ) {
},
} );

if ( menuItems?.length ) {
await this.batchRest(
menuItems.map( ( menuItem ) => ( {
method: 'POST',
path: `/wp/v2/menu-items`,
body: {
menus: menu.id,
object_id: undefined,
...menuItem,
parent: undefined,
},
} ) )
);
}
await this.batchRest(
menuItems.map( ( menuItem ) => ( {
method: 'POST',
path: `/wp/v2/menu-items`,
body: {
menus: menu.id,
object_id: undefined,
...menuItem,
parent: undefined,
},
} ) )
);

return menu;
}

/**
* Create a navigation menu
*
* @param {Object} menuData navigation menu post data.
* @param menuData navigation menu post data.
* @return {string} Menu content.
*/
export async function createNavigationMenu(
Expand All @@ -84,7 +82,7 @@ export async function deleteAllMenus( this: RequestUtils ) {
path: `/wp/v2/navigation/`,
} );

if ( navMenus?.length ) {
if ( navMenus.length ) {
await this.batchRest(
navMenus.map( ( menu ) => ( {
method: 'DELETE',
Expand All @@ -97,7 +95,7 @@ export async function deleteAllMenus( this: RequestUtils ) {
path: `/wp/v2/menus/`,
} );

if ( classicMenus?.length ) {
if ( classicMenus.length ) {
await this.batchRest(
classicMenus.map( ( menu ) => ( {
method: 'DELETE',
Expand Down
64 changes: 24 additions & 40 deletions test/e2e/specs/editor/blocks/navigation.spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,6 @@
*/
const { test, expect } = require( '@wordpress/e2e-test-utils-playwright' );

test.use( {
navBlockUtils: async ( { editor, page, requestUtils }, use ) => {
await use( new NavigationBlockUtils( { editor, page, requestUtils } ) );
},
} );

test.describe(
'As a user I want the navigation block to fallback to the best possible default',
() => {
Expand Down Expand Up @@ -66,7 +60,6 @@ test.describe(
editor,
page,
requestUtils,
navBlockUtils,
} ) => {
await admin.createNewPost();
const createdMenu = await requestUtils.createNavigationMenu( {
Expand All @@ -78,7 +71,11 @@ test.describe(
await editor.insertBlock( { name: 'core/navigation' } );

// Check the block in the canvas.
await navBlockUtils.selectNavigationItemOnCanvas( 'WordPress' );
await expect(
editor.canvas.locator(
`role=textbox[name="Navigation link text"i] >> text="WordPress"`
)
).toBeVisible();

// Check the markup of the block is correct.
await editor.publishPost();
Expand All @@ -91,14 +88,19 @@ test.describe(
await page.locator( 'role=button[name="Close panel"i]' ).click();

// Check the block in the frontend.
await navBlockUtils.selectNavigationItemOnFrontend( 'WordPress' );
await page.goto( '/' );
await expect(
page.locator(
`role=navigation >> role=link[name="WordPress"i]`
)
).toBeVisible();
} );

test( 'default to the only existing classic menu if there are no block menus', async ( {
admin,
page,
editor,
requestUtils,
navBlockUtils,
} ) => {
// Create a classic menu.
await requestUtils.createClassicMenu( 'Test Classic 1' );
Expand All @@ -113,42 +115,24 @@ test.describe(
] );

// Check the block in the canvas.
await editor.page.pause();
await navBlockUtils.selectNavigationItemOnCanvas( 'Custom link' );
await expect(
editor.canvas.locator(
`role=textbox[name="Navigation link text"i] >> text="Custom link"`
)
).toBeVisible();

// Check the block in the frontend.
await navBlockUtils.selectNavigationItemOnFrontend( 'Custom link' );
await editor.page.pause();
await page.goto( '/' );

await expect(
page.locator(
`role=navigation >> role=link[name="Custom link"i]`
)
).toBeVisible();
} );
}
);

class NavigationBlockUtils {
constructor( { editor, page, requestUtils } ) {
this.editor = editor;
this.page = page;
this.requestUtils = requestUtils;
}

async selectNavigationItemOnCanvas( name ) {
await expect(
this.editor.canvas.locator(
`role=textbox[name="Navigation link text"i] >> text="${ name }"`
)
).toBeVisible();
}

async selectNavigationItemOnFrontend( name ) {
await this.page.goto( '/' );
await this.editor.page.pause();
await expect(
this.page.locator(
`role=navigation >> role=link[name="${ name }"i]`
)
).toBeVisible();
}
}

test.describe( 'Navigation block', () => {
test.describe(
'As a user I want to see a warning if the menu referenced by a navigation block is not available',
Expand Down

1 comment on commit 3d70283

@github-actions
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Flaky tests detected in 3d70283.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/4186659511
📝 Reported issues:

Please sign in to comment.