@wordpress/e2e-tests 5.6.0 → 6.1.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.
Files changed (35) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/assets/small-post-with-containers.html +77 -0
  3. package/config/performance-reporter.js +22 -6
  4. package/config/setup-performance-test.js +3 -0
  5. package/package.json +9 -9
  6. package/plugins/inner-blocks-templates/index.js +29 -0
  7. package/specs/editor/blocks/__snapshots__/heading.test.js.snap +7 -7
  8. package/specs/editor/blocks/heading.test.js +1 -1
  9. package/specs/editor/plugins/block-directory-add.test.js +1 -1
  10. package/specs/editor/various/__snapshots__/block-grouping.test.js.snap +4 -4
  11. package/specs/editor/various/__snapshots__/inserting-blocks.test.js.snap +2 -2
  12. package/specs/editor/various/__snapshots__/keep-styles-on-block-transforms.test.js.snap +3 -3
  13. package/specs/editor/various/__snapshots__/list-view.test.js.snap +1 -1
  14. package/specs/editor/various/__snapshots__/multi-block-selection.test.js.snap +4 -4
  15. package/specs/editor/various/__snapshots__/rich-text.test.js.snap +1 -1
  16. package/specs/editor/various/a11y.test.js +3 -1
  17. package/specs/editor/various/block-hierarchy-navigation.test.js +2 -4
  18. package/specs/editor/various/block-switcher.test.js +14 -13
  19. package/specs/editor/various/editor-modes.test.js +3 -7
  20. package/specs/editor/various/keyboard-navigable-blocks.test.js +7 -0
  21. package/specs/editor/various/multi-block-selection.test.js +1 -1
  22. package/specs/editor/various/reusable-blocks.test.js +2 -2
  23. package/specs/editor/various/sidebar.test.js +0 -2
  24. package/specs/experiments/blocks/post-comments-form.test.js +7 -8
  25. package/specs/performance/post-editor.test.js +98 -44
  26. package/specs/performance/site-editor.test.js +3 -0
  27. package/specs/site-editor/global-styles-sidebar.test.js +2 -0
  28. package/specs/site-editor/multi-entity-saving.test.js +18 -12
  29. package/specs/site-editor/settings-sidebar.test.js +3 -0
  30. package/specs/site-editor/site-editor-export.test.js +2 -0
  31. package/specs/editor/blocks/__snapshots__/quote.test.js.snap +0 -123
  32. package/specs/editor/blocks/quote.test.js +0 -199
  33. package/specs/editor/various/font-size-picker.test.js +0 -314
  34. package/specs/editor/various/toolbar-roving-tabindex.test.js +0 -142
  35. package/specs/site-editor/multi-entity-editing.test.js +0 -309
