|
| 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