Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor Site Editor test utils to the e2e-test-utils package #38463

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
88 changes: 88 additions & 0 deletions packages/e2e-test-utils/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -106,6 +106,15 @@ Clicks on More Menu item, searches for the button with the text provided and cli
_Parameters_

- _buttonLabel_ `string`: The label to search the button for.
- _context_ `[GutenbergContext]`: Whether to click the button in the post editor or site editor context.

### clickSiteEditorMenuItem

Searches for an item in the navigation panel with the label provided and clicks it.

_Parameters_

- _label_ `string`: The label to search the menu item for.

### closeGlobalBlockInserter

Expand All @@ -115,6 +124,10 @@ Undocumented declaration.

Closes list view

### closeSiteEditorNavigationPanel

Closes the site editor navigation panel if open

### createEmbeddingMatcher

Creates a function to determine if a request is embedding a certain URL.
Expand Down Expand Up @@ -258,6 +271,10 @@ Disable auto-accepting any dialogs.

Disables Pre-publish checks.

### disableSiteEditorWelcomeGuide

Skips the welcome guide popping up to first time users of the site editor

### dragAndResize

Clicks an element, drags a particular distance and releases the mouse button.
Expand Down Expand Up @@ -364,6 +381,14 @@ _Returns_

- `Promise`: Promise resolving with current post content markup.

### getCurrentSiteEditorContent

Returns a promise which resolves with the edited post content (HTML string).

_Returns_

- `Promise<string>`: Promise resolving with post content markup.

### getEditedPostContent

Returns a promise which resolves with the edited post content (HTML string).
Expand Down Expand Up @@ -399,6 +424,18 @@ _Returns_

- `Promise<?string>`: Promise resolving to a string or null, depending whether a page error is present.

### getSiteEditorMenuItem

Searches for an item in the site editor navigation menu with the provided label.

_Parameters_

- _label_ `string`: The label to search the menu item for.

_Returns_

- `Promise<?ElementHandle>`: The menu item handle or `null`

### hasBlockSwitcher

Returns a boolean indicating if the current selected block has a block switcher or not.
Expand Down Expand Up @@ -489,6 +526,17 @@ _Returns_

Undocumented declaration.

### isSiteEditorRoot

Returns `true` if in the site editor navigation root

Checks whether the “Back to dashboard” button is visible. If
not in the root, a “Back” button would be visible instead.

_Returns_

- `Promise<boolean>`: Whether it currently is the navigation root or not

### isThemeInstalled

Checks whether a theme exists on the site.
Expand Down Expand Up @@ -525,6 +573,14 @@ _Returns_

- `Promise`: Promise that uses `mockCheck` to see if a request should be mocked with `mock`, and optionally transforms the response with `responseObjectTransform`.

### navigateSiteEditorBack

Navigates the site editor back

### navigateSiteEditorBackToRoot

Goes back until it gets to the root

### openDocumentSettingsSidebar

Clicks on the button in the header which opens Document Settings sidebar when it is closed.
Expand Down Expand Up @@ -553,6 +609,10 @@ _Returns_

Opens the publish panel.

### openSiteEditorNavigationPanel

Opens the site editor navigation panel if closed

### openTypographyToolsPanelMenu

Opens the Typography tools panel menu provided via block supports.
Expand Down Expand Up @@ -711,6 +771,14 @@ _Parameters_
The block toolbar is not always visible while typing.
Call this function to reveal it.

### siteEditorNavigateSequence

Navigates through a sequence of links in the site editor navigation panel

_Parameters_

- _labels_ `string[] | string`: Labels to navigate through

### switchEditorModeTo

Switches editor mode.
Expand All @@ -737,6 +805,11 @@ Toggles the global inserter.

Toggles the More Menu.

_Parameters_

- _waitFor_ `['open' | 'close']`: Whether it should wait for the menu to open or close. If `undefined` it won't wait for anything.
- _context_ `[GutenbergContext]`: Whether it's toggling in the context of the site editor or post editor.

### toggleOfflineMode

Undocumented declaration.
Expand Down Expand Up @@ -789,6 +862,21 @@ _Parameters_
- _adminPath_ `string`: String to be serialized as pathname.
- _query_ `string`: String to be serialized as query portion of URL.

### visitSiteEditor

Visits the Site Editor main page

By default, it also skips the welcome guide. The option can be disabled if need be.

_Related_

- disableSiteEditorWelcomeGuide

_Parameters_

- _query_ `string`: String to be serialized as query portion of URL.
- _skipWelcomeGuide_ `[boolean]`: Whether to skip the welcome guide as part of the navigation.

### waitForWindowDimensions

Function that waits until the page viewport has the required dimensions.
Expand Down
26 changes: 22 additions & 4 deletions packages/e2e-test-utils/src/click-on-more-menu-item.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,15 +8,33 @@ import { first } from 'lodash';
*/
import { toggleMoreMenu } from './toggle-more-menu';

/**
* @typedef {import("./shared/types").GutenbergContext} GutenbergContext
*/

const SELECTORS = {
postEditorMenuContainer:
'//*[contains(concat(" ", @class, " "), " edit-post-more-menu__content ")]',
siteEditorMenuContainer:
'//*[contains(concat(" ", @class, " "), " edit-site-more-menu__content ")]',
};

/**
* Clicks on More Menu item, searches for the button with the text provided and clicks it.
*
* @param {string} buttonLabel The label to search the button for.
* @param {string} buttonLabel The label to search the button for.
* @param {GutenbergContext} [context='post-editor'] Whether to click the button in the post editor or site editor context.
*/
export async function clickOnMoreMenuItem( buttonLabel ) {
await toggleMoreMenu();
export async function clickOnMoreMenuItem(
buttonLabel,
context = 'post-editor'
) {
await toggleMoreMenu( 'open', context );
const moreMenuContainerSelector =
'//*[contains(concat(" ", @class, " "), " edit-post-more-menu__content ")]';
context === 'post-editor'
? SELECTORS.postEditorMenuContainer
: SELECTORS.siteEditorMenuContainer;

const elementToClick = first(
await page.$x(
`${ moreMenuContainerSelector }//span[contains(concat(" ", @class, " "), " components-menu-item__item ")][contains(text(), "${ buttonLabel }")]`
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,5 +13,5 @@ export async function disablePrePublishChecks() {
'Include pre-publish checklist',
false
);
await toggleMoreMenu();
await toggleMoreMenu( 'close' );
}
2 changes: 1 addition & 1 deletion packages/e2e-test-utils/src/enable-pre-publish-checks.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,5 +13,5 @@ export async function enablePrePublishChecks() {
'Include pre-publish checklist',
true
);
await toggleMoreMenu();
await toggleMoreMenu( 'close' );
}
13 changes: 13 additions & 0 deletions packages/e2e-test-utils/src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -98,5 +98,18 @@ export {
batch as __experimentalBatch,
} from './rest-api';
export { openListView, closeListView } from './list-view';
export {
clickSiteEditorMenuItem,
closeSiteEditorNavigationPanel,
disableSiteEditorWelcomeGuide,
getCurrentSiteEditorContent,
getSiteEditorMenuItem,
isSiteEditorRoot,
navigateSiteEditorBack,
navigateSiteEditorBackToRoot,
openSiteEditorNavigationPanel,
siteEditorNavigateSequence,
visitSiteEditor,
} from './site-editor';

export * from './mocks';
6 changes: 6 additions & 0 deletions packages/e2e-test-utils/src/shared/types.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
/**
* Possible Gutenberg context
*
* Often useful to determine different selectors.
*/
export type GutenbergContext = 'post-editor' | 'site-editor';
Loading