diff options
Diffstat (limited to 'spec/frontend/static_site_editor/components/static_site_editor_spec.js')
-rw-r--r-- | spec/frontend/static_site_editor/components/static_site_editor_spec.js | 82 |
1 files changed, 82 insertions, 0 deletions
diff --git a/spec/frontend/static_site_editor/components/static_site_editor_spec.js b/spec/frontend/static_site_editor/components/static_site_editor_spec.js new file mode 100644 index 00000000000..919763ce9fe --- /dev/null +++ b/spec/frontend/static_site_editor/components/static_site_editor_spec.js @@ -0,0 +1,82 @@ +import Vuex from 'vuex'; +import { shallowMount, createLocalVue } from '@vue/test-utils'; + +import { GlSkeletonLoader } from '@gitlab/ui'; + +import createState from '~/static_site_editor/store/state'; + +import StaticSiteEditor from '~/static_site_editor/components/static_site_editor.vue'; +import EditArea from '~/static_site_editor/components/edit_area.vue'; + +const localVue = createLocalVue(); + +localVue.use(Vuex); + +describe('StaticSiteEditor', () => { + let wrapper; + let store; + let loadContentActionMock; + + const buildStore = (initialState = {}) => { + loadContentActionMock = jest.fn(); + + store = new Vuex.Store({ + state: createState(initialState), + actions: { + loadContent: loadContentActionMock, + }, + }); + }; + + const buildWrapper = () => { + wrapper = shallowMount(StaticSiteEditor, { + localVue, + store, + }); + }; + + const findEditArea = () => wrapper.find(EditArea); + + beforeEach(() => { + buildStore(); + buildWrapper(); + }); + + afterEach(() => { + wrapper.destroy(); + }); + + describe('when content is not loaded', () => { + it('does not render edit area', () => { + expect(findEditArea().exists()).toBe(false); + }); + }); + + describe('when content is loaded', () => { + const content = 'edit area content'; + + beforeEach(() => { + buildStore({ content, isContentLoaded: true }); + buildWrapper(); + }); + + it('renders the edit area', () => { + expect(findEditArea().exists()).toBe(true); + }); + + it('passes page content to edit area', () => { + expect(findEditArea().props('value')).toBe(content); + }); + }); + + it('displays skeleton loader while loading content', () => { + buildStore({ isLoadingContent: true }); + buildWrapper(); + + expect(wrapper.find(GlSkeletonLoader).exists()).toBe(true); + }); + + it('dispatches load content action', () => { + expect(loadContentActionMock).toHaveBeenCalled(); + }); +}); |