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

Add: End to end test to verify that when all blocks are removed the default block gets selected #14191

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
62 changes: 36 additions & 26 deletions packages/e2e-test-utils/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,7 @@ Clicks on More Menu item, searches for the button with the text provided and cli

### createEmbeddingMatcher

[src/index.js#L47-L47](src/index.js#L47-L47)
[src/index.js#L48-L48](src/index.js#L48-L48)

Creates a function to determine if a request is embedding a certain URL.

Expand All @@ -102,7 +102,7 @@ Creates a function to determine if a request is embedding a certain URL.

### createJSONResponse

[src/index.js#L47-L47](src/index.js#L47-L47)
[src/index.js#L48-L48](src/index.js#L48-L48)

Respond to a request with a JSON response.

Expand Down Expand Up @@ -141,7 +141,7 @@ Creates new URL by parsing base URL, WPPath and query string.

### createURLMatcher

[src/index.js#L47-L47](src/index.js#L47-L47)
[src/index.js#L48-L48](src/index.js#L48-L48)

Creates a function to determine if a request is calling a URL with the substring present.

Expand Down Expand Up @@ -299,10 +299,20 @@ Checks if current URL is a WordPress path.

`boolean`: Boolean represents whether current URL is or not a WordPress path.

### loginUser
### isInDefaultBlock

[src/index.js#L25-L25](src/index.js#L25-L25)

Checks if the block that is focused is the default block.

**Returns**

`Promise`: Promise resolving with a boolean indicating if the focused block is the default block.

### loginUser

[src/index.js#L26-L26](src/index.js#L26-L26)

Performs log in with specified username and password.

**Parameters**
Expand All @@ -312,7 +322,7 @@ Performs log in with specified username and password.

### mockOrTransform

[src/index.js#L47-L47](src/index.js#L47-L47)
[src/index.js#L48-L48](src/index.js#L48-L48)

Mocks a request with the supplied mock object, or allows it to run with an optional transform, based on the
deserialised JSON response for the request.
Expand All @@ -329,26 +339,26 @@ deserialised JSON response for the request.

### observeFocusLoss

[src/index.js#L26-L26](src/index.js#L26-L26)
[src/index.js#L27-L27](src/index.js#L27-L27)

Binds to the document on page load which throws an error if a `focusout`
event occurs without a related target (i.e. focus loss).

### openDocumentSettingsSidebar

[src/index.js#L27-L27](src/index.js#L27-L27)
[src/index.js#L28-L28](src/index.js#L28-L28)

Clicks on the button in the header which opens Document Settings sidebar when it is closed.

### openPublishPanel

[src/index.js#L28-L28](src/index.js#L28-L28)
[src/index.js#L29-L29](src/index.js#L29-L29)

Opens the publish panel.

### pressKeyTimes

[src/index.js#L29-L29](src/index.js#L29-L29)
[src/index.js#L30-L30](src/index.js#L30-L30)

Presses the given keyboard key a number of times in sequence.

Expand All @@ -363,7 +373,7 @@ Presses the given keyboard key a number of times in sequence.

### pressKeyWithModifier

[src/index.js#L30-L30](src/index.js#L30-L30)
[src/index.js#L31-L31](src/index.js#L31-L31)

Performs a key press with modifier (Shift, Control, Meta, Alt), where each modifier
is normalized to platform-specific modifier.
Expand All @@ -375,7 +385,7 @@ is normalized to platform-specific modifier.

### publishPost

[src/index.js#L31-L31](src/index.js#L31-L31)
[src/index.js#L32-L32](src/index.js#L32-L32)

Publishes the post, resolving once the request is complete (once a notice
is displayed).
Expand All @@ -386,7 +396,7 @@ is displayed).

### publishPostWithPrePublishChecksDisabled

[src/index.js#L32-L32](src/index.js#L32-L32)
[src/index.js#L33-L33](src/index.js#L33-L33)

Publishes the post without the pre-publish checks,
resolving once the request is complete (once a notice is displayed).
Expand All @@ -397,7 +407,7 @@ resolving once the request is complete (once a notice is displayed).

### saveDraft

[src/index.js#L33-L33](src/index.js#L33-L33)
[src/index.js#L34-L34](src/index.js#L34-L34)

Saves the post as a draft, resolving once the request is complete (once the
"Saved" indicator is displayed).
Expand All @@ -408,7 +418,7 @@ Saves the post as a draft, resolving once the request is complete (once the

### searchForBlock

[src/index.js#L34-L34](src/index.js#L34-L34)
[src/index.js#L35-L35](src/index.js#L35-L35)

Search for block in the global inserter

Expand All @@ -418,7 +428,7 @@ Search for block in the global inserter

### selectBlockByClientId

[src/index.js#L35-L35](src/index.js#L35-L35)
[src/index.js#L36-L36](src/index.js#L36-L36)

Given the clientId of a block, selects the block on the editor.

Expand All @@ -428,7 +438,7 @@ Given the clientId of a block, selects the block on the editor.

### setBrowserViewport

[src/index.js#L36-L36](src/index.js#L36-L36)
[src/index.js#L37-L37](src/index.js#L37-L37)

Sets browser viewport to specified type.

Expand All @@ -438,7 +448,7 @@ Sets browser viewport to specified type.

### setPostContent

[src/index.js#L37-L37](src/index.js#L37-L37)
[src/index.js#L38-L38](src/index.js#L38-L38)

Sets code editor content

Expand All @@ -452,7 +462,7 @@ Sets code editor content

### setUpResponseMocking

[src/index.js#L47-L47](src/index.js#L47-L47)
[src/index.js#L48-L48](src/index.js#L48-L48)

Sets up mock checks and responses. Accepts a list of mock settings with the following properties:

Expand Down Expand Up @@ -483,7 +493,7 @@ If none of the mock settings match the request, the request is allowed to contin

### switchEditorModeTo

[src/index.js#L38-L38](src/index.js#L38-L38)
[src/index.js#L39-L39](src/index.js#L39-L39)

Switches editor mode.

Expand All @@ -493,21 +503,21 @@ Switches editor mode.

### switchUserToAdmin

[src/index.js#L39-L39](src/index.js#L39-L39)
[src/index.js#L40-L40](src/index.js#L40-L40)

Switches the current user to the admin user (if the user
running the test is not already the admin user).

### switchUserToTest

[src/index.js#L40-L40](src/index.js#L40-L40)
[src/index.js#L41-L41](src/index.js#L41-L41)

Switches the current user to whichever user we should be
running the tests as (if we're not already that user).

### toggleScreenOption

[src/index.js#L41-L41](src/index.js#L41-L41)
[src/index.js#L42-L42](src/index.js#L42-L42)

Toggles the screen option with the given label.

Expand All @@ -518,7 +528,7 @@ Toggles the screen option with the given label.

### transformBlockTo

[src/index.js#L42-L42](src/index.js#L42-L42)
[src/index.js#L43-L43](src/index.js#L43-L43)

Converts editor's block type.

Expand All @@ -528,7 +538,7 @@ Converts editor's block type.

### uninstallPlugin

[src/index.js#L43-L43](src/index.js#L43-L43)
[src/index.js#L44-L44](src/index.js#L44-L44)

Uninstalls a plugin.

Expand All @@ -538,7 +548,7 @@ Uninstalls a plugin.

### visitAdminPage

[src/index.js#L44-L44](src/index.js#L44-L44)
[src/index.js#L45-L45](src/index.js#L45-L45)

Visits admin page; if user is not logged in then it logging in it first, then visits admin page.

Expand All @@ -549,7 +559,7 @@ Visits admin page; if user is not logged in then it logging in it first, then vi

### waitForWindowDimensions

[src/index.js#L45-L45](src/index.js#L45-L45)
[src/index.js#L46-L46](src/index.js#L46-L46)

Function that waits until the page viewport has the required dimensions.
It is being used to address a problem where after using setViewport the execution may continue,
Expand Down
1 change: 1 addition & 0 deletions packages/e2e-test-utils/src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@ export { hasBlockSwitcher } from './has-block-switcher';
export { insertBlock } from './insert-block';
export { installPlugin } from './install-plugin';
export { isCurrentURL } from './is-current-url';
export { isInDefaultBlock } from './is-in-default-block';
export { loginUser } from './login-user';
export { observeFocusLoss } from './observe-focus-loss';
export { openDocumentSettingsSidebar } from './open-document-settings-sidebar';
Expand Down
22 changes: 22 additions & 0 deletions packages/e2e-test-utils/src/is-in-default-block.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
/**
* Checks if the block that is focused is the default block.
*
* @return {Promise} Promise resolving with a boolean indicating if the focused block is the default block.
*/
export function isInDefaultBlock() {
Copy link
Member

Choose a reason for hiding this comment

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

We should document each of these utility functions, at least in a JSDoc. It wasn't immediately obvious to me precisely what this was testing.

return page.evaluate( () => {
const activeElement = document.activeElement;
// activeElement may be null in that case we should return false
if ( ! activeElement ) {
return false;
}
const closestElementWithDataTpe = activeElement.closest( '[data-type]' );
if ( ! closestElementWithDataTpe ) {
return false;
}
const activeBlockName = closestElementWithDataTpe.getAttribute( 'data-type' );
const defaultBlockName = window.wp.blocks.getDefaultBlockName();

return activeBlockName === defaultBlockName;
} );
}
22 changes: 22 additions & 0 deletions packages/e2e-tests/specs/block-deletion.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import {
clickBlockAppender,
getEditedPostContent,
createNewPost,
isInDefaultBlock,
pressKeyWithModifier,
} from '@wordpress/e2e-test-utils';

Expand Down Expand Up @@ -109,3 +110,24 @@ describe( 'block deletion -', () => {
} );
} );
} );

describe( 'deleting all blocks', () => {
it( 'results in the default block getting selected', async () => {
await createNewPost();
await clickBlockAppender();
await page.keyboard.type( 'Paragraph' );

await page.keyboard.press( 'Escape' );

await clickOnBlockSettingsMenuItem( 'Remove Block' );

// There is a default block:
expect( await page.$$( '.editor-block-list__block' ) ).toHaveLength( 1 );

// But the effective saved content is still empty:
expect( await getEditedPostContent() ).toBe( '' );

// And focus is retained:
expect( await isInDefaultBlock() ).toBe( true );
} );
} );
12 changes: 2 additions & 10 deletions packages/e2e-tests/specs/splitting-merging.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
import {
createNewPost,
insertBlock,
isInDefaultBlock,
getEditedPostContent,
pressKeyTimes,
pressKeyWithModifier,
Expand Down Expand Up @@ -199,15 +200,6 @@ describe( 'splitting and merging blocks', () => {
expect( await getEditedPostContent() ).toBe( '' );

// And focus is retained:
const isInDefaultBlock = await page.evaluate( () => {
const activeBlockName = document.activeElement
.closest( '[data-type]' )
.getAttribute( 'data-type' );
const defaultBlockName = window.wp.blocks.getDefaultBlockName();

return activeBlockName === defaultBlockName;
} );

expect( isInDefaultBlock ).toBe( true );
expect( await isInDefaultBlock() ).toBe( true );
} );
} );