diff options
Diffstat (limited to 'spec/frontend/snippets/components')
7 files changed, 89 insertions, 56 deletions
diff --git a/spec/frontend/snippets/components/edit_spec.js b/spec/frontend/snippets/components/edit_spec.js index cf897414ccb..e7dab0ad79d 100644 --- a/spec/frontend/snippets/components/edit_spec.js +++ b/spec/frontend/snippets/components/edit_spec.js @@ -9,7 +9,7 @@ import { stubPerformanceWebAPI } from 'helpers/performance'; import waitForPromises from 'helpers/wait_for_promises'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; import GetSnippetQuery from 'shared_queries/snippet/snippet.query.graphql'; -import createFlash from '~/flash'; +import { createAlert } from '~/flash'; import * as urlUtils from '~/lib/utils/url_utility'; import SnippetEditApp from '~/snippets/components/edit.vue'; import SnippetBlobActionsEdit from '~/snippets/components/snippet_blob_actions_edit.vue'; @@ -206,7 +206,7 @@ describe('Snippet Edit app', () => { }); it('should hide loader', () => { - expect(wrapper.find(GlLoadingIcon).exists()).toBe(false); + expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(false); }); }); @@ -237,7 +237,7 @@ describe('Snippet Edit app', () => { !titleHasErrors, ); - expect(wrapper.find(SnippetBlobActionsEdit).props('isValid')).toEqual( + expect(wrapper.findComponent(SnippetBlobActionsEdit).props('isValid')).toEqual( !blobActionsHasErrors, ); }, @@ -273,7 +273,7 @@ describe('Snippet Edit app', () => { selectedLevel: visibility, }); - expect(wrapper.find(SnippetVisibilityEdit).props('value')).toBe(visibility); + expect(wrapper.findComponent(SnippetVisibilityEdit).props('value')).toBe(visibility); }); describe('form submission handling', () => { @@ -361,7 +361,7 @@ describe('Snippet Edit app', () => { await waitForPromises(); expect(urlUtils.redirectTo).not.toHaveBeenCalled(); - expect(createFlash).toHaveBeenCalledWith({ + expect(createAlert).toHaveBeenCalledWith({ message: `Can't create snippet: ${TEST_MUTATION_ERROR}`, }); }); @@ -385,7 +385,7 @@ describe('Snippet Edit app', () => { }); expect(urlUtils.redirectTo).not.toHaveBeenCalled(); - expect(createFlash).toHaveBeenCalledWith({ + expect(createAlert).toHaveBeenCalledWith({ message: `Can't update snippet: ${TEST_MUTATION_ERROR}`, }); }, @@ -407,7 +407,7 @@ describe('Snippet Edit app', () => { it('should flash', () => { // Apollo automatically wraps the resolver's error in a NetworkError - expect(createFlash).toHaveBeenCalledWith({ + expect(createAlert).toHaveBeenCalledWith({ message: `Can't update snippet: ${TEST_API_ERROR.message}`, }); }); diff --git a/spec/frontend/snippets/components/embed_dropdown_spec.js b/spec/frontend/snippets/components/embed_dropdown_spec.js index 389b1c618a3..ed5ea6cab8a 100644 --- a/spec/frontend/snippets/components/embed_dropdown_spec.js +++ b/spec/frontend/snippets/components/embed_dropdown_spec.js @@ -36,7 +36,7 @@ describe('snippets/components/embed_dropdown', () => { sections.push(current); } else { - const value = x.find(GlFormInputGroup).props('value'); + const value = x.findComponent(GlFormInputGroup).props('value'); const copyValue = x.find('button[title="Copy"]').attributes('data-clipboard-text'); Object.assign(current, { diff --git a/spec/frontend/snippets/components/snippet_blob_edit_spec.js b/spec/frontend/snippets/components/snippet_blob_edit_spec.js index 7ea27864519..33b8e2be969 100644 --- a/spec/frontend/snippets/components/snippet_blob_edit_spec.js +++ b/spec/frontend/snippets/components/snippet_blob_edit_spec.js @@ -4,7 +4,7 @@ import AxiosMockAdapter from 'axios-mock-adapter'; import { TEST_HOST } from 'helpers/test_constants'; import waitForPromises from 'helpers/wait_for_promises'; import BlobHeaderEdit from '~/blob/components/blob_edit_header.vue'; -import createFlash from '~/flash'; +import { createAlert } from '~/flash'; import axios from '~/lib/utils/axios_utils'; import { joinPaths } from '~/lib/utils/url_utility'; import SnippetBlobEdit from '~/snippets/components/snippet_blob_edit.vue'; @@ -46,9 +46,9 @@ describe('Snippet Blob Edit component', () => { }); }; - const findLoadingIcon = () => wrapper.find(GlLoadingIcon); - const findHeader = () => wrapper.find(BlobHeaderEdit); - const findContent = () => wrapper.find(SourceEditor); + const findLoadingIcon = () => wrapper.findComponent(GlLoadingIcon); + const findHeader = () => wrapper.findComponent(BlobHeaderEdit); + const findContent = () => wrapper.findComponent(SourceEditor); const getLastUpdatedArgs = () => { const event = wrapper.emitted()['blob-updated']; @@ -125,7 +125,7 @@ describe('Snippet Blob Edit component', () => { it('should call flash', async () => { await waitForPromises(); - expect(createFlash).toHaveBeenCalledWith({ + expect(createAlert).toHaveBeenCalledWith({ message: "Can't fetch content for the blob: Error: Request failed with status code 500", }); }); diff --git a/spec/frontend/snippets/components/snippet_blob_view_spec.js b/spec/frontend/snippets/components/snippet_blob_view_spec.js index aa31377f390..c7ff8c21d80 100644 --- a/spec/frontend/snippets/components/snippet_blob_view_spec.js +++ b/spec/frontend/snippets/components/snippet_blob_view_spec.js @@ -69,13 +69,13 @@ describe('Blob Embeddable', () => { describe('rendering', () => { it('renders correct components', () => { createComponent(); - expect(wrapper.find(BlobHeader).exists()).toBe(true); - expect(wrapper.find(BlobContent).exists()).toBe(true); + expect(wrapper.findComponent(BlobHeader).exists()).toBe(true); + expect(wrapper.findComponent(BlobContent).exists()).toBe(true); }); it('sets simple viewer correctly', () => { createComponent(); - expect(wrapper.find(SimpleViewer).exists()).toBe(true); + expect(wrapper.findComponent(SimpleViewer).exists()).toBe(true); }); it('sets rich viewer correctly', () => { @@ -83,20 +83,20 @@ describe('Blob Embeddable', () => { createComponent({ data, }); - expect(wrapper.find(RichViewer).exists()).toBe(true); + expect(wrapper.findComponent(RichViewer).exists()).toBe(true); }); it('correctly switches viewer type', async () => { createComponent(); - expect(wrapper.find(SimpleViewer).exists()).toBe(true); + expect(wrapper.findComponent(SimpleViewer).exists()).toBe(true); wrapper.vm.switchViewer(RichViewerMock.type); await nextTick(); - expect(wrapper.find(RichViewer).exists()).toBe(true); + expect(wrapper.findComponent(RichViewer).exists()).toBe(true); await wrapper.vm.switchViewer(SimpleViewerMock.type); - expect(wrapper.find(SimpleViewer).exists()).toBe(true); + expect(wrapper.findComponent(SimpleViewer).exists()).toBe(true); }); it('passes information about render error down to blob header', () => { @@ -110,7 +110,7 @@ describe('Blob Embeddable', () => { }, }); - expect(wrapper.find(BlobHeader).props('hasRenderError')).toBe(true); + expect(wrapper.findComponent(BlobHeader).props('hasRenderError')).toBe(true); }); describe('bob content in multi-file scenario', () => { @@ -161,7 +161,7 @@ describe('Blob Embeddable', () => { await nextTick(); - const findContent = () => wrapper.find(BlobContent); + const findContent = () => wrapper.findComponent(BlobContent); expect(findContent().props('content')).toBe(expectedContent); }, @@ -169,36 +169,69 @@ describe('Blob Embeddable', () => { }); describe('URLS with hash', () => { - beforeEach(() => { - window.location.hash = '#LC2'; - }); - afterEach(() => { window.location.hash = ''; }); - it('renders simple viewer by default if URL contains hash', () => { - createComponent({ - data: {}, + describe('if hash starts with #LC', () => { + beforeEach(() => { + window.location.hash = '#LC2'; + }); + + it('renders simple viewer by default', () => { + createComponent({ + data: {}, + }); + + expect(wrapper.vm.activeViewerType).toBe(SimpleViewerMock.type); + expect(wrapper.findComponent(SimpleViewer).exists()).toBe(true); }); - expect(wrapper.vm.activeViewerType).toBe(SimpleViewerMock.type); - expect(wrapper.find(SimpleViewer).exists()).toBe(true); + describe('switchViewer()', () => { + it('switches to the passed viewer', async () => { + createComponent(); + + wrapper.vm.switchViewer(RichViewerMock.type); + + await nextTick(); + expect(wrapper.vm.activeViewerType).toBe(RichViewerMock.type); + expect(wrapper.findComponent(RichViewer).exists()).toBe(true); + + await wrapper.vm.switchViewer(SimpleViewerMock.type); + expect(wrapper.vm.activeViewerType).toBe(SimpleViewerMock.type); + expect(wrapper.findComponent(SimpleViewer).exists()).toBe(true); + }); + }); }); - describe('switchViewer()', () => { - it('switches to the passed viewer', async () => { - createComponent(); + describe('if hash starts with anything else', () => { + beforeEach(() => { + window.location.hash = '#last-headline'; + }); - wrapper.vm.switchViewer(RichViewerMock.type); + it('renders rich viewer by default', () => { + createComponent({ + data: {}, + }); - await nextTick(); expect(wrapper.vm.activeViewerType).toBe(RichViewerMock.type); - expect(wrapper.find(RichViewer).exists()).toBe(true); + expect(wrapper.findComponent(RichViewer).exists()).toBe(true); + }); - await wrapper.vm.switchViewer(SimpleViewerMock.type); - expect(wrapper.vm.activeViewerType).toBe(SimpleViewerMock.type); - expect(wrapper.find(SimpleViewer).exists()).toBe(true); + describe('switchViewer()', () => { + it('switches to the passed viewer', async () => { + createComponent(); + + wrapper.vm.switchViewer(SimpleViewerMock.type); + + await nextTick(); + expect(wrapper.vm.activeViewerType).toBe(SimpleViewerMock.type); + expect(wrapper.findComponent(SimpleViewer).exists()).toBe(true); + + await wrapper.vm.switchViewer(RichViewerMock.type); + expect(wrapper.vm.activeViewerType).toBe(RichViewerMock.type); + expect(wrapper.findComponent(RichViewer).exists()).toBe(true); + }); }); }); }); @@ -206,7 +239,7 @@ describe('Blob Embeddable', () => { describe('functionality', () => { describe('render error', () => { - const findContentEl = () => wrapper.find(BlobContent); + const findContentEl = () => wrapper.findComponent(BlobContent); it('correctly sets blob on the blob-content-error component', () => { createComponent(); diff --git a/spec/frontend/snippets/components/snippet_header_spec.js b/spec/frontend/snippets/components/snippet_header_spec.js index b750225a383..c930c9f635b 100644 --- a/spec/frontend/snippets/components/snippet_header_spec.js +++ b/spec/frontend/snippets/components/snippet_header_spec.js @@ -10,7 +10,7 @@ import { differenceInMilliseconds } from '~/lib/utils/datetime_utility'; import SnippetHeader, { i18n } from '~/snippets/components/snippet_header.vue'; import DeleteSnippetMutation from '~/snippets/mutations/delete_snippet.mutation.graphql'; import axios from '~/lib/utils/axios_utils'; -import createFlash, { FLASH_TYPES } from '~/flash'; +import { createAlert, VARIANT_DANGER, VARIANT_SUCCESS } from '~/flash'; jest.mock('~/flash'); @@ -267,9 +267,9 @@ describe('Snippet header component', () => { }); it.each` - request | variant | text - ${200} | ${'SUCCESS'} | ${i18n.snippetSpamSuccess} - ${500} | ${'DANGER'} | ${i18n.snippetSpamFailure} + request | variant | text + ${200} | ${VARIANT_SUCCESS} | ${i18n.snippetSpamSuccess} + ${500} | ${VARIANT_DANGER} | ${i18n.snippetSpamFailure} `( 'renders a "$variant" flash message with "$text" message for a request with a "$request" response', async ({ request, variant, text }) => { @@ -278,9 +278,9 @@ describe('Snippet header component', () => { submitAsSpamBtn.trigger('click'); await waitForPromises(); - expect(createFlash).toHaveBeenLastCalledWith({ + expect(createAlert).toHaveBeenLastCalledWith({ message: expect.stringContaining(text), - type: FLASH_TYPES[variant], + variant, }); }, ); @@ -311,7 +311,7 @@ describe('Snippet header component', () => { it('renders modal for deletion of a snippet', () => { createComponent(); - expect(wrapper.find(GlModal).exists()).toBe(true); + expect(wrapper.findComponent(GlModal).exists()).toBe(true); }); it.each` diff --git a/spec/frontend/snippets/components/snippet_title_spec.js b/spec/frontend/snippets/components/snippet_title_spec.js index 48fb51ce703..7c40735d64e 100644 --- a/spec/frontend/snippets/components/snippet_title_spec.js +++ b/spec/frontend/snippets/components/snippet_title_spec.js @@ -39,12 +39,12 @@ describe('Snippet header component', () => { createComponent(); expect(wrapper.text().trim()).toContain(title); - expect(wrapper.find(SnippetDescription).props('description')).toBe(descriptionHtml); + expect(wrapper.findComponent(SnippetDescription).props('description')).toBe(descriptionHtml); }); it('does not render recent changes time stamp if there were no updates', () => { createComponent(); - expect(wrapper.find(GlSprintf).exists()).toBe(false); + expect(wrapper.findComponent(GlSprintf).exists()).toBe(false); }); it('does not render recent changes time stamp if the time for creation and updates match', () => { @@ -57,7 +57,7 @@ describe('Snippet header component', () => { }); createComponent({ props }); - expect(wrapper.find(GlSprintf).exists()).toBe(false); + expect(wrapper.findComponent(GlSprintf).exists()).toBe(false); }); it('renders translated string with most recent changes timestamp if changes were made', () => { @@ -70,6 +70,6 @@ describe('Snippet header component', () => { }); createComponent({ props }); - expect(wrapper.find(GlSprintf).exists()).toBe(true); + expect(wrapper.findComponent(GlSprintf).exists()).toBe(true); }); }); diff --git a/spec/frontend/snippets/components/snippet_visibility_edit_spec.js b/spec/frontend/snippets/components/snippet_visibility_edit_spec.js index 2d043a5caba..29eb002ef4a 100644 --- a/spec/frontend/snippets/components/snippet_visibility_edit_spec.js +++ b/spec/frontend/snippets/components/snippet_visibility_edit_spec.js @@ -39,13 +39,13 @@ describe('Snippet Visibility Edit component', () => { }); } - const findLink = () => wrapper.find('label').find(GlLink); - const findRadios = () => wrapper.find(GlFormRadioGroup).findAllComponents(GlFormRadio); + const findLink = () => wrapper.find('label').findComponent(GlLink); + const findRadios = () => wrapper.findComponent(GlFormRadioGroup).findAllComponents(GlFormRadio); const findRadiosData = () => findRadios().wrappers.map((x) => { return { value: x.find('input').attributes('value'), - icon: x.find(GlIcon).props('name'), + icon: x.findComponent(GlIcon).props('name'), description: x.find('.help-text').text(), text: x.find('.js-visibility-option').text(), }; @@ -147,7 +147,7 @@ describe('Snippet Visibility Edit component', () => { createComponent({ propsData: { value } }); - expect(wrapper.find(GlFormRadioGroup).attributes('checked')).toBe(value); + expect(wrapper.findComponent(GlFormRadioGroup).attributes('checked')).toBe(value); }); }); }); |