Skip to content

Commit 37e1579

Browse files
david-szabo97david-szabo97
authored
Site Editor: Add e2e tests for templates export (#28324)
Add end-to-end tests for site editor templates export functionality.
1 parent 502f79a commit 37e1579

File tree

6 files changed

+105
-39
lines changed

6 files changed

+105
-39
lines changed

‎packages/e2e-tests/experimental-features.js

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -100,3 +100,33 @@ export const navigationPanel = {
100100
await item.click();
101101
},
102102
};
103+
104+
export const siteEditor = {
105+
async visit() {
106+
const query = addQueryArgs( '', {
107+
page: 'gutenberg-edit-site',
108+
} ).slice( 1 );
109+
await visitAdminPage( 'admin.php', query );
110+
await page.waitForSelector( '.edit-site-visual-editor iframe' );
111+
},
112+
113+
async toggleMoreMenu() {
114+
// eslint-disable-next-line jest/no-standalone-expect
115+
await expect( page ).toClick(
116+
'.edit-site-more-menu [aria-label="More tools & options"]'
117+
);
118+
},
119+
120+
async clickOnMoreMenuItem( buttonLabel ) {
121+
await this.toggleMoreMenu();
122+
const moreMenuContainerSelector =
123+
'//*[contains(concat(" ", @class, " "), " edit-site-more-menu__content ")]';
124+
const elementToClick = (
125+
await page.$x(
126+
`${ moreMenuContainerSelector }//span[contains(concat(" ", @class, " "), " components-menu-item__item ")][contains(text(), "${ buttonLabel }")]`
127+
)
128+
)[ 0 ];
129+
130+
await elementToClick.click();
131+
},
132+
};

‎packages/e2e-tests/specs/experiments/multi-entity-editing.test.js

Lines changed: 4 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -3,27 +3,17 @@
33
*/
44
import {
55
insertBlock,
6-
visitAdminPage,
76
createNewPost,
87
publishPost,
98
trashAllPosts,
109
activateTheme,
1110
canvas,
1211
} from '@wordpress/e2e-test-utils';
13-
import { addQueryArgs } from '@wordpress/url';
1412

1513
/**
1614
* Internal dependencies
1715
*/
18-
import { navigationPanel } from '../../experimental-features';
19-
20-
const visitSiteEditor = async () => {
21-
const query = addQueryArgs( '', {
22-
page: 'gutenberg-edit-site',
23-
} ).slice( 1 );
24-
await visitAdminPage( 'admin.php', query );
25-
await page.waitForSelector( '.edit-site-visual-editor iframe' );
26-
};
16+
import { navigationPanel, siteEditor } from '../../experimental-features';
2717

