diff options
Diffstat (limited to 'spec/frontend/blob')
14 files changed, 110 insertions, 50 deletions
diff --git a/spec/frontend/blob/3d_viewer/mesh_object_spec.js b/spec/frontend/blob/3d_viewer/mesh_object_spec.js index 60be285039f..3014af073f5 100644 --- a/spec/frontend/blob/3d_viewer/mesh_object_spec.js +++ b/spec/frontend/blob/3d_viewer/mesh_object_spec.js @@ -5,7 +5,7 @@ describe('Mesh object', () => { it('defaults to non-wireframe material', () => { const object = new MeshObject(new BoxGeometry(10, 10, 10)); - expect(object.material.wireframe).toBeFalsy(); + expect(object.material.wireframe).toBe(false); }); it('changes to wirefame material', () => { @@ -13,7 +13,7 @@ describe('Mesh object', () => { object.changeMaterial('wireframe'); - expect(object.material.wireframe).toBeTruthy(); + expect(object.material.wireframe).toBe(true); }); it('scales object down', () => { diff --git a/spec/frontend/blob/blob_links_tracking_spec.js b/spec/frontend/blob/blob_links_tracking_spec.js new file mode 100644 index 00000000000..22e087bc180 --- /dev/null +++ b/spec/frontend/blob/blob_links_tracking_spec.js @@ -0,0 +1,60 @@ +import { setHTMLFixture, resetHTMLFixture } from 'helpers/fixtures'; +import addBlobLinksTracking from '~/blob/blob_links_tracking'; +import Tracking from '~/tracking'; + +describe('Blob links Tracking', () => { + const eventName = 'click_link'; + const label = 'file_line_action'; + + const eventsToTrack = [ + { selector: '.file-line-blame', property: 'blame' }, + { selector: '.file-line-num', property: 'link' }, + ]; + + const [blameLinkClickEvent, numLinkClickEvent] = eventsToTrack; + + beforeEach(() => { + setHTMLFixture(` + <div id="blob-content-holder"> + <div class="line-links diff-line-num"> + <a href="#L5" class="file-line-blame"></a> + <a id="L5" href="#L5" data-line-number="5" class="file-line-num">5</a> + </div> + <pre id="LC5">Line 5 content</pre> + </div> + `); + addBlobLinksTracking('#blob-content-holder', eventsToTrack); + jest.spyOn(Tracking, 'event'); + }); + + afterEach(() => { + resetHTMLFixture(); + }); + + it('tracks blame link click event', () => { + const blameButton = document.querySelector(blameLinkClickEvent.selector); + blameButton.click(); + + expect(Tracking.event).toHaveBeenCalledWith(undefined, eventName, { + label, + property: blameLinkClickEvent.property, + }); + }); + + it('tracks num link click event', () => { + const numLinkButton = document.querySelector(numLinkClickEvent.selector); + numLinkButton.click(); + + expect(Tracking.event).toHaveBeenCalledWith(undefined, eventName, { + label, + property: numLinkClickEvent.property, + }); + }); + + it("doesn't fire tracking if the user clicks on any element that is not a link", () => { + const codeLine = document.querySelector('#LC5'); + codeLine.click(); + + expect(Tracking.event).not.toHaveBeenCalled(); + }); +}); diff --git a/spec/frontend/blob/components/blob_content_spec.js b/spec/frontend/blob/components/blob_content_spec.js index 8450c6b9332..788ee0a86ab 100644 --- a/spec/frontend/blob/components/blob_content_spec.js +++ b/spec/frontend/blob/components/blob_content_spec.js @@ -36,20 +36,20 @@ describe('Blob Content component', () => { describe('rendering', () => { it('renders loader if `loading: true`', () => { createComponent({ loading: true }); - expect(wrapper.find(GlLoadingIcon).exists()).toBe(true); - expect(wrapper.find(BlobContentError).exists()).toBe(false); - expect(wrapper.find(RichViewer).exists()).toBe(false); - expect(wrapper.find(SimpleViewer).exists()).toBe(false); + expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(true); + expect(wrapper.findComponent(BlobContentError).exists()).toBe(false); + expect(wrapper.findComponent(RichViewer).exists()).toBe(false); + expect(wrapper.findComponent(SimpleViewer).exists()).toBe(false); }); it('renders error if there is any in the viewer', () => { const renderError = 'Oops'; const viewer = { ...SimpleViewerMock, renderError }; createComponent({}, viewer); - expect(wrapper.find(GlLoadingIcon).exists()).toBe(false); - expect(wrapper.find(BlobContentError).exists()).toBe(true); - expect(wrapper.find(RichViewer).exists()).toBe(false); - expect(wrapper.find(SimpleViewer).exists()).toBe(false); + expect(wrapper.findComponent(GlLoadingIcon).exists()).toBe(false); + expect(wrapper.findComponent(BlobContentError).exists()).toBe(true); + expect(wrapper.findComponent(RichViewer).exists()).toBe(false); + expect(wrapper.findComponent(SimpleViewer).exists()).toBe(false); }); it.each` @@ -60,7 +60,7 @@ describe('Blob Content component', () => { 'renders $type viewer when activeViewer is $type and no loading or error detected', ({ mock, viewer }) => { createComponent({}, mock); - expect(wrapper.find(viewer).exists()).toBe(true); + expect(wrapper.findComponent(viewer).exists()).toBe(true); }, ); @@ -70,13 +70,13 @@ describe('Blob Content component', () => { ${RichBlobContentMock.richData} | ${RichViewerMock} | ${RichViewer} `('renders correct content that is passed to the component', ({ content, mock, viewer }) => { createComponent({ content }, mock); - expect(wrapper.find(viewer).html()).toContain(content); + expect(wrapper.findComponent(viewer).html()).toContain(content); }); }); describe('functionality', () => { describe('render error', () => { - const findErrorEl = () => wrapper.find(BlobContentError); + const findErrorEl = () => wrapper.findComponent(BlobContentError); const renderError = BLOB_RENDER_ERRORS.REASONS.COLLAPSED.id; const viewer = { ...SimpleViewerMock, renderError }; diff --git a/spec/frontend/blob/components/blob_edit_content_spec.js b/spec/frontend/blob/components/blob_edit_content_spec.js index 9fc2356c018..5017b624292 100644 --- a/spec/frontend/blob/components/blob_edit_content_spec.js +++ b/spec/frontend/blob/components/blob_edit_content_spec.js @@ -69,7 +69,7 @@ describe('Blob Header Editing', () => { }); it('initialises Source Editor', () => { - const el = wrapper.find({ ref: 'editor' }).element; + const el = wrapper.findComponent({ ref: 'editor' }).element; expect(utils.initSourceEditor).toHaveBeenCalledWith({ el, blobPath: fileName, diff --git a/spec/frontend/blob/components/blob_edit_header_spec.js b/spec/frontend/blob/components/blob_edit_header_spec.js index b1ce0e9a4c5..c84b5896348 100644 --- a/spec/frontend/blob/components/blob_edit_header_spec.js +++ b/spec/frontend/blob/components/blob_edit_header_spec.js @@ -16,7 +16,7 @@ describe('Blob Header Editing', () => { }); }; const findDeleteButton = () => - wrapper.findAll(GlButton).wrappers.find((x) => x.text() === 'Delete file'); + wrapper.findAllComponents(GlButton).wrappers.find((x) => x.text() === 'Delete file'); beforeEach(() => { createComponent(); @@ -32,7 +32,7 @@ describe('Blob Header Editing', () => { }); it('contains a form input field', () => { - expect(wrapper.find(GlFormInput).exists()).toBe(true); + expect(wrapper.findComponent(GlFormInput).exists()).toBe(true); }); it('does not show delete button', () => { @@ -42,7 +42,7 @@ describe('Blob Header Editing', () => { describe('functionality', () => { it('emits input event when the blob name is changed', async () => { - const inputComponent = wrapper.find(GlFormInput); + const inputComponent = wrapper.findComponent(GlFormInput); const newValue = 'bar.txt'; // setData usage is discouraged. See https://gitlab.com/groups/gitlab-org/-/epics/7330 for details diff --git a/spec/frontend/blob/components/blob_header_default_actions_spec.js b/spec/frontend/blob/components/blob_header_default_actions_spec.js index aa538facae2..0f015715dc2 100644 --- a/spec/frontend/blob/components/blob_header_default_actions_spec.js +++ b/spec/frontend/blob/components/blob_header_default_actions_spec.js @@ -30,8 +30,8 @@ describe('Blob Header Default Actions', () => { beforeEach(() => { createComponent(); - btnGroup = wrapper.find(GlButtonGroup); - buttons = wrapper.findAll(GlButton); + btnGroup = wrapper.findComponent(GlButtonGroup); + buttons = wrapper.findAllComponents(GlButton); }); afterEach(() => { @@ -69,9 +69,9 @@ describe('Blob Header Default Actions', () => { createComponent({ activeViewer: RICH_BLOB_VIEWER, }); - buttons = wrapper.findAll(GlButton); + buttons = wrapper.findAllComponents(GlButton); - expect(buttons.at(0).attributes('disabled')).toBeTruthy(); + expect(buttons.at(0).attributes('disabled')).toBe('true'); }); it('does not render the copy button if a rendering error is set', () => { diff --git a/spec/frontend/blob/components/blob_header_filepath_spec.js b/spec/frontend/blob/components/blob_header_filepath_spec.js index 8220b598ff6..8c32cba1ba4 100644 --- a/spec/frontend/blob/components/blob_header_filepath_spec.js +++ b/spec/frontend/blob/components/blob_header_filepath_spec.js @@ -25,7 +25,7 @@ describe('Blob Header Filepath', () => { wrapper.destroy(); }); - const findBadge = () => wrapper.find(GlBadge); + const findBadge = () => wrapper.findComponent(GlBadge); describe('rendering', () => { it('matches the snapshot', () => { @@ -46,7 +46,7 @@ describe('Blob Header Filepath', () => { it('renders copy-to-clipboard icon that copies path of the Blob', () => { createComponent(); - const btn = wrapper.find(ClipboardButton); + const btn = wrapper.findComponent(ClipboardButton); expect(btn.exists()).toBe(true); expect(btn.vm.text).toBe(MockBlob.path); }); diff --git a/spec/frontend/blob/components/blob_header_spec.js b/spec/frontend/blob/components/blob_header_spec.js index ee42c2387ae..46740958090 100644 --- a/spec/frontend/blob/components/blob_header_spec.js +++ b/spec/frontend/blob/components/blob_header_spec.js @@ -31,7 +31,7 @@ describe('Blob Header Default Actions', () => { }); describe('rendering', () => { - const findDefaultActions = () => wrapper.find(DefaultActions); + const findDefaultActions = () => wrapper.findComponent(DefaultActions); const slots = { prepend: 'Foo Prepend', @@ -45,17 +45,17 @@ describe('Blob Header Default Actions', () => { it('renders all components', () => { createComponent(); - expect(wrapper.find(TableContents).exists()).toBe(true); - expect(wrapper.find(ViewerSwitcher).exists()).toBe(true); + expect(wrapper.findComponent(TableContents).exists()).toBe(true); + expect(wrapper.findComponent(ViewerSwitcher).exists()).toBe(true); expect(findDefaultActions().exists()).toBe(true); - expect(wrapper.find(BlobFilepath).exists()).toBe(true); + expect(wrapper.findComponent(BlobFilepath).exists()).toBe(true); }); it('does not render viewer switcher if the blob has only the simple viewer', () => { createComponent({ richViewer: null, }); - expect(wrapper.find(ViewerSwitcher).exists()).toBe(false); + expect(wrapper.findComponent(ViewerSwitcher).exists()).toBe(false); }); it('does not render viewer switcher if a corresponding prop is passed', () => { @@ -66,7 +66,7 @@ describe('Blob Header Default Actions', () => { hideViewerSwitcher: true, }, ); - expect(wrapper.find(ViewerSwitcher).exists()).toBe(false); + expect(wrapper.findComponent(ViewerSwitcher).exists()).toBe(false); }); it('does not render default actions is corresponding prop is passed', () => { @@ -77,7 +77,7 @@ describe('Blob Header Default Actions', () => { hideDefaultActions: true, }, ); - expect(wrapper.find(DefaultActions).exists()).toBe(false); + expect(wrapper.findComponent(DefaultActions).exists()).toBe(false); }); Object.keys(slots).forEach((slot) => { diff --git a/spec/frontend/blob/components/blob_header_viewer_switcher_spec.js b/spec/frontend/blob/components/blob_header_viewer_switcher_spec.js index 91baaf3ea69..1eac0733646 100644 --- a/spec/frontend/blob/components/blob_header_viewer_switcher_spec.js +++ b/spec/frontend/blob/components/blob_header_viewer_switcher_spec.js @@ -35,8 +35,8 @@ describe('Blob Header Viewer Switcher', () => { beforeEach(() => { createComponent(); - btnGroup = wrapper.find(GlButtonGroup); - buttons = wrapper.findAll(GlButton); + btnGroup = wrapper.findComponent(GlButtonGroup); + buttons = wrapper.findAllComponents(GlButton); }); it('renders gl-button-group component', () => { @@ -58,7 +58,7 @@ describe('Blob Header Viewer Switcher', () => { function factory(propsData = {}) { createComponent(propsData); - buttons = wrapper.findAll(GlButton); + buttons = wrapper.findAllComponents(GlButton); simpleBtn = buttons.at(0); richBtn = buttons.at(1); diff --git a/spec/frontend/blob/notebook/notebook_viever_spec.js b/spec/frontend/blob/notebook/notebook_viever_spec.js index 93406db2675..ea4badc03fb 100644 --- a/spec/frontend/blob/notebook/notebook_viever_spec.js +++ b/spec/frontend/blob/notebook/notebook_viever_spec.js @@ -31,10 +31,10 @@ describe('iPython notebook renderer', () => { wrapper = shallowMount(component, { propsData: { endpoint, relativeRawPath } }); }; - const findLoading = () => wrapper.find(GlLoadingIcon); - const findNotebookLab = () => wrapper.find(NotebookLab); - const findLoadErrorMessage = () => wrapper.find({ ref: 'loadErrorMessage' }); - const findParseErrorMessage = () => wrapper.find({ ref: 'parsingErrorMessage' }); + const findLoading = () => wrapper.findComponent(GlLoadingIcon); + const findNotebookLab = () => wrapper.findComponent(NotebookLab); + const findLoadErrorMessage = () => wrapper.findComponent({ ref: 'loadErrorMessage' }); + const findParseErrorMessage = () => wrapper.findComponent({ ref: 'parsingErrorMessage' }); beforeEach(() => { mock = new MockAdapter(axios); diff --git a/spec/frontend/blob/pdf/pdf_viewer_spec.js b/spec/frontend/blob/pdf/pdf_viewer_spec.js index e332ea49fa6..23227df6357 100644 --- a/spec/frontend/blob/pdf/pdf_viewer_spec.js +++ b/spec/frontend/blob/pdf/pdf_viewer_spec.js @@ -18,9 +18,9 @@ describe('PDF renderer', () => { }); }; - const findLoading = () => wrapper.find(GlLoadingIcon); - const findPdfLab = () => wrapper.find(PdfLab); - const findLoadError = () => wrapper.find({ ref: 'loadError' }); + const findLoading = () => wrapper.findComponent(GlLoadingIcon); + const findPdfLab = () => wrapper.findComponent(PdfLab); + const findLoadError = () => wrapper.findComponent({ ref: 'loadError' }); beforeEach(() => { mountComponent(); diff --git a/spec/frontend/blob/pipeline_tour_success_modal_spec.js b/spec/frontend/blob/pipeline_tour_success_modal_spec.js index 750dd8f0a72..81b38cfc278 100644 --- a/spec/frontend/blob/pipeline_tour_success_modal_spec.js +++ b/spec/frontend/blob/pipeline_tour_success_modal_spec.js @@ -52,7 +52,7 @@ describe('PipelineTourSuccessModal', () => { }); it('renders the path from the commit cookie for back to the merge request button', () => { - const goToMrBtn = wrapper.find({ ref: 'goToMergeRequest' }); + const goToMrBtn = wrapper.findComponent({ ref: 'goToMergeRequest' }); expect(goToMrBtn.attributes('href')).toBe(expectedMrPath); }); @@ -67,16 +67,16 @@ describe('PipelineTourSuccessModal', () => { }); it('renders the path from projectMergeRequestsPath for back to the merge request button', () => { - const goToMrBtn = wrapper.find({ ref: 'goToMergeRequest' }); + const goToMrBtn = wrapper.findComponent({ ref: 'goToMergeRequest' }); expect(goToMrBtn.attributes('href')).toBe(expectedMrPath); }); }); it('has expected structure', () => { - const modal = wrapper.find(GlModal); - const sprintf = modal.find(GlSprintf); - const emoji = modal.find(GlEmoji); + const modal = wrapper.findComponent(GlModal); + const sprintf = modal.findComponent(GlSprintf); + const emoji = modal.findComponent(GlEmoji); expect(wrapper.text()).toContain("That's it, well done!"); expect(sprintf.exists()).toBe(true); @@ -84,7 +84,7 @@ describe('PipelineTourSuccessModal', () => { }); it('renders the link for codeQualityLink', () => { - expect(wrapper.find(GlLink).attributes('href')).toBe('/code-quality-link'); + expect(wrapper.findComponent(GlLink).attributes('href')).toBe('/code-quality-link'); }); it('calls to remove cookie', () => { @@ -103,7 +103,7 @@ describe('PipelineTourSuccessModal', () => { it('send an event when go to pipelines is clicked', () => { trackingSpy = mockTracking('_category_', wrapper.element, jest.spyOn); - const goToBtn = wrapper.find({ ref: 'goToPipelines' }); + const goToBtn = wrapper.findComponent({ ref: 'goToPipelines' }); triggerEvent(goToBtn.element); expect(trackingSpy).toHaveBeenCalledWith('_category_', 'click_button', { @@ -115,7 +115,7 @@ describe('PipelineTourSuccessModal', () => { it('sends an event when back to the merge request is clicked', () => { trackingSpy = mockTracking('_category_', wrapper.element, jest.spyOn); - const goToBtn = wrapper.find({ ref: 'goToMergeRequest' }); + const goToBtn = wrapper.findComponent({ ref: 'goToMergeRequest' }); triggerEvent(goToBtn.element); expect(trackingSpy).toHaveBeenCalledWith('_category_', 'click_button', { diff --git a/spec/frontend/blob/sketch/index_spec.js b/spec/frontend/blob/sketch/index_spec.js index 5e1922a24f4..e8d1f724c4b 100644 --- a/spec/frontend/blob/sketch/index_spec.js +++ b/spec/frontend/blob/sketch/index_spec.js @@ -69,7 +69,7 @@ describe('Sketch viewer', () => { const img = document.querySelector('#js-sketch-viewer img'); expect(img).not.toBeNull(); - expect(img.classList.contains('img-fluid')).toBeTruthy(); + expect(img.classList.contains('img-fluid')).toBe(true); }); it('renders link to image', () => { diff --git a/spec/frontend/blob/suggest_gitlab_ci_yml/components/popover_spec.js b/spec/frontend/blob/suggest_gitlab_ci_yml/components/popover_spec.js index 7e13994f2b7..6b329dc078a 100644 --- a/spec/frontend/blob/suggest_gitlab_ci_yml/components/popover_spec.js +++ b/spec/frontend/blob/suggest_gitlab_ci_yml/components/popover_spec.js @@ -98,7 +98,7 @@ describe('Suggest gitlab-ci.yml Popover', () => { const expectedAction = 'click_button'; const expectedProperty = 'owner'; const expectedValue = '10'; - const dismissButton = wrapper.find(GlButton); + const dismissButton = wrapper.findComponent(GlButton); trackingSpy = mockTracking('_category_', wrapper.element, jest.spyOn); triggerEvent(dismissButton.element); |