diff options
Diffstat (limited to 'spec/frontend/pipeline_wizard/components')
4 files changed, 128 insertions, 12 deletions
diff --git a/spec/frontend/pipeline_wizard/components/commit_spec.js b/spec/frontend/pipeline_wizard/components/commit_spec.js index c987accbb0d..d7e019c642e 100644 --- a/spec/frontend/pipeline_wizard/components/commit_spec.js +++ b/spec/frontend/pipeline_wizard/components/commit_spec.js @@ -174,7 +174,7 @@ describe('Pipeline Wizard - Commit Page', () => { }); it('will not emit a done event', () => { - expect(wrapper.emitted().done?.length).toBeFalsy(); + expect(wrapper.emitted().done?.length).toBeUndefined(); }); afterEach(() => { diff --git a/spec/frontend/pipeline_wizard/components/editor_spec.js b/spec/frontend/pipeline_wizard/components/editor_spec.js index 540a08d2c7f..26e4b8eb0ea 100644 --- a/spec/frontend/pipeline_wizard/components/editor_spec.js +++ b/spec/frontend/pipeline_wizard/components/editor_spec.js @@ -11,7 +11,7 @@ describe('Pages Yaml Editor wrapper', () => { const wrapper = mount(YamlEditor, defaultOptions); it('editor is mounted', () => { - expect(wrapper.vm.editor).not.toBeFalsy(); + expect(wrapper.vm.editor).not.toBeUndefined(); expect(wrapper.find('.gl-source-editor').exists()).toBe(true); }); }); @@ -57,13 +57,4 @@ describe('Pages Yaml Editor wrapper', () => { }); }); }); - - describe('events', () => { - const wrapper = mount(YamlEditor, defaultOptions); - - it('emits touch if content is changed in editor', async () => { - await wrapper.vm.editor.setValue('foo: boo'); - expect(wrapper.emitted('touch')).toEqual([expect.any(Array)]); - }); - }); }); diff --git a/spec/frontend/pipeline_wizard/components/input_wrapper_spec.js b/spec/frontend/pipeline_wizard/components/input_wrapper_spec.js index ea2448b1362..f288264a11e 100644 --- a/spec/frontend/pipeline_wizard/components/input_wrapper_spec.js +++ b/spec/frontend/pipeline_wizard/components/input_wrapper_spec.js @@ -30,7 +30,7 @@ describe('Pipeline Wizard -- Input Wrapper', () => { beforeEach(() => { createComponent({}); - inputChild = wrapper.find(TextWidget); + inputChild = wrapper.findComponent(TextWidget); }); afterEach(() => { diff --git a/spec/frontend/pipeline_wizard/components/wrapper_spec.js b/spec/frontend/pipeline_wizard/components/wrapper_spec.js index 357a9d21723..f064bf01c86 100644 --- a/spec/frontend/pipeline_wizard/components/wrapper_spec.js +++ b/spec/frontend/pipeline_wizard/components/wrapper_spec.js @@ -2,6 +2,7 @@ import { Document, parseDocument } from 'yaml'; import { GlProgressBar } from '@gitlab/ui'; import { nextTick } from 'vue'; import { shallowMountExtended, mountExtended } from 'helpers/vue_test_utils_helper'; +import { mockTracking } from 'helpers/tracking_helper'; import PipelineWizardWrapper, { i18n } from '~/pipeline_wizard/components/wrapper.vue'; import WizardStep from '~/pipeline_wizard/components/step.vue'; import CommitStep from '~/pipeline_wizard/components/commit.vue'; @@ -19,9 +20,11 @@ describe('Pipeline Wizard - wrapper.vue', () => { const steps = parseDocument(stepsYaml).toJS(); const getAsYamlNode = (value) => new Document(value).contents; + const templateId = 'my-namespace/my-template'; const createComponent = (props = {}, mountFn = shallowMountExtended) => { wrapper = mountFn(PipelineWizardWrapper, { propsData: { + templateId, projectPath: '/user/repo', defaultBranch: 'main', filename: '.gitlab-ci.yml', @@ -311,4 +314,126 @@ describe('Pipeline Wizard - wrapper.vue', () => { }); }); }); + + describe('when commit step done', () => { + beforeEach(() => { + createComponent(); + }); + + afterEach(() => { + wrapper.destroy(); + }); + + it('emits done', () => { + expect(wrapper.emitted('done')).toBeUndefined(); + + wrapper.findComponent(CommitStep).vm.$emit('done'); + + expect(wrapper.emitted('done')).toHaveLength(1); + }); + }); + + describe('tracking', () => { + let trackingSpy; + const trackingCategory = `pipeline_wizard:${templateId}`; + + const setUpTrackingSpy = () => { + trackingSpy = mockTracking(undefined, wrapper.element, jest.spyOn); + }; + + it('tracks next button click event', () => { + createComponent(); + setUpTrackingSpy(); + findFirstVisibleStep().vm.$emit('next'); + + expect(trackingSpy).toHaveBeenCalledWith(trackingCategory, 'click_button', { + category: trackingCategory, + property: 'next', + label: 'pipeline_wizard_navigation', + extra: { + fromStep: 0, + toStep: 1, + }, + }); + }); + + it('tracks back button click event', () => { + createComponent(); + + // Navigate to step 1 without the spy set up + findFirstVisibleStep().vm.$emit('next'); + + // Now enable the tracking spy + setUpTrackingSpy(); + + findFirstVisibleStep().vm.$emit('back'); + + expect(trackingSpy).toHaveBeenCalledWith(trackingCategory, 'click_button', { + category: trackingCategory, + property: 'back', + label: 'pipeline_wizard_navigation', + extra: { + fromStep: 1, + toStep: 0, + }, + }); + }); + + it('tracks back button click event on the commit step', () => { + createComponent(); + + // Navigate to step 2 without the spy set up + findFirstVisibleStep().vm.$emit('next'); + findFirstVisibleStep().vm.$emit('next'); + + // Now enable the tracking spy + setUpTrackingSpy(); + + wrapper.findComponent(CommitStep).vm.$emit('back'); + + expect(trackingSpy).toHaveBeenCalledWith(trackingCategory, 'click_button', { + category: trackingCategory, + property: 'back', + label: 'pipeline_wizard_navigation', + extra: { + fromStep: 2, + toStep: 1, + }, + }); + }); + + it('tracks done event on the commit step', () => { + createComponent(); + + // Navigate to step 2 without the spy set up + findFirstVisibleStep().vm.$emit('next'); + findFirstVisibleStep().vm.$emit('next'); + + // Now enable the tracking spy + setUpTrackingSpy(); + + wrapper.findComponent(CommitStep).vm.$emit('done'); + + expect(trackingSpy).toHaveBeenCalledWith(trackingCategory, 'click_button', { + category: trackingCategory, + label: 'pipeline_wizard_commit', + property: 'commit', + }); + }); + + it('tracks when editor emits touch events', () => { + createComponent(); + setUpTrackingSpy(); + + wrapper.findComponent(YamlEditor).vm.$emit('touch'); + + expect(trackingSpy).toHaveBeenCalledWith(trackingCategory, 'edit', { + category: trackingCategory, + label: 'pipeline_wizard_editor_interaction', + extra: { + currentStep: 0, + }, + }); + }); + }); }); |