2818
const clickTemplateItem = async ( menus, itemName ) => {
2919
await navigationPanel.open();
@@ -138,12 +128,12 @@ describe( 'Multi-entity editor states', () => {
138128
} );
139129

140130
it( 'should not display any dirty entities when loading the site editor', async () => {
141-
await visitSiteEditor();
131+
await siteEditor.visit();
142132
expect( await openEntitySavePanel() ).toBe( false );
143133
} );
144134

145135
it( 'should not dirty an entity by switching to it in the template dropdown', async () => {
146-
await visitSiteEditor();
136+
await siteEditor.visit();
147137
await clickTemplateItem( 'Template Parts', 'header' );
148138
await page.waitForFunction( () =>
149139
Array.from( window.frames ).find(
@@ -194,7 +184,7 @@ describe( 'Multi-entity editor states', () => {
194184
true
195185
);
196186
await saveAllEntities();
197-
await visitSiteEditor();
187+
await siteEditor.visit();
198188

199189
// Wait for site editor to load.
200190
await canvas().waitForSelector(

‎packages/e2e-tests/specs/experiments/multi-entity-saving.test.js

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,17 +5,15 @@ import {
55
createNewPost,
66
insertBlock,
77
publishPost,
8-
visitAdminPage,
98
trashAllPosts,
109
activateTheme,
1110
canvas,
1211
} from '@wordpress/e2e-test-utils';
13-
import { addQueryArgs } from '@wordpress/url';
1412

1513
/**
1614
* Internal dependencies
1715
*/
18-
import { navigationPanel } from '../../experimental-features';
16+
import { navigationPanel, siteEditor } from '../../experimental-features';
1917

2018
describe( 'Multi-entity save flow', () => {
2119
// Selectors - usable between Post/Site editors.
@@ -186,10 +184,7 @@ describe( 'Multi-entity save flow', () => {
186184

187185
it( 'Save flow should work as expected', async () => {
188186
// Navigate to site editor.
189-
const query = addQueryArgs( '', {
190-
page: 'gutenberg-edit-site',
191-
} ).slice( 1 );
192-
await visitAdminPage( 'admin.php', query );
187+
await siteEditor.visit();
193188

194189
// Ensure we are on 'front-page' demo template.
195190
await navigationPanel.open();

‎packages/e2e-tests/specs/experiments/site-editor-export.test.js

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
/**
2+
* External dependencies
3+
*/
4+
import fs from 'fs';
5+
import path from 'path';
6+
import os from 'os';
7+
8+
/**
9+
* WordPress dependencies
10+
*/
11+
import { trashAllPosts, activateTheme } from '@wordpress/e2e-test-utils';
12+
13+
/**
14+
* Internal dependencies
15+
*/
16+
import { siteEditor } from '../../experimental-features';
17+
18+
async function waitForFileExists( filePath, timeout = 10000 ) {
19+
const start = Date.now();
20+
while ( ! fs.existsSync( filePath ) ) {
21+
// Puppeteer doesn't have an API for managing file downloads.
22+
// We are using `waitForTimeout` to add delays between check of file existence.
23+
// eslint-disable-next-line no-restricted-syntax
24+
await page.waitForTimeout( 1000 );
25+
if ( Date.now() - start > timeout ) {
26+
throw Error( 'waitForFileExists timeout' );
27+
}
28+
}
29+
}
30+
31+
describe( 'Site Editor Templates Export', () => {
32+
beforeAll( async () => {
33+
await activateTheme( 'tt1-blocks' );
34+
await trashAllPosts( 'wp_template' );
35+
await trashAllPosts( 'wp_template_part' );
36+
} );
37+
38+
afterAll( async () => {
39+
await activateTheme( 'twentytwentyone' );
40+
} );
41+
42+
beforeEach( async () => {
43+
await siteEditor.visit();
44+
} );
45+
46+
it( 'clicking export should download edit-site-export.zip file', async () => {
47+
const directory = fs.mkdtempSync(
48+
path.join( os.tmpdir(), 'test-edit-site-export-' )
49+
);
50+
await page._client.send( 'Page.setDownloadBehavior', {
51+
behavior: 'allow',
52+
downloadPath: directory,
53+
} );
54+
55+
await siteEditor.clickOnMoreMenuItem( 'Export' );
56+
const filePath = path.join( directory, 'edit-site-export.zip' );
57+
await waitForFileExists( filePath );
58+
expect( fs.existsSync( filePath ) ).toBe( true );
59+
fs.unlinkSync( filePath );
60+
} );
61+
} );

‎packages/e2e-tests/specs/experiments/template-part.test.js

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -5,20 +5,18 @@ import {
55
createNewPost,
66
insertBlock,
77
disablePrePublishChecks,
8-
visitAdminPage,
98
trashAllPosts,
109
activateTheme,
1110
getAllBlocks,
1211
selectBlockByClientId,
1312
clickBlockToolbarButton,
1413
canvas,
1514
} from '@wordpress/e2e-test-utils';
16-
import { addQueryArgs } from '@wordpress/url';
1715

1816
/**
1917
* Internal dependencies
2018
*/
21-
import { navigationPanel } from '../../experimental-features';
19+
import { navigationPanel, siteEditor } from '../../experimental-features';
2220

2321
describe( 'Template Part', () => {
2422
beforeAll( async () => {
@@ -34,13 +32,7 @@ describe( 'Template Part', () => {
3432

3533
describe( 'Template part block', () => {
3634
beforeEach( async () => {
37-
await visitAdminPage(
38-
'admin.php',
39-
addQueryArgs( '', {
40-
page: 'gutenberg-edit-site',
41-
} ).slice( 1 )
42-
);
43-
await page.waitForSelector( '.edit-site-visual-editor iframe' );
35+
await siteEditor.visit();
4436
} );
4537

4638
async function updateHeader( content ) {

‎packages/e2e-tests/specs/performance/site-editor.test.js

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,14 @@ import { writeFileSync } from 'fs';
99
*/
1010
import {
1111
trashAllPosts,
12-
visitAdminPage,
1312
activateTheme,
1413
canvas,
1514
} from '@wordpress/e2e-test-utils';
16-
import { addQueryArgs } from '@wordpress/url';
15+
16+
/**
17+
* Internal dependencies
18+
*/
19+
import { siteEditor } from '../../experimental-features';
1720

1821
jest.setTimeout( 1000000 );
1922

@@ -39,12 +42,7 @@ describe( 'Site Editor Performance', () => {
3942
inserterHover: [],
4043
};
4144

42-
await visitAdminPage(
43-
'admin.php',
44-
addQueryArgs( '', {
45-
page: 'gutenberg-edit-site',
46-
} ).slice( 1 )
47-
);
45+
await siteEditor.visit();
4846

4947
let i = 3;
5048

0 commit comments

Comments
 (0)