Skip to content

Commit 7145fcd

Browse files
committed
migrate row block transforms e2e tests to playwright
1 parent 21d84ee commit 7145fcd

6 files changed

Lines changed: 262 additions & 92 deletions

cypress/e2e/row/row-block-transforms.cy.js

Lines changed: 0 additions & 92 deletions
This file was deleted.
Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
<!-- wp:wp-bootstrap-blocks/row {"template":"custom"} -->
2+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":3} -->
3+
<!-- wp:heading -->
4+
<h2 class="wp-block-heading"></h2>
5+
<!-- /wp:heading -->
6+
<!-- /wp:wp-bootstrap-blocks/column -->
7+
8+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":3} -->
9+
<!-- wp:heading -->
10+
<h2 class="wp-block-heading"></h2>
11+
<!-- /wp:heading -->
12+
<!-- /wp:wp-bootstrap-blocks/column -->
13+
14+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":3} -->
15+
<!-- wp:heading -->
16+
<h2 class="wp-block-heading"></h2>
17+
<!-- /wp:heading -->
18+
<!-- /wp:wp-bootstrap-blocks/column -->
19+
20+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":3} -->
21+
<!-- wp:heading -->
22+
<h2 class="wp-block-heading"></h2>
23+
<!-- /wp:heading -->
24+
<!-- /wp:wp-bootstrap-blocks/column -->
25+
26+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":3} -->
27+
<!-- wp:heading -->
28+
<h2 class="wp-block-heading"></h2>
29+
<!-- /wp:heading -->
30+
<!-- /wp:wp-bootstrap-blocks/column -->
31+
<!-- /wp:wp-bootstrap-blocks/row -->
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!-- wp:wp-bootstrap-blocks/row {"template":"custom"} -->
2+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":6} -->
3+
<!-- wp:heading -->
4+
<h2 class="wp-block-heading"></h2>
5+
<!-- /wp:heading -->
6+
<!-- /wp:wp-bootstrap-blocks/column -->
7+
8+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":6} -->
9+
<!-- wp:heading -->
10+
<h2 class="wp-block-heading"></h2>
11+
<!-- /wp:heading -->
12+
<!-- /wp:wp-bootstrap-blocks/column -->
13+
<!-- /wp:wp-bootstrap-blocks/row -->
Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!-- wp:wp-bootstrap-blocks/row {"template":"custom"} -->
2+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":4} -->
3+
<!-- wp:heading -->
4+
<h2 class="wp-block-heading"></h2>
5+
<!-- /wp:heading -->
6+
<!-- /wp:wp-bootstrap-blocks/column -->
7+
8+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":4} -->
9+
<!-- wp:heading -->
10+
<h2 class="wp-block-heading"></h2>
11+
<!-- /wp:heading -->
12+
<!-- /wp:wp-bootstrap-blocks/column -->
13+
14+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":4} -->
15+
<!-- wp:heading -->
16+
<h2 class="wp-block-heading"></h2>
17+
<!-- /wp:heading -->
18+
<!-- /wp:wp-bootstrap-blocks/column -->
19+
<!-- /wp:wp-bootstrap-blocks/row -->
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<!-- wp:wp-bootstrap-blocks/row {"template":"custom"} -->
2+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":3} -->
3+
<!-- wp:heading -->
4+
<h2 class="wp-block-heading"></h2>
5+
<!-- /wp:heading -->
6+
<!-- /wp:wp-bootstrap-blocks/column -->
7+
8+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":3} -->
9+
<!-- wp:heading -->
10+
<h2 class="wp-block-heading"></h2>
11+
<!-- /wp:heading -->
12+
<!-- /wp:wp-bootstrap-blocks/column -->
13+
14+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":3} -->
15+
<!-- wp:heading -->
16+
<h2 class="wp-block-heading"></h2>
17+
<!-- /wp:heading -->
18+
<!-- /wp:wp-bootstrap-blocks/column -->
19+
20+
<!-- wp:wp-bootstrap-blocks/column {"sizeMd":3} -->
21+
<!-- wp:heading -->
22+
<h2 class="wp-block-heading"></h2>
23+
<!-- /wp:heading -->
24+
<!-- /wp:wp-bootstrap-blocks/column -->
25+
<!-- /wp:wp-bootstrap-blocks/row -->
Lines changed: 174 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,174 @@
1+
const { test, expect } = require( '@wordpress/e2e-test-utils-playwright' );
2+
3+
test.describe( 'Row Block Transforms - Custom template enabled', () => {
4+
test.beforeEach( async ( { admin, editor, page } ) => {
5+
await admin.createNewPost();
6+
await editor.openDocumentSettingsSidebar();
7+
} );
8+
9+
test( 'Transform two blocks to row block', async ( { editor, page } ) => {
10+
await editor.insertBlock( {
11+
name: 'core/heading',
12+
} );
13+
await editor.insertBlock( {
14+
name: 'core/heading',
15+
} );
16+
17+
await editor.selectBlocks(
18+
page.getByLabel( 'Block: Heading' ).nth( 0 ),
19+
page.getByLabel( 'Block: Heading' ).nth( 1 )
20+
);
21+
22+
// Transform selected heading blocks to row
23+
await editor.transformBlockTo( 'wp-bootstrap-blocks/row' );
24+
25+
// One row block with 2 columns of size 6 should have been created
26+
expect(
27+
await page
28+
.getByLabel( 'Block: Column (Bootstrap)' )
29+
.nth( 0 )
30+
.getAttribute( 'data-size-md' )
31+
).toBe( '6' );
32+
expect(
33+
await page
34+
.getByLabel( 'Block: Column (Bootstrap)' )
35+
.nth( 1 )
36+
.getAttribute( 'data-size-md' )
37+
).toBe( '6' );
38+
39+
expect( await editor.getEditedPostContent() ).toMatchSnapshot(
40+
'transform-2-blocks-to-row-block.txt'
41+
);
42+
} );
43+
44+
test( 'Transform 3 blocks to row block', async ( { editor, page } ) => {
45+
await editor.insertBlock( {
46+
name: 'core/heading',
47+
} );
48+
await editor.insertBlock( {
49+
name: 'core/heading',
50+
} );
51+
await editor.insertBlock( {
52+
name: 'core/heading',
53+
} );
54+
55+
await editor.selectBlocks(
56+
page.getByLabel( 'Block: Heading' ).nth( 0 ),
57+
page.getByLabel( 'Block: Heading' ).nth( 2 )
58+
);
59+
60+
// Transform selected heading blocks to row
61+
await editor.transformBlockTo( 'wp-bootstrap-blocks/row' );
62+
63+
// One row block with 3 columns of size 4 should have been created
64+
expect( await editor.getEditedPostContent() ).toMatchSnapshot(
65+
'transform-3-blocks-to-row-block.txt'
66+
);
67+
} );
68+
69+
test( 'Transform 4 blocks to row block', async ( { editor, page } ) => {
70+
await editor.insertBlock( {
71+
name: 'core/heading',
72+
} );
73+
await editor.insertBlock( {
74+
name: 'core/heading',
75+
} );
76+
await editor.insertBlock( {
77+
name: 'core/heading',
78+
} );
79+
await editor.insertBlock( {
80+
name: 'core/heading',
81+
} );
82+
83+
await editor.selectBlocks(
84+
page.getByLabel( 'Block: Heading' ).nth( 0 ),
85+
page.getByLabel( 'Block: Heading' ).nth( 3 )
86+
);
87+
88+
// Transform selected heading blocks to row
89+
await editor.transformBlockTo( 'wp-bootstrap-blocks/row' );
90+
91+
// One row block with 4 columns of size 3 should have been created
92+
expect( await editor.getEditedPostContent() ).toMatchSnapshot(
93+
'transform-4-blocks-to-row-block.txt'
94+
);
95+
} );
96+
97+
test( 'Columns should not be smaller than 3', async ( {
98+
editor,
99+
page,
100+
} ) => {
101+
await editor.insertBlock( {
102+
name: 'core/heading',
103+
} );
104+
await editor.insertBlock( {
105+
name: 'core/heading',
106+
} );
107+
await editor.insertBlock( {
108+
name: 'core/heading',
109+
} );
110+
await editor.insertBlock( {
111+
name: 'core/heading',
112+
} );
113+
await editor.insertBlock( {
114+
name: 'core/heading',
115+
} );
116+
117+
await editor.selectBlocks(
118+
page.getByLabel( 'Block: Heading' ).nth( 0 ),
119+
page.getByLabel( 'Block: Heading' ).nth( 4 )
120+
);
121+
122+
// Transform selected heading blocks to row
123+
await editor.transformBlockTo( 'wp-bootstrap-blocks/row' );
124+
125+
// One row block with 4 columns of size 3 should have been created
126+
expect( await editor.getEditedPostContent() ).toMatchSnapshot(
127+
'columns-should-not-be-smaller-than-3.txt'
128+
);
129+
} );
130+
} );
131+
132+
test.describe( 'Row Block Transforms - Custom template disabled', () => {
133+
test.beforeAll( async ( { requestUtils } ) => {
134+
await requestUtils.activatePlugin(
135+
'wp-bootstrap-blocks-test-row-filters'
136+
);
137+
} );
138+
139+
test.afterAll( async ( { requestUtils } ) => {
140+
await requestUtils.deactivatePlugin(
141+
'wp-bootstrap-blocks-test-row-filters'
142+
);
143+
} );
144+
145+
test.beforeEach( async ( { admin, editor, page } ) => {
146+
await admin.createNewPost();
147+
await editor.openDocumentSettingsSidebar();
148+
} );
149+
150+
test( 'Not able to transform blocks if custom template is disabled', async ( {
151+
editor,
152+
page,
153+
} ) => {
154+
await editor.insertBlock( {
155+
name: 'core/heading',
156+
} );
157+
await editor.insertBlock( {
158+
name: 'core/heading',
159+
} );
160+
161+
await editor.selectBlocks(
162+
page.getByLabel( 'Block: Heading' ).nth( 0 ),
163+
page.getByLabel( 'Block: Heading' ).nth( 1 )
164+
);
165+
166+
// Transformation to row block should not be available
167+
await page.locator( '.block-editor-block-switcher__toggle' ).click();
168+
await expect(
169+
await page.locator(
170+
'.editor-block-list-item-wp-bootstrap-blocks-row'
171+
)
172+
).not.toBeVisible();
173+
} );
174+
} );

0 commit comments

Comments
 (0)