Skip to content

Commit a2777ab

Browse files
committed
E2E: Add new E2E tests.
1 parent dda0d99 commit a2777ab

File tree

3 files changed

+264
-1
lines changed

3 files changed

+264
-1
lines changed

tests/cypress/config.js

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,13 @@ module.exports = defineConfig( {
2121
setupNodeEvents( on, config ) {
2222
return setBaseUrl( on, config );
2323
},
24-
specPattern: 'tests/cypress/e2e/**/*.test.{js,jsx,ts,tsx}',
24+
specPattern: [
25+
'tests/cypress/e2e/admin.test.js',
26+
'tests/cypress/e2e/connect.test.js',
27+
'tests/cypress/e2e/settings.test.js',
28+
'tests/cypress/e2e/mailchimp-block.test.js',
29+
'tests/cypress/e2e/logout.test.js',
30+
],
2531
supportFile: 'tests/cypress/support/index.js',
2632
defaultCommandTimeout: 20000,
2733
},

tests/cypress/e2e/logout.test.js

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
/* eslint-disable no-undef */
2+
describe('Logout tests', () => {
3+
before(() => {
4+
cy.login();
5+
});
6+
7+
it('Admin can logout', () => {
8+
cy.visit('/wp-admin/admin.php?page=mailchimp_sf_options');
9+
cy.get('#mailchimp_sf_oauth_connect').should('not.exist');
10+
cy.get('input[value="Logout"]').click();
11+
12+
// connect to "Mailchimp" Account button should be visible.
13+
cy.get('#mailchimp_sf_oauth_connect').should('exist');
14+
});
15+
});
Lines changed: 242 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,242 @@
1+
/* eslint-disable no-undef */
2+
describe('Block Tests', () => {
3+
let postId;
4+
5+
before(() => {
6+
cy.login();
7+
});
8+
9+
it('Admin can create a Signup form using Mailchimp block', () => {
10+
const postTitle = 'Mailchimp signup form - Block';
11+
const beforeSave = () => {
12+
cy.insertBlock('mailchimp/mailchimp', 'Mailchimp List Subscribe Form');
13+
cy.wait(500);
14+
};
15+
cy.createPost({ title: postTitle, content: '', beforeSave }).then((postBlock) => {
16+
if (postBlock) {
17+
postId = postBlock.id;
18+
cy.visit(`/?p=${postId}`);
19+
cy.get('#mc_signup').should('exist');
20+
cy.get('#mc_mv_EMAIL').should('exist');
21+
cy.get('#mc_signup_submit').should('exist');
22+
cy.get('#mc_signup_submit').click();
23+
cy.get('.mc_error_msg').should('exist');
24+
cy.get('.mc_error_msg').contains('Email Address: This value should not be blank.');
25+
}
26+
});
27+
});
28+
29+
it('Admin can set header and sub-header in block', () => {
30+
cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`);
31+
32+
// Set content options
33+
const header = '[BLOCK] Subscribe to our newsletter';
34+
const subHeader =
35+
'[BLOCK] Join our mailing list to receive the latest news and updates from our team.';
36+
const button = 'Subscribe Now';
37+
cy.getBlockEditor().find('h2[aria-label="Enter a header."]').clear().type(header);
38+
cy.getBlockEditor().find('h3[aria-label="Enter a sub header."]').clear().type(subHeader);
39+
cy.getBlockEditor().find('button[aria-label="Enter a button text."]').clear().type(button);
40+
cy.get('button.editor-post-publish-button').click();
41+
42+
// Verify
43+
cy.visit(`/?p=${postId}`);
44+
cy.get('.mc_custom_border_hdr').contains(header);
45+
cy.get('#mc_subheader').contains(subHeader);
46+
cy.get('#mc_signup_submit').contains(button);
47+
});
48+
49+
it('Admin can re-order form fields in block', () => {
50+
cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`);
51+
52+
// Re-order email field
53+
cy.getBlockEditor().find('div[data-title="Email Field"]').click();
54+
cy.get('.block-editor-block-toolbar__block-controls').should('be.visible');
55+
56+
cy.get('.block-editor-block-toolbar__block-controls')
57+
.find('button[aria-label="Move down"]')
58+
.click();
59+
cy.get('button.editor-post-publish-button').click();
60+
61+
// Verify order of fields
62+
cy.visit(`/?p=${postId}`);
63+
cy.get('.mc_form_inside .wp-block-mailchimp-mailchimp-form-field:nth-child(3)').contains(
64+
'Email Address',
65+
);
66+
67+
// Re-order email field
68+
cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`);
69+
cy.getBlockEditor().find('div[data-title="Email Field"]').click();
70+
cy.get('.block-editor-block-toolbar__block-controls').should('be.visible');
71+
72+
cy.get('.block-editor-block-toolbar__block-controls')
73+
.find('button[aria-label="Move up"]')
74+
.click();
75+
cy.get('button.editor-post-publish-button').click();
76+
77+
// Verify order of fields
78+
cy.visit(`/?p=${postId}`);
79+
cy.get('.mc_form_inside .wp-block-mailchimp-mailchimp-form-field:nth-child(2)').contains(
80+
'Email Address',
81+
);
82+
});
83+
84+
it('Admin can show/hide the form fields in block', () => {
85+
cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`);
86+
87+
// Hide First name field
88+
cy.getBlockEditor().find('label[for="FNAME"]').click();
89+
cy.get('.block-editor-block-toolbar__slot').should('be.visible');
90+
91+
cy.get('.block-editor-block-toolbar__slot').find('button[aria-label="Visibility"]').click();
92+
cy.get('button.editor-post-publish-button').click();
93+
cy.wait(500);
94+
95+
// Verify
96+
cy.visit(`/?p=${postId}`);
97+
cy.get('#mc_mv_FNAME').should('not.exist');
98+
99+
// Show First name field
100+
cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`);
101+
cy.getBlockEditor().find('div[data-title="Email Field"]').click();
102+
cy.getBlockEditor().find('label[for="FNAME"]').click();
103+
cy.get('.block-editor-block-toolbar__slot').should('be.visible');
104+
105+
cy.get('.block-editor-block-toolbar__slot')
106+
.find('button[aria-label="Visibility"].is-pressed')
107+
.click();
108+
cy.get('button.editor-post-publish-button').click();
109+
cy.wait(500);
110+
111+
// Verify
112+
cy.visit(`/?p=${postId}`);
113+
cy.get('#mc_mv_FNAME').should('exist');
114+
});
115+
116+
it('Admin can show/hide groups from block settings', () => {
117+
// Show groups
118+
cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`);
119+
cy.getBlockEditor().find('h2[aria-label="Enter a header."]').click();
120+
cy.openDocumentSettingsPanel('Settings', 'Block');
121+
cy.get('.mailchimp-interest-groups input.components-form-toggle__input').first().check();
122+
123+
cy.get('button.editor-post-publish-button').click();
124+
cy.wait(500);
125+
126+
// Verify
127+
cy.visit(`/?p=${postId}`);
128+
cy.get('.mc_interests_header').should('exist');
129+
cy.get('.mc_interest').should('exist');
130+
131+
// Hide groups
132+
cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`);
133+
cy.getBlockEditor().find('h2[aria-label="Enter a header."]').click();
134+
cy.openDocumentSettingsPanel('Settings', 'Block');
135+
cy.get('.mailchimp-interest-groups input.components-form-toggle__input').first().uncheck();
136+
137+
cy.get('button.editor-post-publish-button').click();
138+
cy.wait(500);
139+
140+
// Verify
141+
cy.visit(`/?p=${postId}`);
142+
cy.get('.mc_interests_header').should('not.exist');
143+
cy.get('.mc_interest').should('not.exist');
144+
});
145+
146+
it('Admin can edit form field label in block', () => {
147+
// Show groups
148+
cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`);
149+
const emailLabel = 'Email Address [EDITED]';
150+
cy.getBlockEditor().find('label[for="EMAIL"] label').clear().type(emailLabel);
151+
152+
cy.get('button.editor-post-publish-button').click();
153+
cy.wait(500);
154+
155+
// Verify
156+
cy.visit(`/?p=${postId}`);
157+
cy.get('#mc_mv_EMAIL').should('exist');
158+
cy.get('label[for="mc_mv_EMAIL"]').contains(emailLabel);
159+
});
160+
161+
it('Admin can show/hide unsubscribe link from block settings', () => {
162+
// display unsubscribe link.
163+
cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`);
164+
cy.getBlockEditor().find('h2[aria-label="Enter a header."]').click();
165+
cy.openDocumentSettingsPanel('Form Settings', 'Block');
166+
cy.get('.mailchimp-unsubscribe-link input.components-form-toggle__input').first().check();
167+
cy.get('button.editor-post-publish-button').click();
168+
cy.wait(500);
169+
170+
// Verify
171+
cy.visit(`/?p=${postId}`);
172+
cy.get('#mc_unsub_link').should('exist');
173+
174+
// Reset
175+
cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`);
176+
cy.getBlockEditor().find('h2[aria-label="Enter a header."]').click();
177+
cy.openDocumentSettingsPanel('Form Settings', 'Block');
178+
cy.get('.mailchimp-unsubscribe-link input.components-form-toggle__input').first().uncheck();
179+
cy.get('button.editor-post-publish-button').click();
180+
cy.wait(500);
181+
182+
// Verify
183+
cy.visit(`/?p=${postId}`);
184+
cy.get('#mc_unsub_link').should('not.exist');
185+
});
186+
187+
it('Admin can change audience list from block settings', () => {
188+
// display unsubscribe link.
189+
cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`);
190+
cy.getBlockEditor().find('h2[aria-label="Enter a header."]').click();
191+
cy.openDocumentSettingsPanel('Settings', 'Block');
192+
cy.get('.mailchimp-list-select select').select('Alternate 10up Audience');
193+
cy.wait(2000);
194+
cy.getBlockEditor().find('label[for="EMAIL"] label').contains('Email Address');
195+
cy.getBlockEditor().find('label[for="MMERGE9"]').should('not.exist');
196+
197+
cy.get('button.editor-post-publish-button').click();
198+
cy.wait(500);
199+
200+
// Verify
201+
cy.visit(`/?p=${postId}`);
202+
cy.get('#mc_signup').should('exist');
203+
cy.get('#mc_mv_EMAIL').should('exist');
204+
cy.get('#mc_signup_submit').should('exist');
205+
206+
// Reset
207+
cy.visit(`/wp-admin/post.php?post=${postId}&action=edit`);
208+
cy.getBlockEditor().find('h2[aria-label="Enter a header."]').click();
209+
cy.openDocumentSettingsPanel('Settings', 'Block');
210+
cy.get('.mailchimp-list-select select').select('10up');
211+
cy.wait(2000);
212+
cy.getBlockEditor().find('label[for="MMERGE9"]').should('exist');
213+
cy.get('button.editor-post-publish-button').click();
214+
cy.wait(500);
215+
});
216+
217+
it('[Backward Compatibility] Admin can see settings for the existing old block', () => {
218+
cy.wpCli(
219+
`wp post create --post_title='OLD BLOCK' --post_content='<!-- wp:mailchimp/mailchimp -->' --post_status='publish' --porcelain`,
220+
).then((response) => {
221+
const oldBlockPostId = response.stdout;
222+
cy.visit(`/?p=${oldBlockPostId}`);
223+
cy.get('#mc_signup').should('exist');
224+
cy.get('#mc_mv_EMAIL').should('exist');
225+
cy.get('#mc_signup_submit').should('exist');
226+
227+
cy.visit(`/wp-admin/post.php?post=${oldBlockPostId}&action=edit`);
228+
const header = '[NEW BLOCK] Subscribe to our newsletter';
229+
cy.getBlockEditor().find('h2[aria-label="Enter a header."]').clear().type(header);
230+
cy.get('button.editor-post-publish-button').click();
231+
cy.wait(500);
232+
233+
// Verify
234+
cy.visit(`/?p=${oldBlockPostId}`);
235+
cy.get('.mc_custom_border_hdr').contains(header);
236+
});
237+
});
238+
239+
// TODO: Add tests for the Double Opt-in and Update existing subscribers settings.
240+
// TODO: Add tests for the block styles settings.
241+
// TODO: Add tests for the form submission.
242+
});

0 commit comments

Comments
 (0)