diff options
Diffstat (limited to 'spec/frontend/pipeline_editor/components')
5 files changed, 81 insertions, 15 deletions
diff --git a/spec/frontend/pipeline_editor/components/editor/ci_config_merged_preview_spec.js b/spec/frontend/pipeline_editor/components/editor/ci_config_merged_preview_spec.js index fb191fccb0d..7dd8a77d055 100644 --- a/spec/frontend/pipeline_editor/components/editor/ci_config_merged_preview_spec.js +++ b/spec/frontend/pipeline_editor/components/editor/ci_config_merged_preview_spec.js @@ -8,7 +8,7 @@ import { mockLintResponse, mockCiConfigPath } from '../../mock_data'; describe('Text editor component', () => { let wrapper; - const MockEditorLite = { + const MockSourceEditor = { template: '<div/>', props: ['value', 'fileName', 'editorOptions'], mounted() { @@ -26,13 +26,13 @@ describe('Text editor component', () => { ciConfigPath: mockCiConfigPath, }, stubs: { - EditorLite: MockEditorLite, + SourceEditor: MockSourceEditor, }, }); }; const findIcon = () => wrapper.findComponent(GlIcon); - const findEditor = () => wrapper.findComponent(MockEditorLite); + const findEditor = () => wrapper.findComponent(MockSourceEditor); afterEach(() => { wrapper.destroy(); diff --git a/spec/frontend/pipeline_editor/components/editor/ci_editor_header_spec.js b/spec/frontend/pipeline_editor/components/editor/ci_editor_header_spec.js new file mode 100644 index 00000000000..3ee53d4a055 --- /dev/null +++ b/spec/frontend/pipeline_editor/components/editor/ci_editor_header_spec.js @@ -0,0 +1,53 @@ +import { GlButton } from '@gitlab/ui'; +import { shallowMount } from '@vue/test-utils'; +import { mockTracking, unmockTracking } from 'helpers/tracking_helper'; +import CiEditorHeader from '~/pipeline_editor/components/editor/ci_editor_header.vue'; +import { + pipelineEditorTrackingOptions, + TEMPLATE_REPOSITORY_URL, +} from '~/pipeline_editor/constants'; + +describe('CI Editor Header', () => { + let wrapper; + let trackingSpy = null; + + const createComponent = () => { + wrapper = shallowMount(CiEditorHeader, {}); + }; + + const findLinkBtn = () => wrapper.findComponent(GlButton); + + afterEach(() => { + wrapper.destroy(); + unmockTracking(); + }); + + describe('link button', () => { + beforeEach(() => { + createComponent(); + trackingSpy = mockTracking(undefined, wrapper.element, jest.spyOn); + }); + + it('finds the browse template button', () => { + expect(findLinkBtn().exists()).toBe(true); + }); + + it('contains the link to the template repo', () => { + expect(findLinkBtn().attributes('href')).toBe(TEMPLATE_REPOSITORY_URL); + }); + + it('has the external-link icon', () => { + expect(findLinkBtn().props('icon')).toBe('external-link'); + }); + + it('tracks the click on the browse button', async () => { + const { label, actions } = pipelineEditorTrackingOptions; + + await findLinkBtn().vm.$emit('click'); + + expect(trackingSpy).toHaveBeenCalledWith(undefined, actions.browse_templates, { + label, + }); + }); + }); +}); diff --git a/spec/frontend/pipeline_editor/components/editor/text_editor_spec.js b/spec/frontend/pipeline_editor/components/editor/text_editor_spec.js index 6f9245e39aa..c6c7f593cc5 100644 --- a/spec/frontend/pipeline_editor/components/editor/text_editor_spec.js +++ b/spec/frontend/pipeline_editor/components/editor/text_editor_spec.js @@ -1,7 +1,7 @@ import { shallowMount } from '@vue/test-utils'; import { EDITOR_READY_EVENT } from '~/editor/constants'; -import { EditorLiteExtension } from '~/editor/extensions/editor_lite_extension_base'; +import { SourceEditorExtension } from '~/editor/extensions/source_editor_extension_base'; import TextEditor from '~/pipeline_editor/components/editor/text_editor.vue'; import { mockCiConfigPath, @@ -19,7 +19,7 @@ describe('Pipeline Editor | Text editor component', () => { let mockUse; let mockRegisterCiSchema; - const MockEditorLite = { + const MockSourceEditor = { template: '<div/>', props: ['value', 'fileName'], mounted() { @@ -55,15 +55,15 @@ describe('Pipeline Editor | Text editor component', () => { [EDITOR_READY_EVENT]: editorReadyListener, }, stubs: { - EditorLite: MockEditorLite, + SourceEditor: MockSourceEditor, }, }); }; - const findEditor = () => wrapper.findComponent(MockEditorLite); + const findEditor = () => wrapper.findComponent(MockSourceEditor); beforeEach(() => { - EditorLiteExtension.deferRerender = jest.fn(); + SourceEditorExtension.deferRerender = jest.fn(); }); afterEach(() => { diff --git a/spec/frontend/pipeline_editor/components/file-nav/branch_switcher_spec.js b/spec/frontend/pipeline_editor/components/file-nav/branch_switcher_spec.js index e731ad8695e..85b51d08f88 100644 --- a/spec/frontend/pipeline_editor/components/file-nav/branch_switcher_spec.js +++ b/spec/frontend/pipeline_editor/components/file-nav/branch_switcher_spec.js @@ -207,7 +207,8 @@ describe('Pipeline editor branch switcher', () => { it('updates session history when selecting a different branch', async () => { const branch = findDropdownItems().at(1); - await branch.vm.$emit('click'); + branch.vm.$emit('click'); + await waitForPromises(); expect(window.history.pushState).toHaveBeenCalled(); expect(window.history.pushState.mock.calls[0][2]).toContain(`?branch_name=${branch.text()}`); @@ -215,7 +216,8 @@ describe('Pipeline editor branch switcher', () => { it('does not update session history when selecting current branch', async () => { const branch = findDropdownItems().at(0); - await branch.vm.$emit('click'); + branch.vm.$emit('click'); + await waitForPromises(); expect(branch.text()).toBe(mockDefaultBranch); expect(window.history.pushState).not.toHaveBeenCalled(); @@ -227,7 +229,8 @@ describe('Pipeline editor branch switcher', () => { expect(branch.text()).not.toBe(mockDefaultBranch); expect(wrapper.emitted('refetchContent')).toBeUndefined(); - await branch.vm.$emit('click'); + branch.vm.$emit('click'); + await waitForPromises(); expect(wrapper.emitted('refetchContent')).toBeDefined(); expect(wrapper.emitted('refetchContent')).toHaveLength(1); @@ -239,10 +242,20 @@ describe('Pipeline editor branch switcher', () => { expect(branch.text()).toBe(mockDefaultBranch); expect(wrapper.emitted('refetchContent')).toBeUndefined(); - await branch.vm.$emit('click'); + branch.vm.$emit('click'); + await waitForPromises(); expect(wrapper.emitted('refetchContent')).toBeUndefined(); }); + + it('emits the updateCommitSha event when selecting a different branch', async () => { + expect(wrapper.emitted('updateCommitSha')).toBeUndefined(); + + const branch = findDropdownItems().at(1); + branch.vm.$emit('click'); + + expect(wrapper.emitted('updateCommitSha')).toHaveLength(1); + }); }); describe('when searching', () => { diff --git a/spec/frontend/pipeline_editor/components/ui/editor_tab_spec.js b/spec/frontend/pipeline_editor/components/ui/editor_tab_spec.js index 8def83d578b..3becf82ed6e 100644 --- a/spec/frontend/pipeline_editor/components/ui/editor_tab_spec.js +++ b/spec/frontend/pipeline_editor/components/ui/editor_tab_spec.js @@ -6,7 +6,7 @@ import EditorTab from '~/pipeline_editor/components/ui/editor_tab.vue'; const mockContent1 = 'MOCK CONTENT 1'; const mockContent2 = 'MOCK CONTENT 2'; -const MockEditorLite = { +const MockSourceEditor = { template: '<div>EDITOR</div>', }; @@ -48,12 +48,12 @@ describe('~/pipeline_editor/components/ui/editor_tab.vue', () => { wrapper = mount(EditorTab, { propsData: props, slots: { - default: MockEditorLite, + default: MockSourceEditor, }, }); }; - const findSlotComponent = () => wrapper.findComponent(MockEditorLite); + const findSlotComponent = () => wrapper.findComponent(MockSourceEditor); const findAlert = () => wrapper.findComponent(GlAlert); beforeEach(() => { |