diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-12-07 18:09:49 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-12-07 18:09:49 +0300 |
commit | f276d294878605e289c84beb53032b40c53ba961 (patch) | |
tree | 20ca851593d31f5d5fabcaa15a23c9b607df04f5 /spec/frontend/frequent_items | |
parent | 100b1a03e603487ff1966f513ba1a177a8adaefd (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend/frequent_items')
5 files changed, 67 insertions, 8 deletions
diff --git a/spec/frontend/frequent_items/components/app_spec.js b/spec/frontend/frequent_items/components/app_spec.js index b4f36b82385..439a410eaa1 100644 --- a/spec/frontend/frequent_items/components/app_spec.js +++ b/spec/frontend/frequent_items/components/app_spec.js @@ -6,10 +6,10 @@ import waitForPromises from 'helpers/wait_for_promises'; import axios from '~/lib/utils/axios_utils'; import appComponent from '~/frequent_items/components/app.vue'; import eventHub from '~/frequent_items/event_hub'; -import store from '~/frequent_items/store'; import { FREQUENT_ITEMS, HOUR_IN_MS } from '~/frequent_items/constants'; import { getTopFrequentItems } from '~/frequent_items/utils'; import { currentSession, mockFrequentProjects, mockSearchedProjects } from '../mock_data'; +import { createStore } from '~/frequent_items/store'; useLocalStorageSpy(); @@ -18,6 +18,7 @@ const createComponentWithStore = (namespace = 'projects') => { session = currentSession[namespace]; gon.api_version = session.apiVersion; const Component = Vue.extend(appComponent); + const store = createStore(); return mountComponentWithStore(Component, { store, diff --git a/spec/frontend/frequent_items/components/frequent_items_list_item_spec.js b/spec/frontend/frequent_items/components/frequent_items_list_item_spec.js index ab5784b8f7a..1160ed5c84b 100644 --- a/spec/frontend/frequent_items/components/frequent_items_list_item_spec.js +++ b/spec/frontend/frequent_items/components/frequent_items_list_item_spec.js @@ -1,10 +1,14 @@ import { shallowMount } from '@vue/test-utils'; +import { mockTracking, unmockTracking } from 'helpers/tracking_helper'; import { trimText } from 'helpers/text_helper'; import frequentItemsListItemComponent from '~/frequent_items/components/frequent_items_list_item.vue'; -import { mockProject } from '../mock_data'; // can also use 'mockGroup', but not useful to test here +import { createStore } from '~/frequent_items/store'; +import { mockProject } from '../mock_data'; describe('FrequentItemsListItemComponent', () => { let wrapper; + let trackingSpy; + let store = createStore(); const findTitle = () => wrapper.find({ ref: 'frequentItemsItemTitle' }); const findAvatar = () => wrapper.find({ ref: 'frequentItemsItemAvatar' }); @@ -18,6 +22,7 @@ describe('FrequentItemsListItemComponent', () => { const createComponent = (props = {}) => { wrapper = shallowMount(frequentItemsListItemComponent, { + store, propsData: { itemId: mockProject.id, itemName: mockProject.name, @@ -29,7 +34,14 @@ describe('FrequentItemsListItemComponent', () => { }); }; + beforeEach(() => { + store = createStore({ dropdownType: 'project' }); + trackingSpy = mockTracking('_category_', document, jest.spyOn); + trackingSpy.mockImplementation(() => {}); + }); + afterEach(() => { + unmockTracking(); wrapper.destroy(); wrapper = null; }); @@ -97,5 +109,18 @@ describe('FrequentItemsListItemComponent', () => { `('should render $expected $name', ({ selector, expected }) => { expect(selector()).toHaveLength(expected); }); + + it('tracks when item link is clicked', () => { + const link = wrapper.find('a'); + // NOTE: this listener is required to prevent the click from going through and causing: + // `Error: Not implemented: navigation ...` + link.element.addEventListener('click', e => { + e.preventDefault(); + }); + link.trigger('click'); + expect(trackingSpy).toHaveBeenCalledWith(undefined, 'click_link', { + label: 'project_dropdown_frequent_items_list_item', + }); + }); }); }); diff --git a/spec/frontend/frequent_items/components/frequent_items_list_spec.js b/spec/frontend/frequent_items/components/frequent_items_list_spec.js index 238fd508053..b6d2dd714ce 100644 --- a/spec/frontend/frequent_items/components/frequent_items_list_spec.js +++ b/spec/frontend/frequent_items/components/frequent_items_list_spec.js @@ -1,4 +1,5 @@ import { mount } from '@vue/test-utils'; +import { createStore } from '~/frequent_items/store'; import frequentItemsListComponent from '~/frequent_items/components/frequent_items_list.vue'; import frequentItemsListItemComponent from '~/frequent_items/components/frequent_items_list_item.vue'; import { mockFrequentProjects } from '../mock_data'; @@ -8,6 +9,7 @@ describe('FrequentItemsListComponent', () => { const createComponent = (props = {}) => { wrapper = mount(frequentItemsListComponent, { + store: createStore(), propsData: { namespace: 'projects', items: mockFrequentProjects, diff --git a/spec/frontend/frequent_items/components/frequent_items_search_input_spec.js b/spec/frontend/frequent_items/components/frequent_items_search_input_spec.js index c5155315bb9..f5e654e6bcb 100644 --- a/spec/frontend/frequent_items/components/frequent_items_search_input_spec.js +++ b/spec/frontend/frequent_items/components/frequent_items_search_input_spec.js @@ -1,23 +1,35 @@ import { shallowMount } from '@vue/test-utils'; +import { mockTracking, unmockTracking } from 'helpers/tracking_helper'; import searchComponent from '~/frequent_items/components/frequent_items_search_input.vue'; +import { createStore } from '~/frequent_items/store'; import eventHub from '~/frequent_items/event_hub'; -const createComponent = (namespace = 'projects') => - shallowMount(searchComponent, { - propsData: { namespace }, - }); - describe('FrequentItemsSearchInputComponent', () => { let wrapper; + let trackingSpy; let vm; + let store; + + const createComponent = (namespace = 'projects') => + shallowMount(searchComponent, { + store, + propsData: { namespace }, + }); beforeEach(() => { + store = createStore({ dropdownType: 'project' }); + jest.spyOn(store, 'dispatch').mockImplementation(() => {}); + + trackingSpy = mockTracking('_category_', document, jest.spyOn); + trackingSpy.mockImplementation(() => {}); + wrapper = createComponent(); ({ vm } = wrapper); }); afterEach(() => { + unmockTracking(); vm.$destroy(); }); @@ -76,4 +88,24 @@ describe('FrequentItemsSearchInputComponent', () => { ); }); }); + + describe('tracking', () => { + it('tracks when search query is entered', async () => { + expect(trackingSpy).not.toHaveBeenCalled(); + expect(store.dispatch).not.toHaveBeenCalled(); + + const value = 'my project'; + + const input = wrapper.find('input'); + input.setValue(value); + input.trigger('input'); + + await wrapper.vm.$nextTick(); + + expect(trackingSpy).toHaveBeenCalledWith(undefined, 'type_search_query', { + label: 'project_dropdown_frequent_items_search_input', + }); + expect(store.dispatch).toHaveBeenCalledWith('setSearchQuery', value); + }); + }); }); diff --git a/spec/frontend/frequent_items/mock_data.js b/spec/frontend/frequent_items/mock_data.js index 8c3c66f67ff..5e15b4b33e0 100644 --- a/spec/frontend/frequent_items/mock_data.js +++ b/spec/frontend/frequent_items/mock_data.js @@ -30,7 +30,6 @@ export const currentSession = { }; export const mockNamespace = 'projects'; - export const mockStorageKey = 'test-user/frequent-projects'; export const mockGroup = { |