Added basic newsletter creation test
refs https://github.com/TryGhost/Team/issues/1477 - Very basic test only - Includes some extra test attributes in the components - Commented out a test that was not yet fininished
This commit is contained in:
parent
86c08eaf88
commit
492702304e
|
@ -17,10 +17,11 @@
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
class="gh-btn"
|
class="gh-btn"
|
||||||
|
data-test-button="confirm-newsletter-email"
|
||||||
{{on "click" @close}}
|
{{on "click" @close}}
|
||||||
{{on-key "Enter"}}
|
{{on-key "Enter"}}
|
||||||
>
|
>
|
||||||
<span>Ok</span>
|
<span>Ok</span>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<div class="modal-content">
|
<div class="modal-content" data-test-modal="edit-newsletter">
|
||||||
<div class="modal-body modal-fullsettings">
|
<div class="modal-body modal-fullsettings">
|
||||||
<div class="modal-fullsettings-body gh-newsletters-labs">
|
<div class="modal-fullsettings-body gh-newsletters-labs">
|
||||||
<div class="modal-fullsettings-sidebar-labs">
|
<div class="modal-fullsettings-sidebar-labs">
|
||||||
|
@ -61,4 +61,4 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -62,8 +62,8 @@ export default class EditNewsletterModal extends Component {
|
||||||
return result;
|
return result;
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
if (e === undefined) {
|
if (e === undefined) {
|
||||||
// ensure task button shows failed state
|
// Validation error
|
||||||
throw new Error('Validation failed');
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
throw e;
|
throw e;
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<div class="modal-content">
|
<div class="modal-content" data-test-modal="create-newsletter">
|
||||||
<header class="modal-header">
|
<header class="modal-header">
|
||||||
<h1>Create newsletter</h1>
|
<h1>Create newsletter</h1>
|
||||||
</header>
|
</header>
|
||||||
|
@ -74,4 +74,4 @@
|
||||||
data-test-button="save-newsletter"
|
data-test-button="save-newsletter"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -51,8 +51,8 @@ export default class NewNewsletterModal extends Component {
|
||||||
return result;
|
return result;
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
if (e === undefined) {
|
if (e === undefined) {
|
||||||
// ensure task button shows failed state
|
// Validation error
|
||||||
throw new Error('Validation failed');
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
throw e;
|
throw e;
|
||||||
|
|
|
@ -85,11 +85,11 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="gh-newsletter-card-block cta-block">
|
<div class="gh-newsletter-card-block cta-block">
|
||||||
{{#if this.displayingDefault}}
|
{{#if this.displayingDefault}}
|
||||||
<LinkTo @route="settings.members-email-labs.edit-newsletter" @model={{newsletter.id}} class="gh-btn gh-btn-green"><span>Customize →</span></LinkTo>
|
<LinkTo @route="settings.members-email-labs.edit-newsletter" @model={{newsletter.id}} class="gh-btn gh-btn-green" data-test-button="customize-newsletter"><span>Customize →</span></LinkTo>
|
||||||
{{else}}
|
{{else}}
|
||||||
<GhBasicDropdown @verticalPosition="below" @horizontalPosition="right" @renderInPlace={{true}} as |dd|>
|
<GhBasicDropdown @verticalPosition="below" @horizontalPosition="right" @renderInPlace={{true}} as |dd|>
|
||||||
<dd.Trigger class="gh-btn gh-btn-action-icon gh-btn-icon gh-btn-outline gh-product-card-actions-button icon-only">
|
<dd.Trigger class="gh-btn gh-btn-action-icon gh-btn-icon gh-btn-outline gh-product-card-actions-button icon-only">
|
||||||
<span>
|
<span data-test-newsletter-menu-trigger>
|
||||||
{{svg-jar "dotdotdot"}}
|
{{svg-jar "dotdotdot"}}
|
||||||
<span class="hidden">Actions</span>
|
<span class="hidden">Actions</span>
|
||||||
</span>
|
</span>
|
||||||
|
@ -97,7 +97,7 @@
|
||||||
<dd.Content class="relative-dropdown-menu gh-newsletter-actions-menu">
|
<dd.Content class="relative-dropdown-menu gh-newsletter-actions-menu">
|
||||||
<ul class="dropdown-menu dropdown-triangle-top-right" role="listbox" {{css-transition "anim-fade-in-scale"}}>
|
<ul class="dropdown-menu dropdown-triangle-top-right" role="listbox" {{css-transition "anim-fade-in-scale"}}>
|
||||||
<li>
|
<li>
|
||||||
<LinkTo @route="settings.members-email-labs.edit-newsletter" @model={{newsletter.id}} class="mr2"><span>Edit</span></LinkTo>
|
<LinkTo @route="settings.members-email-labs.edit-newsletter" @model={{newsletter.id}} class="mr2" data-test-button="customize-newsletter"><span>Edit</span></LinkTo>
|
||||||
</li>
|
</li>
|
||||||
{{#if (eq newsletter.status "active")}}
|
{{#if (eq newsletter.status "active")}}
|
||||||
<li>
|
<li>
|
||||||
|
@ -127,6 +127,6 @@
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
{{#if (feature "multipleNewslettersUI")}}
|
{{#if (feature "multipleNewslettersUI")}}
|
||||||
<LinkTo @route="settings.members-email-labs.new-newsletter" class="gh-add-newsletter">{{svg-jar "add-stroke"}}Add newsletter</LinkTo>
|
<LinkTo @route="settings.members-email-labs.new-newsletter" class="gh-add-newsletter" data-test-button="add-newsletter">{{svg-jar "add-stroke"}}Add newsletter</LinkTo>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import {authenticateSession} from 'ember-simple-auth/test-support';
|
import {authenticateSession} from 'ember-simple-auth/test-support';
|
||||||
import {click, currentURL, find} from '@ember/test-helpers';
|
import {click, currentURL, fillIn, find, findAll} from '@ember/test-helpers';
|
||||||
import {disableLabsFlag, enableLabsFlag} from '../../helpers/labs-flag';
|
import {disableLabsFlag, enableLabsFlag} from '../../helpers/labs-flag';
|
||||||
import {expect} from 'chai';
|
import {expect} from 'chai';
|
||||||
import {setupApplicationTest} from 'ember-mocha';
|
import {setupApplicationTest} from 'ember-mocha';
|
||||||
|
@ -46,3 +46,131 @@ describe('Acceptance: Settings - Members email (multipleNewsletters)', function
|
||||||
expect(this.server.db.settings.findBy({key: 'email_track_opens'}).value).to.equal(false);
|
expect(this.server.db.settings.findBy({key: 'email_track_opens'}).value).to.equal(false);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('Acceptance: Settings - Members email (multipleNewslettersUI)', function () {
|
||||||
|
const hooks = setupApplicationTest();
|
||||||
|
setupMirage(hooks);
|
||||||
|
|
||||||
|
beforeEach(async function () {
|
||||||
|
this.server.loadFixtures('configs');
|
||||||
|
|
||||||
|
const role = this.server.create('role', {name: 'Owner'});
|
||||||
|
this.server.create('user', {roles: [role]});
|
||||||
|
|
||||||
|
enableLabsFlag(this.server, 'multipleNewsletters');
|
||||||
|
enableLabsFlag(this.server, 'multipleNewslettersUI');
|
||||||
|
|
||||||
|
return await authenticateSession();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('can manage open rate tracking', async function () {
|
||||||
|
this.server.db.settings.update({key: 'email_track_opens'}, {value: 'true'});
|
||||||
|
|
||||||
|
await visit('/settings/newsletters');
|
||||||
|
expect(find('[data-test-checkbox="email-track-opens"]')).to.be.checked;
|
||||||
|
|
||||||
|
await click('[data-test-label="email-track-opens"]');
|
||||||
|
expect(find('[data-test-checkbox="email-track-opens"]')).to.not.be.checked;
|
||||||
|
|
||||||
|
await click('[data-test-button="save-members-settings"]');
|
||||||
|
|
||||||
|
expect(this.server.db.settings.findBy({key: 'email_track_opens'}).value).to.equal(false);
|
||||||
|
});
|
||||||
|
|
||||||
|
async function checkValidationError(regexp) {
|
||||||
|
// Create the newsletter
|
||||||
|
await click('[data-test-button="save-newsletter"]');
|
||||||
|
|
||||||
|
expect(findAll('.error > .response').length, 'error message is displayed').to.equal(1);
|
||||||
|
expect(find('.error > .response').textContent).to.match(regexp);
|
||||||
|
|
||||||
|
// Check button is in error state
|
||||||
|
expect(find('[data-test-button="save-newsletter"] > [data-test-task-button-state="failure"]')).to.exist;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function checkSave(options) {
|
||||||
|
const name = options.edit ? 'edit' : 'create';
|
||||||
|
|
||||||
|
// Create the newsletter
|
||||||
|
await click('[data-test-button="save-newsletter"]');
|
||||||
|
|
||||||
|
// No errors
|
||||||
|
expect(findAll('.error > .response').length, 'error message is displayed').to.equal(0);
|
||||||
|
|
||||||
|
if (options.shouldVerifyEmail) {
|
||||||
|
expect(find('[data-test-modal="confirm-newsletter-email"]'), 'Confirm email modal').to.exist;
|
||||||
|
await click('[data-test-button="confirm-newsletter-email"]');
|
||||||
|
}
|
||||||
|
|
||||||
|
// Check if modal closes on save
|
||||||
|
expect(find(`[data-test-modal="${name}-newsletter"]`), 'Newsletter modal should disappear after saving').to.not.exist;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function fillName(name) {
|
||||||
|
await fillIn('input#newsletter-title', name);
|
||||||
|
}
|
||||||
|
|
||||||
|
it('can create new newsletter', async function () {
|
||||||
|
await visit('/settings/newsletters');
|
||||||
|
await click('[data-test-button="add-newsletter"]');
|
||||||
|
|
||||||
|
// Check if modal opens
|
||||||
|
expect(find('[data-test-modal="create-newsletter"]'), 'Create newsletter modal').to.exist;
|
||||||
|
|
||||||
|
// Fill in the newsletter name
|
||||||
|
await fillName('My new newsletter');
|
||||||
|
|
||||||
|
// Fill in the newsletter description
|
||||||
|
await fillIn('textarea#newsletter-description', 'My newsletter description');
|
||||||
|
|
||||||
|
await checkSave({});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('validates create newsletter before saving', async function () {
|
||||||
|
await visit('/settings/newsletters');
|
||||||
|
await click('[data-test-button="add-newsletter"]');
|
||||||
|
|
||||||
|
// Check if modal opens
|
||||||
|
expect(find('[data-test-modal="create-newsletter"]'), 'Create newsletter modal').to.exist;
|
||||||
|
|
||||||
|
// Invalid name error when you try to save
|
||||||
|
await checkValidationError(/Please enter a name./);
|
||||||
|
|
||||||
|
// Fill in the newsletter name
|
||||||
|
await fillName('My new newsletter');
|
||||||
|
|
||||||
|
// Everything should be valid
|
||||||
|
await checkSave({});
|
||||||
|
});
|
||||||
|
|
||||||
|
/*it('validates edit fields before saving', async function () {
|
||||||
|
await visit('/settings/newsletters');
|
||||||
|
|
||||||
|
// This one is only needed because we already created a second newsletter in previous test
|
||||||
|
await click('[data-test-newsletter-menu-trigger]');
|
||||||
|
await click('[data-test-button="customize-newsletter"]');
|
||||||
|
|
||||||
|
// Check if modal opens
|
||||||
|
expect(find('[data-test-modal="edit-newsletter"]'), 'Edit newsletter modal').to.exist;
|
||||||
|
|
||||||
|
// Invalid name error when you try to save
|
||||||
|
await checkValidationError(/Please enter a name./);
|
||||||
|
|
||||||
|
// Fill in the newsletter name
|
||||||
|
await fillName('My new newsletter');
|
||||||
|
|
||||||
|
// Enter an invalid email
|
||||||
|
await fillIn('input#newsletter-sender-email', 'invalid-email');
|
||||||
|
|
||||||
|
// Check if it complains about the invalid email
|
||||||
|
await checkValidationError(/Invalid email./);
|
||||||
|
|
||||||
|
await fillIn('input#newsletter-sender-email', 'valid-email@email.com');
|
||||||
|
|
||||||
|
// Everything should be valid
|
||||||
|
await checkSave({
|
||||||
|
edit: true,
|
||||||
|
shouldVerifyEmail: true
|
||||||
|
});
|
||||||
|
});*/
|
||||||
|
});
|
||||||
|
|
Loading…
Reference in New Issue