Skip to content

Commit b1caaca

Browse files
authored
Merge pull request #114 from eea/develop
Release
2 parents 1e8b5dd + 09ffceb commit b1caaca

4 files changed

Lines changed: 241 additions & 1 deletion

File tree

CHANGELOG.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ All notable changes to this project will be documented in this file. Dates are d
44

55
Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
66

7+
### [9.0.2](https://github.com/eea/volto-columns-block/compare/9.0.1...9.0.2) - 15 April 2026
8+
79
### [9.0.1](https://github.com/eea/volto-columns-block/compare/9.0.0...9.0.1) - 8 April 2026
810

911
## [9.0.0](https://github.com/eea/volto-columns-block/compare/8.1.1...9.0.0) - 27 March 2026
Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
import { slateBeforeEach, slateAfterEach } from '../support/e2e';
2+
3+
const setPageTitle = (title) => {
4+
cy.clearSlateTitle();
5+
cy.getSlateTitle().type(title);
6+
cy.get('.documentFirstHeading').contains(title);
7+
};
8+
9+
const addColumnsBlock = () => {
10+
cy.getSlate().click();
11+
cy.get('.ui.basic.icon.button.block-add-button').first().click();
12+
cy.get('.blocks-chooser .title').contains('Common').click();
13+
cy.get('.content.active.common .button.columnsBlock')
14+
.contains('Columns')
15+
.click({ force: true });
16+
};
17+
18+
const selectColumnsVariation = (label) => {
19+
cy.contains('.columns-block .ui.card .content p', label)
20+
.should('be.visible')
21+
.click({ force: true });
22+
};
23+
24+
const typeInColumn = (index, text) => {
25+
cy.get('.columns-block .block-column')
26+
.eq(index)
27+
.within(() => {
28+
cy.get('[contenteditable=true]')
29+
.first()
30+
.focus()
31+
.click({ force: true })
32+
.type(text);
33+
});
34+
};
35+
36+
const saveAndAssertViewUrl = () => {
37+
cy.get('#toolbar-save').click();
38+
cy.url().should('eq', `${Cypress.config().baseUrl}/cypress/my-page`);
39+
};
40+
41+
describe('Columns Block: View Mode Tests', () => {
42+
beforeEach(slateBeforeEach);
43+
afterEach(slateAfterEach);
44+
45+
it('persists columns content across edit-view cycles', () => {
46+
setPageTitle('Columns View Persistence');
47+
addColumnsBlock();
48+
selectColumnsVariation('50 / 50');
49+
50+
typeInColumn(0, 'Left column content');
51+
typeInColumn(1, 'Right column initial');
52+
53+
saveAndAssertViewUrl();
54+
55+
cy.get('#page-document .columns-view')
56+
.should('exist')
57+
.and('contain', 'Left column content')
58+
.and('contain', 'Right column initial');
59+
60+
cy.visit('/cypress/my-page/edit');
61+
cy.get('.columns-block').should('contain', 'Left column content');
62+
cy.get('.columns-block').should('contain', 'Right column initial');
63+
64+
saveAndAssertViewUrl();
65+
66+
cy.get('#page-document .columns-view')
67+
.should('exist')
68+
.and('contain', 'Left column content')
69+
.and('contain', 'Right column initial');
70+
});
71+
72+
it('renders three-column layout content in view mode', () => {
73+
setPageTitle('Three Columns View');
74+
addColumnsBlock();
75+
selectColumnsVariation('33 / 33 / 33');
76+
77+
typeInColumn(0, 'First column text');
78+
typeInColumn(1, 'Second column text');
79+
typeInColumn(2, 'Third column text');
80+
81+
saveAndAssertViewUrl();
82+
83+
cy.get(
84+
'#page-document .columns-view .column-grid .column-blocks-wrapper',
85+
).should('have.length', 3);
86+
cy.get('#page-document .columns-view')
87+
.should('contain', 'First column text')
88+
.and('contain', 'Second column text')
89+
.and('contain', 'Third column text');
90+
});
91+
});
Lines changed: 147 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,147 @@
1+
import { slateBeforeEach, slateAfterEach } from '../support/e2e';
2+
3+
const setPageTitle = (title) => {
4+
cy.clearSlateTitle();
5+
cy.getSlateTitle().type(title);
6+
cy.get('.documentFirstHeading').contains(title);
7+
};
8+
9+
const addColumnsBlock = () => {
10+
cy.getSlate().click();
11+
cy.get('.ui.basic.icon.button.block-add-button').first().click();
12+
cy.get('.blocks-chooser .title').contains('Common').click();
13+
cy.get('.content.active.common .button.columnsBlock')
14+
.contains('Columns')
15+
.click({ force: true });
16+
};
17+
18+
const selectColumnsVariation = (label) => {
19+
cy.contains('.columns-block .ui.card .content p', label)
20+
.should('be.visible')
21+
.click({ force: true });
22+
};
23+
24+
const openColumnsSettings = () => {
25+
cy.get('.columns-block .columns-header').first().click({ force: true });
26+
};
27+
28+
const typeInColumn = (index, text) => {
29+
cy.get('.columns-block .block-column')
30+
.eq(index)
31+
.within(() => {
32+
cy.get('[contenteditable=true]')
33+
.first()
34+
.focus()
35+
.click({ force: true })
36+
.type(text);
37+
});
38+
};
39+
40+
const openFirstColumnSettings = () => {
41+
cy.get(
42+
'.field-wrapper-data .columns-area button[title="Go to Column settings"]',
43+
)
44+
.first()
45+
.click({ force: true });
46+
};
47+
48+
const setColumnVerticalAlign = (label) => {
49+
cy.get('body').then(($body) => {
50+
if (
51+
$body.find('.field-wrapper-grid_vertical_align .react-select__control')
52+
.length
53+
) {
54+
cy.get('.field-wrapper-grid_vertical_align .react-select__control')
55+
.first()
56+
.click({ force: true });
57+
cy.contains('.react-select__option', label).click({ force: true });
58+
return;
59+
}
60+
61+
if (
62+
$body.find('.field-wrapper-grid_vertical_align select:visible').length
63+
) {
64+
cy.get('.field-wrapper-grid_vertical_align select:visible')
65+
.first()
66+
.select(label, { force: true });
67+
return;
68+
}
69+
70+
cy.get('.field-wrapper-grid_vertical_align #field-grid_vertical_align')
71+
.first()
72+
.click({ force: true });
73+
cy.contains('.menu .item, .item', label).first().click({ force: true });
74+
});
75+
};
76+
77+
const setCheckbox = (field, checked) => {
78+
cy.get(`input#field-${field}`).then(($input) => {
79+
const isChecked = $input.prop('checked');
80+
if (isChecked !== checked) {
81+
cy.wrap($input)[checked ? 'check' : 'uncheck']({ force: true });
82+
}
83+
});
84+
cy.get(`input#field-${field}`).should(
85+
checked ? 'be.checked' : 'not.be.checked',
86+
);
87+
};
88+
89+
const saveAndAssertViewUrl = () => {
90+
cy.get('#toolbar-save').click();
91+
cy.url().should('eq', `${Cypress.config().baseUrl}/cypress/my-page`);
92+
};
93+
94+
describe('Columns Block: Settings Tests', () => {
95+
beforeEach(slateBeforeEach);
96+
afterEach(slateAfterEach);
97+
98+
it('applies column style settings in view mode', () => {
99+
setPageTitle('Columns Column Settings');
100+
addColumnsBlock();
101+
selectColumnsVariation('50 / 50');
102+
103+
typeInColumn(0, 'Primary column');
104+
typeInColumn(1, 'Secondary column');
105+
openColumnsSettings();
106+
openFirstColumnSettings();
107+
setColumnVerticalAlign('Middle');
108+
109+
saveAndAssertViewUrl();
110+
111+
cy.get('#page-document .columns-view .column-grid .column-blocks-wrapper')
112+
.first()
113+
.should('have.css', 'vertical-align', 'middle');
114+
cy.get('#page-document .columns-view')
115+
.should('contain', 'Primary column')
116+
.and('contain', 'Secondary column');
117+
});
118+
119+
it('toggles reverse wrap in view mode across edit-view cycle', () => {
120+
setPageTitle('Columns Reverse Wrap');
121+
addColumnsBlock();
122+
selectColumnsVariation('50 / 50');
123+
124+
typeInColumn(0, 'Column A');
125+
typeInColumn(1, 'Column B');
126+
127+
openColumnsSettings();
128+
setCheckbox('reverseWrap', true);
129+
130+
saveAndAssertViewUrl();
131+
132+
cy.get('#page-document .columns-view .column-grid')
133+
.should('have.class', 'reverse-wrap')
134+
.and('contain', 'Column A')
135+
.and('contain', 'Column B');
136+
137+
cy.visit('/cypress/my-page/edit');
138+
openColumnsSettings();
139+
setCheckbox('reverseWrap', false);
140+
saveAndAssertViewUrl();
141+
142+
cy.get('#page-document .columns-view .column-grid').should(
143+
'not.have.class',
144+
'reverse-wrap',
145+
);
146+
});
147+
});

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@eeacms/volto-columns-block",
3-
"version": "9.0.1",
3+
"version": "9.0.2",
44
"description": "volto-columns-block: Volto add-on",
55
"main": "src/index.js",
66
"author": "European Environment Agency: IDM2 A-Team",

0 commit comments

Comments
 (0)