@wordpress/e2e-tests 6.2.0 → 6.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +2 -0
- package/package.json +7 -7
- package/specs/editor/blocks/cover.test.js +9 -9
- package/specs/editor/blocks/query.test.js +10 -54
- package/specs/editor/various/__snapshots__/links.test.js.snap +1 -1
- package/specs/editor/various/block-editor-keyboard-shortcuts.test.js +8 -6
- package/specs/editor/various/inserting-blocks.test.js +4 -2
- package/specs/editor/various/keyboard-navigable-blocks.test.js +1 -1
- package/specs/editor/various/links.test.js +61 -4
- package/specs/editor/various/multi-block-selection.test.js +16 -3
- package/specs/editor/various/nux.test.js +2 -2
- package/specs/editor/various/rich-text.test.js +9 -1
- package/specs/experiments/blocks/post-comments-form.test.js +10 -2
- package/specs/performance/front-end-block-theme.test.js +47 -0
- package/specs/performance/front-end-classic-theme.test.js +45 -0
- package/specs/site-editor/multi-entity-saving.test.js +7 -2
- package/specs/editor/blocks/__snapshots__/classic.test.js.snap +0 -5
- package/specs/editor/blocks/classic.test.js +0 -145
- package/specs/editor/various/a11y.test.js +0 -74
- package/specs/experiments/__snapshots__/navigation-editor.test.js.snap +0 -39
- package/specs/experiments/navigation-editor.test.js +0 -850
|
@@ -1,145 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* External dependencies
|
|
3
|
-
*/
|
|
4
|
-
import path from 'path';
|
|
5
|
-
import fs from 'fs';
|
|
6
|
-
import os from 'os';
|
|
7
|
-
import { v4 as uuid } from 'uuid';
|
|
8
|
-
|
|
9
|
-
/**
|
|
10
|
-
* WordPress dependencies
|
|
11
|
-
*/
|
|
12
|
-
import {
|
|
13
|
-
getEditedPostContent,
|
|
14
|
-
createNewPost,
|
|
15
|
-
insertBlock,
|
|
16
|
-
pressKeyWithModifier,
|
|
17
|
-
clickBlockToolbarButton,
|
|
18
|
-
saveDraft,
|
|
19
|
-
} from '@wordpress/e2e-test-utils';
|
|
20
|
-
|
|
21
|
-
describe( 'Classic', () => {
|
|
22
|
-
beforeEach( async () => {
|
|
23
|
-
await createNewPost();
|
|
24
|
-
} );
|
|
25
|
-
|
|
26
|
-
it( 'should be inserted', async () => {
|
|
27
|
-
await insertBlock( 'Classic' );
|
|
28
|
-
// Wait for TinyMCE to initialise.
|
|
29
|
-
await page.waitForSelector( '.mce-content-body' );
|
|
30
|
-
// Ensure there is focus.
|
|
31
|
-
await page.focus( '.mce-content-body' );
|
|
32
|
-
await page.keyboard.type( 'test' );
|
|
33
|
-
// Move focus away.
|
|
34
|
-
await pressKeyWithModifier( 'shift', 'Tab' );
|
|
35
|
-
|
|
36
|
-
expect( await getEditedPostContent() ).toMatchSnapshot();
|
|
37
|
-
} );
|
|
38
|
-
|
|
39
|
-
it( 'should insert media, convert to blocks, and undo in one step', async () => {
|
|
40
|
-
await insertBlock( 'Classic' );
|
|
41
|
-
// Wait for TinyMCE to initialise.
|
|
42
|
-
await page.waitForSelector( '.mce-content-body' );
|
|
43
|
-
// Ensure there is focus.
|
|
44
|
-
await page.focus( '.mce-content-body' );
|
|
45
|
-
await page.keyboard.type( 'test' );
|
|
46
|
-
|
|
47
|
-
// Click the image button.
|
|
48
|
-
const addMediaButton = await page.waitForSelector(
|
|
49
|
-
'div[aria-label^="Add Media"]'
|
|
50
|
-
);
|
|
51
|
-
await addMediaButton.click();
|
|
52
|
-
|
|
53
|
-
await page.click( '.media-menu-item#menu-item-gallery' );
|
|
54
|
-
|
|
55
|
-
// Wait for media modal to appear and upload image.
|
|
56
|
-
const inputElement = await page.waitForSelector(
|
|
57
|
-
'.media-modal .moxie-shim input[type=file]'
|
|
58
|
-
);
|
|
59
|
-
const testImagePath = path.join(
|
|
60
|
-
__dirname,
|
|
61
|
-
'..',
|
|
62
|
-
'..',
|
|
63
|
-
'..',
|
|
64
|
-
'assets',
|
|
65
|
-
'10x10_e2e_test_image_z9T8jK.png'
|
|
66
|
-
);
|
|
67
|
-
const filename = uuid();
|
|
68
|
-
const tmpFileName = path.join( os.tmpdir(), filename + '.png' );
|
|
69
|
-
fs.copyFileSync( testImagePath, tmpFileName );
|
|
70
|
-
await inputElement.uploadFile( tmpFileName );
|
|
71
|
-
|
|
72
|
-
// Wait for upload.
|
|
73
|
-
await page.waitForSelector(
|
|
74
|
-
`.media-modal li[aria-label="${ filename }"]`
|
|
75
|
-
);
|
|
76
|
-
|
|
77
|
-
// Insert the uploaded image.
|
|
78
|
-
await page.click( '.media-modal button.media-button-gallery' );
|
|
79
|
-
await page.click( '.media-modal button.media-button-insert' );
|
|
80
|
-
|
|
81
|
-
// Wait for image to be inserted.
|
|
82
|
-
await page.waitForSelector( '.mce-content-body img' );
|
|
83
|
-
|
|
84
|
-
// Move focus away and verify gallery was inserted.
|
|
85
|
-
await pressKeyWithModifier( 'shift', 'Tab' );
|
|
86
|
-
expect( await getEditedPostContent() ).toMatch(
|
|
87
|
-
/\[gallery ids=\"\d+\"\]/
|
|
88
|
-
);
|
|
89
|
-
|
|
90
|
-
// Convert to blocks and verify it worked correctly.
|
|
91
|
-
await clickBlockToolbarButton( 'Convert to blocks', 'content' );
|
|
92
|
-
await page.waitForSelector( '.wp-block[data-type="core/gallery"]' );
|
|
93
|
-
expect( await getEditedPostContent() ).toMatch( /<!-- wp:gallery/ );
|
|
94
|
-
|
|
95
|
-
// Check that you can undo back to a Classic block gallery in one step.
|
|
96
|
-
await pressKeyWithModifier( 'primary', 'z' );
|
|
97
|
-
await page.waitForSelector( 'div[aria-label="Block: Classic"]' );
|
|
98
|
-
expect( await getEditedPostContent() ).toMatch(
|
|
99
|
-
/\[gallery ids=\"\d+\"\]/
|
|
100
|
-
);
|
|
101
|
-
|
|
102
|
-
// Convert to blocks again and verify it worked correctly.
|
|
103
|
-
await clickBlockToolbarButton( 'Convert to blocks', 'content' );
|
|
104
|
-
await page.waitForSelector( '.wp-block[data-type="core/gallery"]' );
|
|
105
|
-
expect( await getEditedPostContent() ).toMatch( /<!-- wp:gallery/ );
|
|
106
|
-
} );
|
|
107
|
-
|
|
108
|
-
it( 'Should not fail after save/reload', async () => {
|
|
109
|
-
// Might move to utils if this becomes useful enough for other tests.
|
|
110
|
-
const runWithoutCache = async ( cb ) => {
|
|
111
|
-
try {
|
|
112
|
-
await page.setCacheEnabled( false );
|
|
113
|
-
await cb();
|
|
114
|
-
} finally {
|
|
115
|
-
await page.setCacheEnabled( true );
|
|
116
|
-
}
|
|
117
|
-
};
|
|
118
|
-
|
|
119
|
-
await insertBlock( 'Classic' );
|
|
120
|
-
|
|
121
|
-
// Wait for TinyMCE to initialise.
|
|
122
|
-
await page.waitForSelector( '.mce-content-body' );
|
|
123
|
-
|
|
124
|
-
// Ensure there is focus.
|
|
125
|
-
await page.focus( '.mce-content-body' );
|
|
126
|
-
await page.keyboard.type( 'test' );
|
|
127
|
-
|
|
128
|
-
// Move focus away.
|
|
129
|
-
await pressKeyWithModifier( 'shift', 'Tab' );
|
|
130
|
-
|
|
131
|
-
// Save.
|
|
132
|
-
await saveDraft();
|
|
133
|
-
|
|
134
|
-
// Reload
|
|
135
|
-
// Disabling the browser disk cache is needed in order to reproduce the issue
|
|
136
|
-
// in case it regresses. To test this, revert commit 65c9f74, build and run the test.
|
|
137
|
-
await runWithoutCache( () => page.reload() );
|
|
138
|
-
|
|
139
|
-
const classicBlockSelector = 'div[aria-label^="Block: Classic"]';
|
|
140
|
-
await page.waitForSelector( classicBlockSelector );
|
|
141
|
-
await page.focus( classicBlockSelector );
|
|
142
|
-
expect( console ).not.toHaveErrored();
|
|
143
|
-
expect( await getEditedPostContent() ).toMatchSnapshot();
|
|
144
|
-
} );
|
|
145
|
-
} );
|
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* WordPress dependencies
|
|
3
|
-
*/
|
|
4
|
-
import { createNewPost, pressKeyWithModifier } from '@wordpress/e2e-test-utils';
|
|
5
|
-
|
|
6
|
-
function isCloseButtonFocused() {
|
|
7
|
-
return page.$eval( ':focus', ( focusedElement ) => {
|
|
8
|
-
return focusedElement.getAttribute( 'aria-label' ) === 'Close';
|
|
9
|
-
} );
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
describe( 'a11y', () => {
|
|
13
|
-
beforeEach( async () => {
|
|
14
|
-
await createNewPost();
|
|
15
|
-
} );
|
|
16
|
-
|
|
17
|
-
it( 'tabs header bar', async () => {
|
|
18
|
-
await pressKeyWithModifier( 'ctrl', '`' );
|
|
19
|
-
await pressKeyWithModifier( 'ctrl', '`' );
|
|
20
|
-
await pressKeyWithModifier( 'ctrl', '`' );
|
|
21
|
-
await pressKeyWithModifier( 'ctrl', '`' );
|
|
22
|
-
await page.keyboard.press( 'Tab' );
|
|
23
|
-
|
|
24
|
-
const isFocusedToggle = await page.$eval(
|
|
25
|
-
':focus',
|
|
26
|
-
( focusedElement ) => {
|
|
27
|
-
return focusedElement.classList.contains(
|
|
28
|
-
'edit-post-header-toolbar__inserter-toggle'
|
|
29
|
-
);
|
|
30
|
-
}
|
|
31
|
-
);
|
|
32
|
-
|
|
33
|
-
expect( isFocusedToggle ).toBe( true );
|
|
34
|
-
} );
|
|
35
|
-
|
|
36
|
-
it( 'constrains focus to a modal when tabbing', async () => {
|
|
37
|
-
// Open keyboard help modal.
|
|
38
|
-
await pressKeyWithModifier( 'access', 'h' );
|
|
39
|
-
|
|
40
|
-
// The close button should not be focused by default; this is a strange UX
|
|
41
|
-
// experience.
|
|
42
|
-
// See: https://github.com/WordPress/gutenberg/issues/9410
|
|
43
|
-
expect( await isCloseButtonFocused() ).toBe( false );
|
|
44
|
-
|
|
45
|
-
await page.keyboard.press( 'Tab' );
|
|
46
|
-
|
|
47
|
-
// Ensure the Close button of the modal is focused after tabbing.
|
|
48
|
-
expect( await isCloseButtonFocused() ).toBe( true );
|
|
49
|
-
} );
|
|
50
|
-
|
|
51
|
-
it( 'returns focus to the first tabbable in a modal after blurring a tabbable', async () => {
|
|
52
|
-
await pressKeyWithModifier( 'access', 'h' );
|
|
53
|
-
|
|
54
|
-
// Click to move focus to an element after the last tabbable within the
|
|
55
|
-
// modal.
|
|
56
|
-
await page.click( '.components-modal__content *:last-child' );
|
|
57
|
-
|
|
58
|
-
await page.keyboard.press( 'Tab' );
|
|
59
|
-
|
|
60
|
-
expect( await isCloseButtonFocused() ).toBe( true );
|
|
61
|
-
} );
|
|
62
|
-
|
|
63
|
-
it( 'returns focus to the last tabbable in a modal after blurring a tabbable and tabbing in reverse direction', async () => {
|
|
64
|
-
await pressKeyWithModifier( 'access', 'h' );
|
|
65
|
-
|
|
66
|
-
// Click to move focus to an element before the first tabbable within
|
|
67
|
-
// the modal.
|
|
68
|
-
await page.click( '.components-modal__header-heading' );
|
|
69
|
-
|
|
70
|
-
await pressKeyWithModifier( 'shift', 'Tab' );
|
|
71
|
-
|
|
72
|
-
expect( await isCloseButtonFocused() ).toBe( true );
|
|
73
|
-
} );
|
|
74
|
-
} );
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
|
-
|
|
3
|
-
exports[`Navigation editor allows creation of a menu when there are existing menu items 1`] = `"<!-- wp:navigation {\\"orientation\\":\\"vertical\\"} /-->"`;
|
|
4
|
-
|
|
5
|
-
exports[`Navigation editor allows creation of a menu when there are no current menu items 1`] = `
|
|
6
|
-
"<!-- wp:navigation {\\"orientation\\":\\"vertical\\"} -->
|
|
7
|
-
<!-- wp:navigation-link {\\"label\\":\\"My page\\",\\"type\\":\\"page\\",\\"id\\":\\"number\\",\\"url\\":\\"string\\",\\"isTopLevelLink\\":true} /-->
|
|
8
|
-
<!-- /wp:navigation -->"
|
|
9
|
-
`;
|
|
10
|
-
|
|
11
|
-
exports[`Navigation editor displays the first created menu when at least one menu exists 1`] = `
|
|
12
|
-
"<!-- wp:navigation {\\"orientation\\":\\"vertical\\"} -->
|
|
13
|
-
<!-- wp:navigation-link {\\"label\\":\\"Home\\",\\"type\\":\\"custom\\",\\"url\\":\\"string\\",\\"kind\\":\\"custom\\",\\"isTopLevelLink\\":true} /-->
|
|
14
|
-
|
|
15
|
-
<!-- wp:navigation-submenu {\\"label\\":\\"About\\",\\"type\\":\\"page\\",\\"id\\":\\"number\\",\\"url\\":\\"string\\",\\"kind\\":\\"post-type\\",\\"isTopLevelItem\\":true} -->
|
|
16
|
-
<!-- wp:navigation-link {\\"label\\":\\"Our team\\",\\"type\\":\\"page\\",\\"id\\":\\"number\\",\\"url\\":\\"string\\",\\"kind\\":\\"post-type\\",\\"isTopLevelLink\\":false} /-->
|
|
17
|
-
<!-- /wp:navigation-submenu -->
|
|
18
|
-
|
|
19
|
-
<!-- wp:navigation-submenu {\\"label\\":\\"Shop\\",\\"type\\":\\"page\\",\\"id\\":\\"number\\",\\"url\\":\\"string\\",\\"kind\\":\\"post-type\\",\\"isTopLevelItem\\":true} -->
|
|
20
|
-
<!-- wp:navigation-submenu {\\"label\\":\\"Winter apparel\\",\\"type\\":\\"page\\",\\"id\\":\\"number\\",\\"url\\":\\"string\\",\\"kind\\":\\"post-type\\",\\"isTopLevelItem\\":false} -->
|
|
21
|
-
<!-- wp:navigation-link {\\"label\\":\\"Chunky socks\\",\\"type\\":\\"page\\",\\"id\\":\\"number\\",\\"url\\":\\"string\\",\\"kind\\":\\"post-type\\",\\"isTopLevelLink\\":false} /-->
|
|
22
|
-
|
|
23
|
-
<!-- wp:navigation-link {\\"label\\":\\"Hideous hats\\",\\"type\\":\\"page\\",\\"id\\":\\"number\\",\\"url\\":\\"string\\",\\"kind\\":\\"post-type\\",\\"isTopLevelLink\\":false} /-->
|
|
24
|
-
|
|
25
|
-
<!-- wp:navigation-link {\\"label\\":\\"Glorious gloves\\",\\"type\\":\\"page\\",\\"id\\":\\"number\\",\\"url\\":\\"string\\",\\"kind\\":\\"post-type\\",\\"isTopLevelLink\\":false} /-->
|
|
26
|
-
|
|
27
|
-
<!-- wp:navigation-link {\\"label\\":\\"Jazzy Jumpers\\",\\"type\\":\\"page\\",\\"id\\":\\"number\\",\\"url\\":\\"string\\",\\"kind\\":\\"post-type\\",\\"isTopLevelLink\\":false} /-->
|
|
28
|
-
<!-- /wp:navigation-submenu -->
|
|
29
|
-
<!-- /wp:navigation-submenu -->
|
|
30
|
-
|
|
31
|
-
<!-- wp:navigation-link {\\"label\\":\\"Shipping\\",\\"type\\":\\"page\\",\\"id\\":\\"number\\",\\"url\\":\\"string\\",\\"kind\\":\\"post-type\\",\\"isTopLevelLink\\":true} /-->
|
|
32
|
-
|
|
33
|
-
<!-- wp:navigation-link {\\"label\\":\\"Contact Us\\",\\"type\\":\\"page\\",\\"id\\":\\"number\\",\\"url\\":\\"string\\",\\"kind\\":\\"post-type\\",\\"isTopLevelLink\\":true} /-->
|
|
34
|
-
|
|
35
|
-
<!-- wp:navigation-submenu {\\"label\\":\\"WordPress.org\\",\\"type\\":\\"custom\\",\\"url\\":\\"string\\",\\"kind\\":\\"custom\\",\\"isTopLevelItem\\":true} -->
|
|
36
|
-
<!-- wp:navigation-link {\\"label\\":\\"Google\\",\\"type\\":\\"custom\\",\\"url\\":\\"string\\",\\"kind\\":\\"custom\\",\\"isTopLevelLink\\":false} /-->
|
|
37
|
-
<!-- /wp:navigation-submenu -->
|
|
38
|
-
<!-- /wp:navigation -->"
|
|
39
|
-
`;
|