Skip to content

Commit a9221d2

Browse files
committed
implement e2e tests for row block transforms
1 parent 6bb4d21 commit a9221d2

File tree

3 files changed

+137
-0
lines changed

3 files changed

+137
-0
lines changed
Lines changed: 92 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,92 @@
1+
/// <reference types="Cypress" />
2+
import { testBlockTransform } from '../../support/row/transform-tests';
3+
import { getAllBlocks } from 'cypress-wp-test-utils';
4+
5+
context( 'Row Block Transforms', () => {
6+
describe( 'Custom template enabled', () => {
7+
beforeEach( () => {
8+
cy.loginUser();
9+
cy.createNewPost();
10+
} );
11+
12+
it( 'Should be possible to transform 2 blocks to row block', () => {
13+
cy.insertBlock( 'Heading' );
14+
cy.insertBlock( 'Heading' );
15+
16+
testBlockTransform();
17+
cy.postContentMatchesSnapshot();
18+
} );
19+
20+
it( 'Should be possible to transform 3 blocks to row block', () => {
21+
cy.insertBlock( 'Heading' );
22+
cy.insertBlock( 'Heading' );
23+
cy.insertBlock( 'Heading' );
24+
25+
testBlockTransform();
26+
cy.postContentMatchesSnapshot();
27+
} );
28+
29+
it( 'Should be possible to transform 4 blocks to row block', () => {
30+
cy.insertBlock( 'Heading' );
31+
cy.insertBlock( 'Heading' );
32+
cy.insertBlock( 'Heading' );
33+
cy.insertBlock( 'Heading' );
34+
35+
testBlockTransform();
36+
cy.postContentMatchesSnapshot();
37+
} );
38+
39+
it( 'Columns should not be smaller than 3', () => {
40+
cy.insertBlock( 'Heading' );
41+
cy.insertBlock( 'Heading' );
42+
cy.insertBlock( 'Heading' );
43+
cy.insertBlock( 'Heading' );
44+
cy.insertBlock( 'Heading' );
45+
46+
testBlockTransform();
47+
cy.postContentMatchesSnapshot();
48+
} );
49+
} );
50+
51+
describe( 'Custom template disabled', () => {
52+
before( () => {
53+
cy.loginUser();
54+
cy.activatePlugin( 'wp-bootstrap-blocks-test-row-filters' );
55+
} );
56+
57+
after( () => {
58+
cy.loginUser();
59+
cy.deactivatePlugin( 'wp-bootstrap-blocks-test-row-filters' );
60+
} );
61+
62+
beforeEach( () => {
63+
cy.loginUser();
64+
cy.createNewPost();
65+
} );
66+
67+
it( 'Should not be possible to transform blocks if custom template is disabled', () => {
68+
cy.insertBlock( 'Heading' );
69+
cy.insertBlock( 'Heading' );
70+
71+
return getAllBlocks().then( ( blocks ) => {
72+
const firstBlockId = blocks[ 0 ].clientId;
73+
const lastBlockId = blocks[ blocks.length - 1 ].clientId;
74+
75+
return cy
76+
.window()
77+
.then( ( window ) => {
78+
return window.wp.data
79+
.dispatch( 'core/block-editor' )
80+
.multiSelect( firstBlockId, lastBlockId );
81+
} )
82+
.then( () => {
83+
// Transform block
84+
cy.clickBlockToolbarButton( 'Heading' );
85+
cy.get(
86+
'.editor-block-list-item-wp-bootstrap-blocks-row'
87+
).should( 'not.exist' );
88+
} );
89+
} );
90+
} );
91+
} );
92+
} );
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import { getAllBlocks } from 'cypress-wp-test-utils';
2+
3+
export const testBlockTransform = () => {
4+
return getAllBlocks().then( ( blocks ) => {
5+
const blockCount = blocks.length;
6+
const firstBlockId = blocks[ 0 ].clientId;
7+
const lastBlockId = blocks[ blocks.length - 1 ].clientId;
8+
const expectedColumnSize = Math.max( Math.round( 12 / blockCount ), 3 );
9+
10+
return cy
11+
.window()
12+
.then( ( window ) => {
13+
return window.wp.data
14+
.dispatch( 'core/block-editor' )
15+
.multiSelect( firstBlockId, lastBlockId );
16+
} )
17+
.then( () => {
18+
// Transform block
19+
cy.clickBlockToolbarButton( 'Heading' );
20+
cy.get(
21+
'.editor-block-list-item-wp-bootstrap-blocks-row'
22+
).click();
23+
24+
cy.get(
25+
`[data-type="wp-bootstrap-blocks/column"][data-size-md="${ expectedColumnSize }"]`
26+
).should( 'have.length', blockCount );
27+
} );
28+
} );
29+
};

snapshots.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -150,5 +150,21 @@ module.exports = {
150150
"wp_bootstrap_blocks_column_default_attributes should override default attributes": {
151151
"1": "<!-- wp:wp-bootstrap-blocks/row -->\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":6} /-->\n\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":6} /-->\n<!-- /wp:wp-bootstrap-blocks/row -->"
152152
}
153+
},
154+
"Row Block Transforms": {
155+
"Custom template enabled": {
156+
"Should be possible to transform 2 blocks to row block": {
157+
"1": "<!-- wp:wp-bootstrap-blocks/row {\"template\":\"custom\"} -->\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":6} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":6} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n<!-- /wp:wp-bootstrap-blocks/row -->"
158+
},
159+
"Should be possible to transform 3 blocks to row block": {
160+
"1": "<!-- wp:wp-bootstrap-blocks/row {\"template\":\"custom\"} -->\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":4} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":4} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":4} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n<!-- /wp:wp-bootstrap-blocks/row -->"
161+
},
162+
"Should be possible to transform 4 blocks to row block": {
163+
"1": "<!-- wp:wp-bootstrap-blocks/row {\"template\":\"custom\"} -->\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":3} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":3} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":3} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":3} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n<!-- /wp:wp-bootstrap-blocks/row -->"
164+
},
165+
"Columns should not be smaller than 3": {
166+
"1": "<!-- wp:wp-bootstrap-blocks/row {\"template\":\"custom\"} -->\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":3} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":3} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":3} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":3} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n\n<!-- wp:wp-bootstrap-blocks/column {\"sizeMd\":3} -->\n<!-- wp:heading -->\n<h2></h2>\n<!-- /wp:heading -->\n<!-- /wp:wp-bootstrap-blocks/column -->\n<!-- /wp:wp-bootstrap-blocks/row -->"
167+
}
168+
}
153169
}
154170
}

0 commit comments

Comments
 (0)