1321 lines
44 KiB
JavaScript
1321 lines
44 KiB
JavaScript
import {
|
|
click,
|
|
currentURL,
|
|
currentRouteName,
|
|
fillIn,
|
|
find,
|
|
findAll,
|
|
settled,
|
|
visit,
|
|
waitFor,
|
|
} from '@ember/test-helpers';
|
|
import { module, test } from 'qunit';
|
|
import { setupApplicationTest } from 'ember-qunit';
|
|
import { setupMirage } from 'ember-cli-mirage/test-support';
|
|
import { setupIntl, t } from 'ember-intl/test-support';
|
|
import {
|
|
setupBrowserNavigationButtons,
|
|
backButton,
|
|
} from 'ember-cli-browser-navigation-button-test-helper/test-support';
|
|
import { DateTime } from 'luxon';
|
|
import pageCreateIndex from 'croodle/tests/pages/create/index';
|
|
import pageCreateMeta from 'croodle/tests/pages/create/meta';
|
|
import pageCreateOptions from 'croodle/tests/pages/create/options';
|
|
import pageCreateOptionsDatetime from 'croodle/tests/pages/create/options-datetime';
|
|
import pageCreateSettings from 'croodle/tests/pages/create/settings';
|
|
import pagePollParticipation from 'croodle/tests/pages/poll/participation';
|
|
import asyncThrowsAssertion from '../assertions/async-throws';
|
|
import { calendarSelect } from 'ember-power-calendar/test-support';
|
|
|
|
module('Acceptance | create a poll', function (hooks) {
|
|
hooks.beforeEach(function () {
|
|
window.localStorage.setItem('locale', 'en');
|
|
});
|
|
|
|
setupApplicationTest(hooks);
|
|
setupMirage(hooks);
|
|
setupIntl(hooks);
|
|
|
|
hooks.beforeEach(function (assert) {
|
|
assert.asyncThrows = asyncThrowsAssertion;
|
|
});
|
|
|
|
test('create a default poll', async function (assert) {
|
|
const dates = [
|
|
DateTime.now().plus({ days: 1 }),
|
|
DateTime.now().plus({ weeks: 1 }),
|
|
];
|
|
|
|
await pageCreateIndex.visit();
|
|
assert.equal(currentRouteName(), 'create.index');
|
|
assert
|
|
.dom('[data-test-form-step].is-active')
|
|
.hasText(
|
|
t('create.formStep.type'),
|
|
'status bar shows correct item as current path (index)',
|
|
);
|
|
assert.deepEqual(
|
|
findAll('[data-test-form-step]').map((el) => el.textContent.trim()),
|
|
[
|
|
t('create.formStep.type').toString(),
|
|
t('create.formStep.meta').toString(),
|
|
t('create.formStep.options.days').toString(),
|
|
t('create.formStep.options-datetime').toString(),
|
|
t('create.formStep.settings').toString(),
|
|
],
|
|
'status bar has correct items',
|
|
);
|
|
assert.deepEqual(
|
|
findAll('[data-test-form-step]').map((el) => el.disabled),
|
|
[false, true, true, true, true],
|
|
'status bar has correct items disabled (index)',
|
|
);
|
|
assert.ok(
|
|
pageCreateIndex.pollTypeHasFocus,
|
|
'poll type selection has autofocus',
|
|
);
|
|
|
|
await pageCreateIndex.next();
|
|
assert.equal(currentRouteName(), 'create.meta');
|
|
assert
|
|
.dom('[data-test-form-step].is-active')
|
|
.hasText(
|
|
t('create.formStep.meta'),
|
|
'status bar shows correct item as current path (meta)',
|
|
);
|
|
assert.deepEqual(
|
|
findAll('[data-test-form-step]').map((el) => el.disabled),
|
|
[false, false, true, true, true],
|
|
'status bar has correct items disabled (meta)',
|
|
);
|
|
assert.ok(pageCreateMeta.titleHasFocus, 'title input has autofocus');
|
|
|
|
await pageCreateMeta.title('default poll').next();
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
assert
|
|
.dom('[data-test-form-step].is-active')
|
|
.hasText(
|
|
t('create.formStep.options.days'),
|
|
'status bar shows correct item as current path (options.days)',
|
|
);
|
|
assert.deepEqual(
|
|
findAll('[data-test-form-step]').map((el) => el.disabled),
|
|
[false, false, false, true, true],
|
|
'status bar has correct items disabled (options)',
|
|
);
|
|
|
|
await pageCreateOptions.selectDates(dates);
|
|
await pageCreateOptions.next();
|
|
assert.equal(currentRouteName(), 'create.options-datetime');
|
|
assert
|
|
.dom('[data-test-form-step].is-active')
|
|
.hasText(
|
|
t('create.formStep.options-datetime'),
|
|
'status bar shows correct item as current path (options-datetime)',
|
|
);
|
|
assert.deepEqual(
|
|
findAll('[data-test-form-step]').map((el) => el.disabled),
|
|
[false, false, false, false, true],
|
|
'status bar has correct items disabled (options-datetime)',
|
|
);
|
|
assert.ok(
|
|
pageCreateOptionsDatetime.firstTime.inputHasFocus,
|
|
'first time input has autofocus',
|
|
);
|
|
|
|
await pageCreateOptionsDatetime.next();
|
|
assert.equal(currentRouteName(), 'create.settings');
|
|
assert
|
|
.dom('[data-test-form-step].is-active')
|
|
.hasText(
|
|
t('create.formStep.settings'),
|
|
'status bar shows correct item as current path (settings)',
|
|
);
|
|
assert.deepEqual(
|
|
findAll('[data-test-form-step]').map((el) => el.disabled),
|
|
[false, false, false, false, false],
|
|
'status bar has correct items disabled (settings)',
|
|
);
|
|
assert.ok(
|
|
pageCreateSettings.availableAnswersHasFocus,
|
|
'available answers selection has autofocus',
|
|
);
|
|
|
|
// simulate temporary server error
|
|
this.server.logging = true;
|
|
this.server.post('/polls', undefined, 503);
|
|
|
|
await assert.asyncThrows(async () => {
|
|
await pageCreateSettings.save();
|
|
}, 'Unexpected server-side error. Server responded with 503 (Service Unavailable)');
|
|
assert.equal(currentRouteName(), 'create.settings');
|
|
|
|
// simulate server is available again
|
|
// defer creation for testing loading spinner
|
|
let resolveSubmission;
|
|
let resolveSubmissionWith;
|
|
this.server.post('/polls', function (schema) {
|
|
return new Promise((resolve) => {
|
|
let attrs = this.normalizedRequestAttrs();
|
|
|
|
resolveSubmission = resolve;
|
|
resolveSubmissionWith = schema.polls.create(attrs);
|
|
});
|
|
});
|
|
|
|
pageCreateSettings.save();
|
|
|
|
// shows loading spinner while saving
|
|
await waitFor('[data-test-button="submit"] .spinner-border', {
|
|
timeoutMessage: 'timeout while waiting for loading spinner to appear',
|
|
});
|
|
assert.ok(true, 'loading spinner is shown');
|
|
|
|
resolveSubmission(resolveSubmissionWith);
|
|
await settled();
|
|
|
|
assert.equal(currentRouteName(), 'poll.participation');
|
|
assert.true(
|
|
pagePollParticipation.urlIsValid(),
|
|
`poll url ${currentURL()} is valid`,
|
|
);
|
|
assert.equal(
|
|
pagePollParticipation.title,
|
|
'default poll',
|
|
'poll title is correct',
|
|
);
|
|
assert.equal(
|
|
pagePollParticipation.description,
|
|
'',
|
|
'poll description is correct',
|
|
);
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-form-element^="option"] label:not(.custom-control-label)`,
|
|
).map((el) => el.textContent.trim()),
|
|
dates.map((date) =>
|
|
Intl.DateTimeFormat('en-US', { dateStyle: 'full' }).format(date),
|
|
),
|
|
'options are correctly labeled',
|
|
);
|
|
assert.deepEqual(
|
|
Array.from(
|
|
find('[data-test-form-element^="option"]').querySelectorAll(
|
|
'.radio label',
|
|
),
|
|
).map((el) => el.textContent.trim()),
|
|
[
|
|
t('answerTypes.yes.label').toString(),
|
|
t('answerTypes.no.label').toString(),
|
|
],
|
|
'answers are correctly labeled',
|
|
);
|
|
assert.ok(pagePollParticipation.nameHasFocus, 'name input has autofocus');
|
|
});
|
|
|
|
test('create a poll for answering a question', async function (assert) {
|
|
await pageCreateIndex.visit();
|
|
assert
|
|
.dom('[data-test-form-step].is-active')
|
|
.hasText(
|
|
t('create.formStep.type').toString(),
|
|
'status bar shows correct item as current path (index)',
|
|
);
|
|
assert.deepEqual(
|
|
findAll('[data-test-form-step]').map((el) => el.disabled),
|
|
[false, true, true, true, true],
|
|
'status bar has correct items disabled',
|
|
);
|
|
|
|
await pageCreateIndex.pollType('MakeAPoll').next();
|
|
assert.equal(currentRouteName(), 'create.meta');
|
|
assert
|
|
.dom('[data-test-form-step].is-active')
|
|
.hasText(
|
|
t('create.formStep.meta').toString(),
|
|
'status bar shows correct item as current path (meta)',
|
|
);
|
|
assert.deepEqual(
|
|
findAll('[data-test-form-step]').map((el) => el.textContent.trim()),
|
|
[
|
|
t('create.formStep.type').toString(),
|
|
t('create.formStep.meta').toString(),
|
|
t('create.formStep.options.text').toString(),
|
|
t('create.formStep.settings').toString(),
|
|
],
|
|
'status bar has correct items',
|
|
);
|
|
assert.deepEqual(
|
|
findAll('[data-test-form-step]').map((el) => el.disabled),
|
|
[false, false, true, true],
|
|
'status bar has correct items disabled (meta)',
|
|
);
|
|
|
|
await pageCreateMeta.title('default poll').next();
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
assert
|
|
.dom('[data-test-form-step].is-active')
|
|
.hasText(
|
|
t('create.formStep.options.text').toString(),
|
|
'status bar shows correct item as current path (options.text)',
|
|
);
|
|
assert.deepEqual(
|
|
findAll('[data-test-form-step]').map((el) => el.disabled),
|
|
[false, false, false, true],
|
|
'status bar has correct items disabled (options)',
|
|
);
|
|
assert.ok(
|
|
pageCreateOptions.firstTextOption.inputHasFocus,
|
|
'first option input has autofocus',
|
|
);
|
|
assert.equal(
|
|
pageCreateOptions.textOptions.length,
|
|
2,
|
|
'there are two input fields as default',
|
|
);
|
|
|
|
await pageCreateOptions.next();
|
|
assert.strictEqual(
|
|
currentRouteName(),
|
|
'create.options',
|
|
'validation errors prevents transition',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-step].is-active')
|
|
.hasText(
|
|
t('create.formStep.options.text').toString(),
|
|
'status bar shows correct item as current path (options.text)',
|
|
);
|
|
assert.ok(
|
|
pageCreateOptions.textOptions.objectAt(0).hasError &&
|
|
pageCreateOptions.textOptions.objectAt(1).hasError,
|
|
'validation errors are shown after submit',
|
|
);
|
|
|
|
await pageCreateOptions.textOptions.objectAt(0).title('option a');
|
|
await pageCreateOptions.textOptions.objectAt(1).title('option c');
|
|
await pageCreateOptions.textOptions.objectAt(0).add();
|
|
assert.equal(pageCreateOptions.textOptions.length, 3, 'option was added');
|
|
|
|
await pageCreateOptions.textOptions.objectAt(1).title('option b');
|
|
await pageCreateOptions.textOptions.objectAt(2).add();
|
|
assert.equal(pageCreateOptions.textOptions.length, 4, 'option was added');
|
|
|
|
await pageCreateOptions.textOptions.objectAt(3).title('to be deleted');
|
|
await pageCreateOptions.textOptions.objectAt(3).delete();
|
|
assert.equal(pageCreateOptions.textOptions.length, 3, 'option got deleted');
|
|
|
|
await pageCreateOptions.next();
|
|
assert.equal(currentRouteName(), 'create.settings');
|
|
assert
|
|
.dom('[data-test-form-step].is-active')
|
|
.hasText(
|
|
t('create.formStep.settings').toString(),
|
|
'status bar shows correct item as current path (settings)',
|
|
);
|
|
assert.deepEqual(
|
|
findAll('[data-test-form-step]').map((el) => el.disabled),
|
|
[false, false, false, false],
|
|
'status bar has correct items disabled (settings)',
|
|
);
|
|
|
|
await pageCreateSettings.save();
|
|
assert.equal(currentRouteName(), 'poll.participation');
|
|
assert.true(pagePollParticipation.urlIsValid(), 'poll url is valid');
|
|
assert.equal(
|
|
pagePollParticipation.title,
|
|
'default poll',
|
|
'poll title is correct',
|
|
);
|
|
assert.equal(
|
|
pagePollParticipation.description,
|
|
'',
|
|
'poll description is correct',
|
|
);
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-form-element^="option"] label:not(.custom-control-label)`,
|
|
).map((el) => el.textContent.trim()),
|
|
['option a', 'option b', 'option c'],
|
|
'options are labeled correctly',
|
|
);
|
|
});
|
|
|
|
test('create a poll with times and description', async function (assert) {
|
|
const days = [
|
|
DateTime.now().plus({ days: 1 }),
|
|
DateTime.now().plus({ weeks: 1 }),
|
|
];
|
|
|
|
await pageCreateIndex.visit();
|
|
await pageCreateIndex.next();
|
|
assert.equal(currentRouteName(), 'create.meta');
|
|
|
|
await pageCreateMeta
|
|
.title('default poll')
|
|
.description('a sample description')
|
|
.next();
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
|
|
await pageCreateOptions.selectDates(days);
|
|
await pageCreateOptions.next();
|
|
assert.equal(currentRouteName(), 'create.options-datetime');
|
|
assert.deepEqual(
|
|
findAll('[data-test-day] label').map((el) => el.textContent.trim()),
|
|
days.map((day) =>
|
|
Intl.DateTimeFormat('en-US', { dateStyle: 'full' }).format(day),
|
|
),
|
|
'time inputs having days as label',
|
|
);
|
|
|
|
await pageCreateOptionsDatetime.times.objectAt(0).time('10:00');
|
|
await pageCreateOptionsDatetime.times.objectAt(0).add();
|
|
await pageCreateOptionsDatetime.times.objectAt(1).time('18:00');
|
|
await pageCreateOptionsDatetime.times.objectAt(2).time('12:00');
|
|
await pageCreateOptionsDatetime.next();
|
|
assert.equal(currentRouteName(), 'create.settings');
|
|
|
|
await pageCreateSettings.save();
|
|
assert.equal(currentRouteName(), 'poll.participation');
|
|
assert.true(pagePollParticipation.urlIsValid(), 'poll url is valid');
|
|
assert.equal(
|
|
pagePollParticipation.title,
|
|
'default poll',
|
|
'poll title is correct',
|
|
);
|
|
assert.equal(
|
|
pagePollParticipation.description,
|
|
'a sample description',
|
|
'poll description is correct',
|
|
);
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-form-element^="option"] label:not(.custom-control-label)`,
|
|
).map((el) => el.textContent.trim()),
|
|
[
|
|
Intl.DateTimeFormat('en-US', {
|
|
dateStyle: 'full',
|
|
timeStyle: 'short',
|
|
}).format(days[0].set({ hour: 10, minutes: 0 })),
|
|
Intl.DateTimeFormat('en-US', { timeStyle: 'short' }).format(
|
|
days[0].set({ hours: 18, minutes: 0 }),
|
|
),
|
|
Intl.DateTimeFormat('en-US', {
|
|
dateStyle: 'full',
|
|
timeStyle: 'short',
|
|
}).format(days[1].set({ hour: 12, minutes: 0 })),
|
|
],
|
|
'options are correctly labeled',
|
|
);
|
|
});
|
|
|
|
test('create a poll with only one day and multiple times', async function (assert) {
|
|
const day = DateTime.now().plus({ days: 1 });
|
|
|
|
await pageCreateIndex.visit();
|
|
await pageCreateIndex.next();
|
|
assert.equal(currentRouteName(), 'create.meta');
|
|
|
|
await pageCreateMeta
|
|
.title('default poll')
|
|
.description('a sample description')
|
|
.next();
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
|
|
await pageCreateOptions.selectDates([day]);
|
|
await pageCreateOptions.next();
|
|
assert.equal(currentRouteName(), 'create.options-datetime');
|
|
assert.deepEqual(
|
|
findAll('[data-test-day] label').map((el) => el.textContent.trim()),
|
|
[Intl.DateTimeFormat('en-US', { dateStyle: 'full' }).format(day)],
|
|
'time inputs having days as label',
|
|
);
|
|
assert
|
|
.dom(`[data-test-day="${day.toISODate()}"] input[type="time"]`)
|
|
.exists({ count: 1 }, 'shows one input field per day as default');
|
|
assert
|
|
.dom(`[data-test-day="${day.toISODate()}"] input[type="time"]`)
|
|
.hasValue('', 'time input field is empty until user enters a time');
|
|
|
|
await pageCreateOptionsDatetime.times.objectAt(0).time('08:00');
|
|
assert
|
|
.dom(`[data-test-day="${day.toISODate()}"] input[type="time"]`)
|
|
.hasValue('08:00', 'time input field shows the time entered by the user');
|
|
|
|
await pageCreateOptionsDatetime.times.objectAt(0).delete();
|
|
assert
|
|
.dom(`[data-test-day="${day.toISODate()}"] input[type="time"]`)
|
|
.hasValue(
|
|
'',
|
|
'deleting clears time input value if there is only one time',
|
|
);
|
|
|
|
await pageCreateOptionsDatetime.times.objectAt(0).time('10:00');
|
|
await pageCreateOptionsDatetime.times.objectAt(0).add();
|
|
assert
|
|
.dom(`[data-test-day="${day.toISODate()}"] input[type="time"]`)
|
|
.exists({ count: 2 }, 'user can add a second input field');
|
|
assert
|
|
.dom(
|
|
findAll(`[data-test-day="${day.toISODate()}"] input[type="time"]`)[1],
|
|
)
|
|
.hasValue('', 'newly crated second input field is empty');
|
|
assert
|
|
.dom(
|
|
findAll(`[data-test-day="${day.toISODate()}"] input[type="time"]`)[0],
|
|
)
|
|
.hasValue('10:00', 'value existing input field is not changed');
|
|
|
|
await pageCreateOptionsDatetime.times.objectAt(1).time('14:00');
|
|
await pageCreateOptionsDatetime.times.objectAt(1).add();
|
|
assert
|
|
.dom(`[data-test-day="${day.toISODate()}"] input[type="time"]`)
|
|
.exists({ count: 3 }, 'user can add a third input field');
|
|
|
|
await pageCreateOptionsDatetime.times.objectAt(2).time('18:00');
|
|
await pageCreateOptionsDatetime.times.objectAt(1).delete();
|
|
assert
|
|
.dom(`[data-test-day="${day.toISODate()}"] input[type="time"]`)
|
|
.exists({ count: 2 }, 'user can delete an input field');
|
|
assert.deepEqual(
|
|
findAll(`[data-test-day="${day.toISODate()}"] input[type="time"]`).map(
|
|
(el) => el.value,
|
|
),
|
|
['10:00', '18:00'],
|
|
'correct input field is deleted',
|
|
);
|
|
|
|
await pageCreateOptionsDatetime.next();
|
|
assert.equal(currentRouteName(), 'create.settings');
|
|
|
|
await pageCreateSettings.save();
|
|
assert.equal(currentRouteName(), 'poll.participation');
|
|
assert.true(pagePollParticipation.urlIsValid(), 'poll url is valid');
|
|
assert.equal(
|
|
pagePollParticipation.title,
|
|
'default poll',
|
|
'poll title is correct',
|
|
);
|
|
assert.equal(
|
|
pagePollParticipation.description,
|
|
'a sample description',
|
|
'poll description is correct',
|
|
);
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-form-element^="option"] label:not(.custom-control-label)`,
|
|
).map((el) => el.textContent.trim()),
|
|
[
|
|
Intl.DateTimeFormat('en-US', {
|
|
dateStyle: 'full',
|
|
timeStyle: 'short',
|
|
}).format(day.set({ hours: 10, minutes: 0 })),
|
|
Intl.DateTimeFormat('en-US', { timeStyle: 'short' }).format(
|
|
day.set({ hours: 18, minutes: 0 }),
|
|
),
|
|
],
|
|
'options are correctly labeled',
|
|
);
|
|
});
|
|
|
|
test('create a poll with only one day (without time)', async function (assert) {
|
|
const day = DateTime.now().plus({ days: 1 });
|
|
|
|
await pageCreateIndex.visit();
|
|
await pageCreateIndex.next();
|
|
assert.equal(currentRouteName(), 'create.meta');
|
|
|
|
await pageCreateMeta
|
|
.title('default poll')
|
|
.description('a sample description')
|
|
.next();
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
|
|
await pageCreateOptions.selectDates([day]);
|
|
await pageCreateOptions.next();
|
|
assert.equal(currentRouteName(), 'create.options-datetime');
|
|
assert.deepEqual(
|
|
findAll('[data-test-day] label').map((el) => el.textContent.trim()),
|
|
[Intl.DateTimeFormat('en-US', { dateStyle: 'full' }).format(day)],
|
|
'time inputs having days as label',
|
|
);
|
|
|
|
await pageCreateOptionsDatetime.next();
|
|
assert.equal(currentRouteName(), 'create.settings');
|
|
|
|
await pageCreateSettings.save();
|
|
assert.equal(currentRouteName(), 'poll.participation');
|
|
assert.true(pagePollParticipation.urlIsValid(), 'poll url is valid');
|
|
assert.equal(
|
|
pagePollParticipation.title,
|
|
'default poll',
|
|
'poll title is correct',
|
|
);
|
|
assert.equal(
|
|
pagePollParticipation.description,
|
|
'a sample description',
|
|
'poll description is correct',
|
|
);
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-form-element^="option"] label:not(.custom-control-label)`,
|
|
).map((el) => el.textContent.trim()),
|
|
[Intl.DateTimeFormat('en-US', { dateStyle: 'full' }).format(day)],
|
|
'options are correctly labeled',
|
|
);
|
|
});
|
|
|
|
test('create a poll with only one day (with time)', async function (assert) {
|
|
const day = DateTime.now().plus({ days: 1 });
|
|
|
|
await pageCreateIndex.visit();
|
|
await pageCreateIndex.next();
|
|
assert.equal(currentRouteName(), 'create.meta');
|
|
|
|
await pageCreateMeta
|
|
.title('default poll')
|
|
.description('a sample description')
|
|
.next();
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
|
|
await pageCreateOptions.selectDates([day]);
|
|
await pageCreateOptions.next();
|
|
assert.equal(currentRouteName(), 'create.options-datetime');
|
|
assert.deepEqual(
|
|
findAll('[data-test-day] label').map((el) => el.textContent.trim()),
|
|
[Intl.DateTimeFormat('en-US', { dateStyle: 'full' }).format(day)],
|
|
'time inputs having days as label',
|
|
);
|
|
|
|
await pageCreateOptionsDatetime.times.objectAt(0).time('22:30');
|
|
await pageCreateOptionsDatetime.next();
|
|
assert.equal(currentRouteName(), 'create.settings');
|
|
|
|
await pageCreateSettings.save();
|
|
assert.equal(currentRouteName(), 'poll.participation');
|
|
assert.true(pagePollParticipation.urlIsValid(), 'poll url is valid');
|
|
assert.equal(
|
|
pagePollParticipation.title,
|
|
'default poll',
|
|
'poll title is correct',
|
|
);
|
|
assert.equal(
|
|
pagePollParticipation.description,
|
|
'a sample description',
|
|
'poll description is correct',
|
|
);
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-form-element^="option"] label:not(.custom-control-label)`,
|
|
).map((el) => el.textContent.trim()),
|
|
[
|
|
Intl.DateTimeFormat('en-US', {
|
|
dateStyle: 'full',
|
|
timeStyle: 'short',
|
|
}).format(day.set({ hours: 22, minutes: 30 })),
|
|
],
|
|
'options are correctly labeled',
|
|
);
|
|
});
|
|
|
|
test('create a poll with times by adopting times of first day', async function (assert) {
|
|
const days = [
|
|
DateTime.now().plus({ days: 1 }),
|
|
DateTime.now().plus({ weeks: 1 }),
|
|
];
|
|
|
|
await visit('/create');
|
|
await click('button[type="submit"]');
|
|
assert.equal(currentRouteName(), 'create.meta');
|
|
|
|
await fillIn(
|
|
'[data-test-form-element="title"] input[type="text"]',
|
|
'example poll for to test time adopting workflow',
|
|
);
|
|
await click('button[type="submit"]');
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
|
|
await pageCreateOptions.selectDates(days);
|
|
await click('button[type="submit"]');
|
|
assert.equal(currentRouteName(), 'create.options-datetime');
|
|
|
|
for (let i = 1; i <= 3; i++) {
|
|
await click(
|
|
`[data-test-day="${days[0].toISODate()}"] button[data-test-action="add"]`,
|
|
);
|
|
}
|
|
assert
|
|
.dom(
|
|
`[data-test-day="${days[0].toISODate()}"] button[data-test-action="add"]`,
|
|
)
|
|
.exists({ count: 4 }, 'assumption: user created 4 time inputs');
|
|
|
|
for (const [index, inputEl] of findAll(
|
|
`[data-test-day="${days[0].toISODate()}"] input[type="time"]`,
|
|
).entries()) {
|
|
await fillIn(inputEl, `${(index * 6).toString().padStart(2, '0')}:00`);
|
|
}
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-day="${days[0].toISODate()}"] input[type="time"]`,
|
|
).map((el) => el.value),
|
|
['00:00', '06:00', '12:00', '18:00'],
|
|
'assumption: all 4 time inputs for first day are filled',
|
|
);
|
|
assert
|
|
.dom(`[data-test-day="${days[1].toISODate()}"] input[type="time"]`)
|
|
.exists({ count: 1 }, 'only one time input exists for second day')
|
|
.hasValue('', 'time input for second day is empty');
|
|
|
|
await click('button[data-test-action="adopt-times-of-first-day"]');
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-day="${days[1].toISODate()}"] input[type="time"]`,
|
|
).map((el) => el.value),
|
|
['00:00', '06:00', '12:00', '18:00'],
|
|
'all 4 times from first day have been added to second day',
|
|
);
|
|
|
|
await click(
|
|
findAll(
|
|
`[data-test-day="${days[0].toISODate()}"] button[data-test-action="delete"]`,
|
|
)[2],
|
|
);
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-day="${days[0].toISODate()}"] input[type="time"]`,
|
|
).map((el) => el.value),
|
|
['00:00', '06:00', '18:00'],
|
|
'assumption: one time has been deleted from first day',
|
|
);
|
|
|
|
await click('button[data-test-action="adopt-times-of-first-day"]');
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-day="${days[1].toISODate()}"] input[type="time"]`,
|
|
).map((el) => el.value),
|
|
['00:00', '06:00', '18:00'],
|
|
'second day has been updated with changed times from first day',
|
|
);
|
|
|
|
await fillIn(
|
|
findAll(`[data-test-day="${days[0].toISODate()}"] input[type="time"]`)[0],
|
|
'03:00',
|
|
);
|
|
await click(
|
|
findAll(
|
|
`[data-test-day="${days[0].toISODate()}"] button[data-test-action="add"]`,
|
|
)[2],
|
|
);
|
|
await fillIn(
|
|
findAll(`[data-test-day="${days[0].toISODate()}"] input[type="time"]`)[3],
|
|
'22:00',
|
|
);
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-day="${days[0].toISODate()}"] input[type="time"]`,
|
|
).map((el) => el.value),
|
|
['03:00', '06:00', '18:00', '22:00'],
|
|
'assumption: a fourth time has been added to the first day again',
|
|
);
|
|
|
|
await click('button[data-test-action="adopt-times-of-first-day"]');
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-day="${days[1].toISODate()}"] input[type="time"]`,
|
|
).map((el) => el.value),
|
|
['03:00', '06:00', '18:00', '22:00'],
|
|
'second day has been updated with times from first day as expected',
|
|
);
|
|
|
|
await click('button[type="submit"]');
|
|
assert.equal(currentRouteName(), 'create.settings');
|
|
|
|
await click('button[type="submit"]');
|
|
assert.equal(currentRouteName(), 'poll.participation');
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-form-element^="option"] label:not(.custom-control-label)`,
|
|
).map((el) => el.textContent.trim()),
|
|
[
|
|
Intl.DateTimeFormat('en-US', {
|
|
dateStyle: 'full',
|
|
timeStyle: 'short',
|
|
}).format(days[0].set({ hour: 3, minutes: 0 })),
|
|
'6:00 AM',
|
|
'6:00 PM',
|
|
'10:00 PM',
|
|
Intl.DateTimeFormat('en-US', {
|
|
dateStyle: 'full',
|
|
timeStyle: 'short',
|
|
}).format(days[1].set({ hour: 3, minutes: 0 })),
|
|
'6:00 AM',
|
|
'6:00 PM',
|
|
'10:00 PM',
|
|
],
|
|
'options are correctly labeled',
|
|
);
|
|
});
|
|
|
|
test('create a poll for answering a question with only one option', async function (assert) {
|
|
await pageCreateIndex.visit();
|
|
|
|
await pageCreateIndex.pollType('MakeAPoll').next();
|
|
assert.equal(currentRouteName(), 'create.meta');
|
|
|
|
await pageCreateMeta.title('default poll').next();
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
assert.equal(
|
|
pageCreateOptions.textOptions.length,
|
|
2,
|
|
'there are two input fields as default',
|
|
);
|
|
|
|
await pageCreateOptions.textOptions.objectAt(0).title('option a');
|
|
await pageCreateOptions.textOptions.objectAt(1).delete();
|
|
assert.equal(pageCreateOptions.textOptions.length, 1, 'option was deleted');
|
|
|
|
await pageCreateOptions.next();
|
|
assert.equal(currentRouteName(), 'create.settings');
|
|
|
|
await pageCreateSettings.save();
|
|
assert.equal(currentRouteName(), 'poll.participation');
|
|
assert.true(pagePollParticipation.urlIsValid(), 'poll url is valid');
|
|
assert.equal(
|
|
pagePollParticipation.title,
|
|
'default poll',
|
|
'poll title is correct',
|
|
);
|
|
assert.equal(
|
|
pagePollParticipation.description,
|
|
'',
|
|
'poll description is correct',
|
|
);
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-form-element^="option"] label:not(.custom-control-label)`,
|
|
).map((el) => el.textContent.trim()),
|
|
['option a'],
|
|
'options are labeled correctly',
|
|
);
|
|
});
|
|
|
|
test('create a poll and use back button (find a date)', async function (assert) {
|
|
let days = [DateTime.fromISO('2016-01-02'), DateTime.fromISO('2016-01-13')];
|
|
|
|
setupBrowserNavigationButtons();
|
|
|
|
await pageCreateIndex.visit();
|
|
await pageCreateIndex.next();
|
|
assert.equal(currentRouteName(), 'create.meta');
|
|
|
|
await pageCreateMeta
|
|
.title('default poll')
|
|
.description('a sample description')
|
|
.next();
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
|
|
await pageCreateOptions.selectDates(days);
|
|
await pageCreateOptions.next();
|
|
assert.equal(currentRouteName(), 'create.options-datetime');
|
|
assert.deepEqual(
|
|
findAll('[data-test-day] label').map((el) => el.textContent.trim()),
|
|
days.map((day) =>
|
|
Intl.DateTimeFormat('en-US', { dateStyle: 'full' }).format(day),
|
|
),
|
|
'time inputs having days as label',
|
|
);
|
|
|
|
await fillIn('[data-test-day="2016-01-13"] input[type="time"]', '10:00');
|
|
assert
|
|
.dom('[data-test-day="2016-01-13"] input[type="time"]')
|
|
.hasValue('10:00', 'time input has the value entered by the user');
|
|
|
|
await backButton();
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
assert.deepEqual(
|
|
findAll('.ember-power-calendar-day--selected').map(
|
|
(el) => el.dataset.date,
|
|
),
|
|
days.map((day) => day.toISODate()),
|
|
'days are still present after back button is used',
|
|
);
|
|
|
|
await pageCreateOptions.next();
|
|
assert.equal(currentRouteName(), 'create.options-datetime');
|
|
assert
|
|
.dom('[data-test-day="2016-01-02"] input[type="time"]')
|
|
.hasValue('', 'time input the user has not touched is still empty');
|
|
assert
|
|
.dom('[data-test-day="2016-01-13"] input[type="time"]')
|
|
.hasValue(
|
|
'10:00',
|
|
'time input is prefilled with the time user entered before using back button',
|
|
);
|
|
|
|
await pageCreateOptionsDatetime.next();
|
|
assert.equal(currentRouteName(), 'create.settings');
|
|
|
|
await pageCreateSettings.save();
|
|
assert.equal(currentRouteName(), 'poll.participation');
|
|
assert.true(pagePollParticipation.urlIsValid(), 'poll url is valid');
|
|
assert.equal(
|
|
pagePollParticipation.title,
|
|
'default poll',
|
|
'poll title is correct',
|
|
);
|
|
assert.equal(
|
|
pagePollParticipation.description,
|
|
'a sample description',
|
|
'poll description is correct',
|
|
);
|
|
assert.deepEqual(
|
|
findAll(
|
|
`[data-test-form-element^="option"] label:not(.custom-control-label)`,
|
|
).map((el) => el.textContent.trim()),
|
|
[
|
|
Intl.DateTimeFormat('en-US', { dateStyle: 'full' }).format(days[0]),
|
|
Intl.DateTimeFormat('en-US', {
|
|
dateStyle: 'full',
|
|
timeStyle: 'short',
|
|
}).format(days[1].set({ hours: 10, minutes: 0 })),
|
|
],
|
|
'options are correctly labeled',
|
|
);
|
|
});
|
|
|
|
test('Start at first step is enforced', async function (assert) {
|
|
await pageCreateSettings.visit();
|
|
assert.equal(currentRouteName(), 'create.index');
|
|
});
|
|
|
|
test('back button', async function (assert) {
|
|
await pageCreateIndex.visit();
|
|
assert.equal(currentRouteName(), 'create.index');
|
|
|
|
await pageCreateIndex.next();
|
|
assert.equal(currentRouteName(), 'create.meta');
|
|
|
|
await pageCreateMeta.title('foo').next();
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
|
|
await pageCreateOptions.selectDates([new Date()]);
|
|
await pageCreateOptions.next();
|
|
assert.equal(currentRouteName(), 'create.options-datetime');
|
|
|
|
await pageCreateOptionsDatetime.next();
|
|
assert.equal(currentRouteName(), 'create.settings');
|
|
|
|
await pageCreateSettings.back();
|
|
assert.equal(currentRouteName(), 'create.options-datetime');
|
|
|
|
await pageCreateOptionsDatetime.back();
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
|
|
await pageCreateOptions.back();
|
|
assert.equal(currentRouteName(), 'create.meta');
|
|
|
|
await pageCreateMeta.back();
|
|
assert.equal(currentRouteName(), 'create.index');
|
|
|
|
await pageCreateIndex.pollType('MakeAPoll').next();
|
|
assert.equal(currentRouteName(), 'create.meta');
|
|
|
|
await pageCreateMeta.next();
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
|
|
await pageCreateOptions.textOptions.objectAt(0).title('foo');
|
|
await pageCreateOptions.textOptions.objectAt(1).title('bar');
|
|
await pageCreateOptions.next();
|
|
assert.equal(currentRouteName(), 'create.settings');
|
|
|
|
await pageCreateSettings.back();
|
|
assert.equal(currentRouteName(), 'create.options');
|
|
|
|
await pageCreateOptions.back();
|
|
assert.equal(currentRouteName(), 'create.meta');
|
|
|
|
await pageCreateMeta.back();
|
|
assert.equal(currentRouteName(), 'create.index');
|
|
});
|
|
|
|
module('validation', async function () {
|
|
test('validates user input when creating a poll with dates and times', async function (assert) {
|
|
const day = DateTime.now();
|
|
|
|
await visit('/create');
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/meta',
|
|
'assumption: user can go to next step after selecting poll type',
|
|
);
|
|
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/meta',
|
|
'validation error prevents the user from going to option input before entering a title',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="title"] input')
|
|
.hasClass(
|
|
'is-invalid',
|
|
'input field for poll type is shown as invalid',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="title"] .invalid-feedback')
|
|
.hasText(
|
|
t('create.meta.input.title.validations.valueMissing'),
|
|
'shows a validation error for missing value',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="description"] textarea')
|
|
.hasClass(
|
|
'is-valid',
|
|
'textarea for entering description is shown as valid even if user has not entered a value',
|
|
);
|
|
|
|
await fillIn('[data-test-form-element="title"] input', 'A');
|
|
assert
|
|
.dom('[data-test-form-element="title"] input')
|
|
.hasClass(
|
|
'is-invalid',
|
|
'input field for poll type is still shown as invalid after user entered a too short title',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="title"] .invalid-feedback')
|
|
.hasText(
|
|
t('create.meta.input.title.validations.tooShort'),
|
|
'validation error message is updated to reflect too short value',
|
|
);
|
|
|
|
await fillIn(
|
|
'[data-test-form-element="title"] input',
|
|
'When to have our next hackathon?',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="title"] input')
|
|
.hasClass(
|
|
'is-valid',
|
|
'input field for poll type is shown as valid after user entered a title',
|
|
);
|
|
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/options',
|
|
'assumption: user can go to next step after filling in poll title',
|
|
);
|
|
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/options',
|
|
'user can not skip options step without selecting at least one day',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element-for="days"] .form-control')
|
|
.hasClass(
|
|
'is-invalid',
|
|
'shows calendar for date selection as invalid if user has selected no day',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element-for="days"] .invalid-feedback')
|
|
.hasText(
|
|
t('create.options.error.notEnoughDates'),
|
|
'shows validation error that at least one day needs to be selected',
|
|
);
|
|
|
|
await calendarSelect(
|
|
'[data-test-form-element-for="days"]',
|
|
day.toJSDate(),
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element-for="days"] .form-control')
|
|
.hasClass(
|
|
'is-valid',
|
|
'shows calendar for date selection as valid after user selected a date',
|
|
);
|
|
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/options-datetime',
|
|
'user can process to next step after selecting at least one day',
|
|
);
|
|
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/settings',
|
|
'user can skip time input for dates without entering any time',
|
|
);
|
|
|
|
await click('button[data-test-action="back"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/options-datetime',
|
|
'assumption: user can go back to time input step',
|
|
);
|
|
|
|
await click(
|
|
`[data-test-day="${day.toISODate()}"] button[data-test-action="add"]`,
|
|
);
|
|
assert
|
|
.dom(`[data-test-day="${day.toISODate()}"] input[type="time"]`)
|
|
.exists(
|
|
{ count: 2 },
|
|
'assumption: user can add another time for the day',
|
|
);
|
|
|
|
for (const el of findAll(
|
|
`[data-test-day="${day.toISODate()}"] input[type="time"]`,
|
|
)) {
|
|
await fillIn(el, '10:00');
|
|
}
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/options-datetime',
|
|
'user can not go to next step when entering duplicated times for the same day',
|
|
);
|
|
assert
|
|
.dom(
|
|
findAll(`[data-test-day="${day.toISODate()}"] input[type="time"]`)[0],
|
|
)
|
|
.hasClass('is-valid', 'first input is shown as valid');
|
|
assert
|
|
.dom(
|
|
findAll(`[data-test-day="${day.toISODate()}"] input[type="time"]`)[1],
|
|
)
|
|
.hasClass(
|
|
'is-invalid',
|
|
'second input with same time is shown as invalid',
|
|
);
|
|
assert
|
|
.dom(`[data-test-day="${day.toISODate()}"] .invalid-feedback`)
|
|
.exists(
|
|
{ count: 1 },
|
|
'assumption: only one input has invalid feedback',
|
|
);
|
|
assert
|
|
.dom(`[data-test-day="${day.toISODate()}"] .invalid-feedback`)
|
|
.hasText(
|
|
t('create.options-datetime.error.duplicatedDate'),
|
|
'validation error message tells that times must be unique',
|
|
);
|
|
|
|
await fillIn(
|
|
findAll(`[data-test-day="${day.toISODate()}"] input[type="time"]`)[1],
|
|
'12:00',
|
|
);
|
|
assert
|
|
.dom(
|
|
findAll(`[data-test-day="${day.toISODate()}"] input[type="time"]`)[0],
|
|
)
|
|
.hasClass(
|
|
'is-valid',
|
|
'first input is still shown as valid when user changes value of another input',
|
|
);
|
|
assert
|
|
.dom(
|
|
findAll(`[data-test-day="${day.toISODate()}"] input[type="time"]`)[1],
|
|
)
|
|
.hasClass(
|
|
'is-valid',
|
|
'second input is shown as valid after user filled in another time',
|
|
);
|
|
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/settings',
|
|
'user can skip time input for dates without entering any time',
|
|
);
|
|
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentRouteName(),
|
|
'poll.participation',
|
|
'user can finish the poll creation without changing any value on settings step',
|
|
);
|
|
});
|
|
|
|
test('validates user input when creating a poll for answering a question', async function (assert) {
|
|
await visit('/create');
|
|
await fillIn('[data-test-form-element="poll-type"] select', 'MakeAPoll');
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/meta',
|
|
'assumption: user can go to next step after selecting poll type',
|
|
);
|
|
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/meta',
|
|
'validation error prevents the user from going to option input before entering a title',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="title"] input')
|
|
.hasClass(
|
|
'is-invalid',
|
|
'input field for poll type is shown as invalid',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="title"] .invalid-feedback')
|
|
.hasText(
|
|
t('create.meta.input.title.validations.valueMissing'),
|
|
'shows a validation error for missing value',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="description"] textarea')
|
|
.hasClass(
|
|
'is-valid',
|
|
'textarea for entering description is shown as valid even if user has not entered a value',
|
|
);
|
|
|
|
await fillIn('[data-test-form-element="title"] input', 'A');
|
|
assert
|
|
.dom('[data-test-form-element="title"] input')
|
|
.hasClass(
|
|
'is-invalid',
|
|
'input field for poll type is still shown as invalid after user entered a too short title',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="title"] .invalid-feedback')
|
|
.hasText(
|
|
t('create.meta.input.title.validations.tooShort'),
|
|
'validation error message is updated to reflect too short value',
|
|
);
|
|
|
|
await fillIn(
|
|
'[data-test-form-element="title"] input',
|
|
'What dessert should we have?',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="title"] input')
|
|
.hasClass(
|
|
'is-valid',
|
|
'input field for poll type is shown as valid after user entered a title',
|
|
);
|
|
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/options',
|
|
'assumption: user can go to next step after filling in poll title',
|
|
);
|
|
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/options',
|
|
'user can not skip options step without filling out at least one option',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="option"] input[type="text"]')
|
|
.exists(
|
|
{ count: 2 },
|
|
'assumption: two input fields for options exists',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="option"][data-test-option="0"] input')
|
|
.hasClass('is-invalid', 'input field for first option is invalid');
|
|
assert
|
|
.dom('[data-test-form-element="option"][data-test-option="1"] input')
|
|
.hasClass('is-invalid', 'input field for second option is invalid');
|
|
assert
|
|
.dom(
|
|
'[data-test-form-element="option"][data-test-option="0"] .invalid-feedback',
|
|
)
|
|
.hasText(
|
|
t('create.options.error.valueMissing'),
|
|
'shown value missing validation error for first input',
|
|
);
|
|
assert
|
|
.dom(
|
|
'[data-test-form-element="option"][data-test-option="1"] .invalid-feedback',
|
|
)
|
|
.hasText(
|
|
t('create.options.error.valueMissing'),
|
|
'shown value missing validation error for first input',
|
|
);
|
|
|
|
await fillIn(
|
|
'[data-test-form-element="option"][data-test-option="0"] input',
|
|
'Cheesecake',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="option"][data-test-option="0"] input')
|
|
.hasClass(
|
|
'is-valid',
|
|
'input field for first option is valid after user entered a label',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="option"][data-test-option="1"] input')
|
|
.hasClass(
|
|
'is-invalid',
|
|
'input field for second option is still invalid',
|
|
);
|
|
|
|
await fillIn(
|
|
'[data-test-form-element="option"][data-test-option="1"] input',
|
|
'Cheesecake',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="option"][data-test-option="0"] input')
|
|
.hasClass(
|
|
'is-valid',
|
|
'input field for first option is valid after user entered a value',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="option"][data-test-option="1"] input')
|
|
.hasClass(
|
|
'is-invalid',
|
|
'input field for second option is still invalid if entering duplicated error',
|
|
);
|
|
assert
|
|
.dom(
|
|
'[data-test-form-element="option"][data-test-option="1"] .invalid-feedback',
|
|
)
|
|
.hasText(
|
|
t('create.options.error.duplicatedOption'),
|
|
'validation error message is updated to duplicated label',
|
|
);
|
|
|
|
await fillIn(
|
|
'[data-test-form-element="option"][data-test-option="1"] input',
|
|
'Muffin',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="option"][data-test-option="0"] input')
|
|
.hasClass(
|
|
'is-valid',
|
|
'input field for first option is valid after user entered a value',
|
|
);
|
|
assert
|
|
.dom('[data-test-form-element="option"][data-test-option="1"] input')
|
|
.hasClass(
|
|
'is-valid',
|
|
'input field for second option is valid after filling in a unique value',
|
|
);
|
|
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentURL(),
|
|
'/create/settings',
|
|
'user can move to next step after entering valid values for the options',
|
|
);
|
|
|
|
await click('button[type="submit"]');
|
|
assert.strictEqual(
|
|
currentRouteName(),
|
|
'poll.participation',
|
|
'user can finish the poll creation without changing any value on settings step',
|
|
);
|
|
});
|
|
});
|
|
});
|