diff options
Diffstat (limited to 'spec/frontend/static_site_editor/components/edit_area_spec.js')
-rw-r--r-- | spec/frontend/static_site_editor/components/edit_area_spec.js | 36 |
1 files changed, 27 insertions, 9 deletions
diff --git a/spec/frontend/static_site_editor/components/edit_area_spec.js b/spec/frontend/static_site_editor/components/edit_area_spec.js index bfe41f65d6e..d7c798e6620 100644 --- a/spec/frontend/static_site_editor/components/edit_area_spec.js +++ b/spec/frontend/static_site_editor/components/edit_area_spec.js @@ -5,13 +5,19 @@ import RichContentEditor from '~/vue_shared/components/rich_content_editor/rich_ import EditArea from '~/static_site_editor/components/edit_area.vue'; import PublishToolbar from '~/static_site_editor/components/publish_toolbar.vue'; import EditHeader from '~/static_site_editor/components/edit_header.vue'; +import UnsavedChangesConfirmDialog from '~/static_site_editor/components/unsaved_changes_confirm_dialog.vue'; -import { sourceContentTitle as title, sourceContent as content, returnUrl } from '../mock_data'; +import { + sourceContentTitle as title, + sourceContent as content, + sourceContentBody as body, + returnUrl, +} from '../mock_data'; describe('~/static_site_editor/components/edit_area.vue', () => { let wrapper; const savingChanges = true; - const newContent = `new ${content}`; + const newBody = `new ${body}`; const buildWrapper = (propsData = {}) => { wrapper = shallowMount(EditArea, { @@ -28,6 +34,7 @@ describe('~/static_site_editor/components/edit_area.vue', () => { const findEditHeader = () => wrapper.find(EditHeader); const findRichContentEditor = () => wrapper.find(RichContentEditor); const findPublishToolbar = () => wrapper.find(PublishToolbar); + const findUnsavedChangesConfirmDialog = () => wrapper.find(UnsavedChangesConfirmDialog); beforeEach(() => { buildWrapper(); @@ -44,29 +51,40 @@ describe('~/static_site_editor/components/edit_area.vue', () => { it('renders rich content editor', () => { expect(findRichContentEditor().exists()).toBe(true); - expect(findRichContentEditor().props('value')).toBe(content); + expect(findRichContentEditor().props('value')).toBe(body); }); it('renders publish toolbar', () => { expect(findPublishToolbar().exists()).toBe(true); - expect(findPublishToolbar().props('returnUrl')).toBe(returnUrl); - expect(findPublishToolbar().props('savingChanges')).toBe(savingChanges); - expect(findPublishToolbar().props('saveable')).toBe(false); + expect(findPublishToolbar().props()).toMatchObject({ + returnUrl, + savingChanges, + saveable: false, + }); + }); + + it('renders unsaved changes confirm dialog', () => { + expect(findUnsavedChangesConfirmDialog().exists()).toBe(true); + expect(findUnsavedChangesConfirmDialog().props('modified')).toBe(false); }); describe('when content changes', () => { beforeEach(() => { - findRichContentEditor().vm.$emit('input', newContent); + findRichContentEditor().vm.$emit('input', newBody); return wrapper.vm.$nextTick(); }); - it('sets publish toolbar as saveable when content changes', () => { + it('sets publish toolbar as saveable', () => { expect(findPublishToolbar().props('saveable')).toBe(true); }); + it('sets unsaved changes confirm dialog as modified', () => { + expect(findUnsavedChangesConfirmDialog().props('modified')).toBe(true); + }); + it('sets publish toolbar as not saveable when content changes are rollback', () => { - findRichContentEditor().vm.$emit('input', content); + findRichContentEditor().vm.$emit('input', body); return wrapper.vm.$nextTick().then(() => { expect(findPublishToolbar().props('saveable')).toBe(false); |