diff options
author | Luke Bennett <lbennett@gitlab.com> | 2018-10-15 16:36:19 +0300 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2018-10-15 16:36:19 +0300 |
commit | 7cf19c0b816bf7bc146a7f634c65d2e7484f26e1 (patch) | |
tree | 1fd5af973b40f7793a9824765d961098a1c60faf /spec/javascripts/dirty_submit | |
parent | 280a132e15c8e1f66487312584e734b108b00df7 (diff) |
Prioritize group settings, improve panel titles, disable submit without changes
Diffstat (limited to 'spec/javascripts/dirty_submit')
4 files changed, 95 insertions, 0 deletions
diff --git a/spec/javascripts/dirty_submit/dirty_submit_collection_spec.js b/spec/javascripts/dirty_submit/dirty_submit_collection_spec.js new file mode 100644 index 00000000000..87a26183b63 --- /dev/null +++ b/spec/javascripts/dirty_submit/dirty_submit_collection_spec.js @@ -0,0 +1,25 @@ +import DirtySubmitCollection from '~/dirty_submit/dirty_submit_collection'; +import { setInput, createForm } from './helper'; + +describe('DirtySubmitCollection', () => { + it('disables submits until there are changes', done => { + const testElementsCollection = [createForm(), createForm()]; + const forms = testElementsCollection.map(testElements => testElements.form); + + new DirtySubmitCollection(forms); // eslint-disable-line no-new + + testElementsCollection.forEach(testElements => { + const { input, submit } = testElements; + const originalValue = input.value; + + expect(submit.disabled).toBe(true); + + return setInput(input, `${originalValue} changes`) + .then(() => expect(submit.disabled).toBe(false)) + .then(() => setInput(input, originalValue)) + .then(() => expect(submit.disabled).toBe(true)) + .then(done) + .catch(done.fail); + }); + }); +}); diff --git a/spec/javascripts/dirty_submit/dirty_submit_factory_spec.js b/spec/javascripts/dirty_submit/dirty_submit_factory_spec.js new file mode 100644 index 00000000000..40843a68582 --- /dev/null +++ b/spec/javascripts/dirty_submit/dirty_submit_factory_spec.js @@ -0,0 +1,18 @@ +import dirtySubmitFactory from '~/dirty_submit/dirty_submit_factory'; +import DirtySubmitForm from '~/dirty_submit/dirty_submit_form'; +import DirtySubmitCollection from '~/dirty_submit/dirty_submit_collection'; +import { createForm } from './helper'; + +describe('DirtySubmitCollection', () => { + it('returns a DirtySubmitForm instance for single form elements', () => { + const { form } = createForm(); + + expect(dirtySubmitFactory(form) instanceof DirtySubmitForm).toBe(true); + }); + + it('returns a DirtySubmitCollection instance for a collection of form elements', () => { + const forms = [createForm().form, createForm().form]; + + expect(dirtySubmitFactory(forms) instanceof DirtySubmitCollection).toBe(true); + }); +}); diff --git a/spec/javascripts/dirty_submit/dirty_submit_form_spec.js b/spec/javascripts/dirty_submit/dirty_submit_form_spec.js new file mode 100644 index 00000000000..86d53fa984a --- /dev/null +++ b/spec/javascripts/dirty_submit/dirty_submit_form_spec.js @@ -0,0 +1,21 @@ + +import DirtySubmitForm from '~/dirty_submit/dirty_submit_form'; +import { setInput, createForm } from './helper'; + +describe('DirtySubmitForm', () => { + it('disables submit until there are changes', done => { + const { form, input, submit } = createForm(); + const originalValue = input.value; + + new DirtySubmitForm(form); // eslint-disable-line no-new + + expect(submit.disabled).toBe(true); + + return setInput(input, `${originalValue} changes`) + .then(() => expect(submit.disabled).toBe(false)) + .then(() => setInput(input, originalValue)) + .then(() => expect(submit.disabled).toBe(true)) + .then(done) + .catch(done.fail); + }); +}); diff --git a/spec/javascripts/dirty_submit/helper.js b/spec/javascripts/dirty_submit/helper.js new file mode 100644 index 00000000000..6d1e643553c --- /dev/null +++ b/spec/javascripts/dirty_submit/helper.js @@ -0,0 +1,31 @@ +import DirtySubmitForm from '~/dirty_submit/dirty_submit_form'; +import setTimeoutPromiseHelper from '../helpers/set_timeout_promise_helper'; + +export function setInput(element, value) { + element.value = value; + + element.dispatchEvent( + new Event('input', { + bubbles: true, + cancelable: true, + }), + ); + + return setTimeoutPromiseHelper(DirtySubmitForm.THROTTLE_DURATION); +} + +export function createForm() { + const form = document.createElement('form'); + form.innerHTML = ` + <input type="text" value="original" class="js-input" name="input" /> + <button type="submit" class="js-dirty-submit"></button> + `; + const input = form.querySelector('.js-input'); + const submit = form.querySelector('.js-dirty-submit'); + + return { + form, + input, + submit, + }; +} |