@@ -1,309 +0,0 @@
1
- /**
2
- * WordPress dependencies
3
- */
4
- import {
5
- insertBlock,
6
- createNewPost,
7
- publishPost,
8
- deleteAllTemplates,
9
- activateTheme,
10
- canvas,
11
- openDocumentSettingsSidebar,
12
- pressKeyWithModifier,
13
- selectBlockByClientId,
14
- visitSiteEditor,
15
- clickSiteEditorMenuItem,
16
- navigateSiteEditorBackToRoot,
17
- openSiteEditorNavigationPanel,
18
- siteEditorNavigateSequence,
19
- } from '@wordpress/e2e-test-utils';
20
-
21
- const clickTemplateItem = async ( menus, itemName ) => {
22
- await openSiteEditorNavigationPanel();
23
- await navigateSiteEditorBackToRoot();
24
- await siteEditorNavigateSequence( menus );
25
- await clickSiteEditorMenuItem( itemName );
26
- };
27
-
28
- const createTemplatePart = async (
29
- templatePartName = 'test-template-part',
30
- isNested = false
31
- ) => {
32
- // Create new template part.
33
- await insertBlock( 'Template Part' );
34
- const [ createNewButton ] = await page.$x(
35
- '//button[contains(text(), "New template part")]'
36
- );
37
- await createNewButton.click();
38
- await page.waitForSelector(
39
- isNested
40
- ? '.wp-block-template-part .wp-block-template-part.block-editor-block-list__layout'
41
- : '.wp-block-template-part.block-editor-block-list__layout'
42
- );
43
- await openDocumentSettingsSidebar();
44
-
45
- const advancedPanelXPath = `//div[contains(@class,"interface-interface-skeleton__sidebar")]//button[@class="components-button components-panel__body-toggle"][contains(text(),"Advanced")]`;
46
- const advancedPanel = await page.waitForXPath( advancedPanelXPath );
47
- await advancedPanel.click();
48
-
49
- const nameInputXPath = `${ advancedPanelXPath }/ancestor::div[contains(@class, "components-panel__body")]//div[contains(@class,"components-base-control__field")]//label[contains(text(), "Title")]/following-sibling::input`;
50
- const nameInput = await page.waitForXPath( nameInputXPath );
51
- await nameInput.click();
52
-
53
- // Select all of the text in the title field.
54
- await pressKeyWithModifier( 'primary', 'a' );
55
-
56
- // Give the reusable block a title.
57
- await page.keyboard.type( templatePartName );
58
- };
59
-
60
- const editTemplatePart = async ( textToAdd, isNested = false ) => {
61
- await page.click(
62
- `${
63
- isNested
64
- ? '.wp-block-template-part .wp-block-template-part'
65
- : '.wp-block-template-part'
66
- } .block-editor-button-block-appender`
67
- );
68
- await page.click( '.editor-block-list-item-paragraph' );
69
- for ( const text of textToAdd ) {
70
- await page.keyboard.type( text );
71
- await page.keyboard.press( 'Enter' );
72
- }
73
- };
74
-
75
- const saveAllEntities = async () => {
76
- if ( await openEntitySavePanel() ) {
77
- await page.click( 'button.editor-entities-saved-states__save-button' );
78
- }
79
- };
80
-
81
- const openEntitySavePanel = async () => {
82
- // Open the entity save panel if it is not already open.
83
- try {
84
- await page.waitForSelector( '.entities-saved-states__panel', {
85
- timeout: 500,
86
- } );
87
- } catch {
88
- try {
89
- await page.click(
90
- '.edit-site-save-button__button[aria-disabled=false]',
91
- { timeout: 500 }
92
- );
93
- } catch {
94
- try {
95
- await page.click(
96
- '.editor-post-publish-button__button.has-changes-dot',
97
- { timeout: 500 }
98
- );
99
- } catch {
100
- return false; // Not dirty because the button is disabled.
101
- }
102
- }
103
- await page.waitForSelector( '.entities-saved-states__panel' );
104
- }
105
- // If we made it this far, the panel is opened.
106
-
107
- return true;
108
- };
109
-
110
- const isEntityDirty = async ( name ) => {
111
- const isOpen = await openEntitySavePanel();
112
- if ( ! isOpen ) {
113
- return false;
114
- }
115
- try {
116
- await page.waitForXPath(
117
- `//label[@class="components-checkbox-control__label"]//strong[contains(text(),"${ name }")]`,
118
- { timeout: 1000 }
119
- );
120
- return true;
121
- } catch {}
122
- return false;
123
- };
124
-
125
- const removeErrorMocks = () => {
126
- // TODO: Add back console mocks when
127
- // https://github.com/WordPress/gutenberg/issues/17355 is fixed.
128
- /* eslint-disable no-console */
129
- console.warn.mockReset();
130
- console.error.mockReset();
131
- console.info.mockReset();
132
- /* eslint-enable no-console */
133
- };
134
-
135
- describe( 'Multi-entity editor states', () => {
136
- beforeAll( async () => {
137
- await activateTheme( 'emptytheme' );
138
- await deleteAllTemplates( 'wp_template' );
139
- await deleteAllTemplates( 'wp_template_part' );
140
- } );
141
-
142
- afterAll( async () => {
143
- await activateTheme( 'twentytwentyone' );
144
- } );
145
-
146
- it( 'should not display any dirty entities when loading the site editor', async () => {
147
- await visitSiteEditor();
148
- expect( await openEntitySavePanel() ).toBe( false );
149
- } );
150
-
151
- // Skip reason: This should be rewritten to use other methods to switching to different templates.
152
- it.skip( 'should not dirty an entity by switching to it in the template dropdown', async () => {
153
- await visitSiteEditor( {
154
- postId: 'emptytheme//header',
155
- postType: 'wp_template_part',
156
- } );
157
- await page.waitForFunction( () =>
158
- Array.from( window.frames ).find(
159
- ( { name } ) => name === 'editor-canvas'
160
- )
161
- );
162
-
163
- // Wait for blocks to load.
164
- await canvas().waitForSelector( '.wp-block' );
165
- expect( await isEntityDirty( 'header' ) ).toBe( false );
166
- expect( await isEntityDirty( 'Index' ) ).toBe( false );
167
-
168
- // Switch back and make sure it is still clean.
169
- await clickTemplateItem( 'Templates', 'Index' );
170
- await page.waitForFunction( () =>
171
- Array.from( window.frames ).find(
172
- ( { name } ) => name === 'editor-canvas'
173
- )
174
- );
175
- await canvas().waitForSelector( '.wp-block' );
176
- expect( await isEntityDirty( 'header' ) ).toBe( false );
177
- expect( await isEntityDirty( 'Index' ) ).toBe( false );
178
-
179
- removeErrorMocks();
180
- } );
181
-
182
- describe( 'Multi-entity edit', () => {
183
- const templatePartName = 'Test Template Part Name Edit';
184
- const nestedTPName = 'Test Nested Template Part Name Edit';
185
- const templateName = 'Custom Template';
186
-
187
- beforeAll( async () => {
188
- await deleteAllTemplates( 'wp_template' );
189
- await deleteAllTemplates( 'wp_template_part' );
190
- await createNewPost( {
191
- postType: 'wp_template',
192
- title: templateName,
193
- } );
194
- await publishPost();
195
- await createTemplatePart( templatePartName );
196
- await editTemplatePart( [
197
- 'Default template part test text.',
198
- 'Second paragraph test.',
199
- ] );
200
- await createTemplatePart( nestedTPName, true );
201
- await editTemplatePart(
202
- [ 'Nested Template Part Text.', 'Second Nested test.' ],
203
- true
204
- );
205
- await saveAllEntities();
206
- await visitSiteEditor();
207
-
208
- // Wait for site editor to load.
209
- await canvas().waitForSelector(
210
- '.wp-block-template-part.block-editor-block-list__layout'
211
- );
212
-
213
- // Our custom template shows up in the "Templates > General" menu; let's use it.
214
- await clickTemplateItem(
215
- [ 'Templates', 'General templates' ],
216
- templateName
217
- );
218
- await page.waitForXPath(
219
- `//h1[contains(@class, "edit-site-document-actions__title") and contains(text(), '${ templateName }')]`
220
- );
221
-
222
- removeErrorMocks();
223
- } );
224
-
225
- const saveAndWaitResponse = async () => {
226
- await Promise.all( [
227
- saveAllEntities(),
228
-
229
- // Wait for the save request and the subsequent query to be
230
- // fulfilled - both are requests made to /index.php route.
231
- // Without that, clicked elements can lose focus sometimes
232
- // when the response is received.
233
- page.waitForResponse( ( response ) => {
234
- return (
235
- response.url().includes( 'index.php' ) &&
236
- response.request().method() === 'POST'
237
- );
238
- } ),
239
-
240
- page.waitForResponse( ( response ) => {
241
- return (
242
- response.url().includes( 'index.php' ) &&
243
- response.request().method() === 'GET'
244
- );
245
- } ),
246
- ] );
247
- removeErrorMocks();
248
- };
249
-
250
- it.skip( 'should only dirty the parent entity when editing the parent', async () => {
251
- // Clear selection so that the block is not added to the template part.
252
- await insertBlock( 'Paragraph' );
253
-
254
- // Add changes to the main parent entity.
255
- await page.keyboard.type( 'Test.' );
256
-
257
- expect( await isEntityDirty( templateName ) ).toBe( true );
258
- expect( await isEntityDirty( templatePartName ) ).toBe( false );
259
- expect( await isEntityDirty( nestedTPName ) ).toBe( false );
260
- await saveAndWaitResponse();
261
- } );
262
-
263
- it.skip( 'should only dirty the child when editing the child', async () => {
264
- // Select parent TP to unlock selecting content.
265
- await canvas().click( '.wp-block-template-part' );
266
- await canvas().click(
267
- '.wp-block-template-part .wp-block[data-type="core/paragraph"]'
268
- );
269
- await page.keyboard.type( 'Some more test words!' );
270
-
271
- expect( await isEntityDirty( templateName ) ).toBe( false );
272
- expect( await isEntityDirty( templatePartName ) ).toBe( true );
273
- expect( await isEntityDirty( nestedTPName ) ).toBe( false );
274
- await saveAndWaitResponse();
275
- } );
276
-
277
- it.skip( 'should only dirty the nested entity when editing the nested entity', async () => {
278
- // Select parent TP to unlock selecting child.
279
- await canvas().click( '.wp-block-template-part' );
280
- // Select child TP to unlock selecting content.
281
- await canvas().click(
282
- '.wp-block-template-part .wp-block-template-part'
283
- );
284
- await canvas().click(
285
- '.wp-block-template-part .wp-block-template-part .wp-block[data-type="core/paragraph"]'
286
- );
287
- await page.keyboard.type( 'Nested test words!' );
288
-
289
- expect( await isEntityDirty( templateName ) ).toBe( false );
290
- expect( await isEntityDirty( templatePartName ) ).toBe( false );
291
- expect( await isEntityDirty( nestedTPName ) ).toBe( true );
292
- await saveAndWaitResponse();
293
- } );
294
-
295
- it.skip( 'should not allow selecting template part content without parent selected', async () => {
296
- // Unselect blocks.
297
- await selectBlockByClientId();
298
- // Try to select a child block of a template part.
299
- await canvas().click(
300
- '.wp-block-template-part .wp-block-template-part .wp-block[data-type="core/paragraph"]'
301
- );
302
-
303
- const selectedBlock = await page.evaluate( () => {
304
- return wp.data.select( 'core/block-editor' ).getSelectedBlock();
305
- } );
306
- expect( selectedBlock?.name ).toBe( 'core/template-part' );
307
- } );
308
- } );
309
- } );