diff options
Diffstat (limited to 'spec/frontend/pipelines/components/pipelines_filtered_search_spec.js')
-rw-r--r-- | spec/frontend/pipelines/components/pipelines_filtered_search_spec.js | 123 |
1 files changed, 100 insertions, 23 deletions
diff --git a/spec/frontend/pipelines/components/pipelines_filtered_search_spec.js b/spec/frontend/pipelines/components/pipelines_filtered_search_spec.js index 12c6fab9c41..bdc807fcbfe 100644 --- a/spec/frontend/pipelines/components/pipelines_filtered_search_spec.js +++ b/spec/frontend/pipelines/components/pipelines_filtered_search_spec.js @@ -3,13 +3,7 @@ import { mount } from '@vue/test-utils'; import MockAdapter from 'axios-mock-adapter'; import axios from '~/lib/utils/axios_utils'; import PipelinesFilteredSearch from '~/pipelines/components/pipelines_filtered_search.vue'; -import { - users, - mockSearch, - pipelineWithStages, - branches, - mockBranchesAfterMap, -} from '../mock_data'; +import { users, mockSearch, branches, tags } from '../mock_data'; import { GlFilteredSearch } from '@gitlab/ui'; describe('Pipelines filtered search', () => { @@ -21,12 +15,16 @@ describe('Pipelines filtered search', () => { findFilteredSearch() .props('availableTokens') .find(token => token.type === type); + const findBranchToken = () => getSearchToken('ref'); + const findTagToken = () => getSearchToken('tag'); + const findUserToken = () => getSearchToken('username'); + const findStatusToken = () => getSearchToken('status'); - const createComponent = () => { + const createComponent = (params = {}) => { wrapper = mount(PipelinesFilteredSearch, { propsData: { - pipelines: [pipelineWithStages], projectId: '21', + params, }, attachToDocument: true, }); @@ -37,6 +35,7 @@ describe('Pipelines filtered search', () => { jest.spyOn(Api, 'projectUsers').mockResolvedValue(users); jest.spyOn(Api, 'branches').mockResolvedValue({ data: branches }); + jest.spyOn(Api, 'tags').mockResolvedValue({ data: tags }); createComponent(); }); @@ -55,37 +54,39 @@ describe('Pipelines filtered search', () => { }); it('displays search tokens', () => { - expect(getSearchToken('username')).toMatchObject({ + expect(findUserToken()).toMatchObject({ type: 'username', icon: 'user', title: 'Trigger author', unique: true, - triggerAuthors: users, projectId: '21', operators: [expect.objectContaining({ value: '=' })], }); - expect(getSearchToken('ref')).toMatchObject({ + expect(findBranchToken()).toMatchObject({ type: 'ref', icon: 'branch', title: 'Branch name', unique: true, - branches: mockBranchesAfterMap, projectId: '21', operators: [expect.objectContaining({ value: '=' })], }); - }); - - it('fetches and sets project users', () => { - expect(Api.projectUsers).toHaveBeenCalled(); - - expect(wrapper.vm.projectUsers).toEqual(users); - }); - it('fetches and sets branches', () => { - expect(Api.branches).toHaveBeenCalled(); + expect(findStatusToken()).toMatchObject({ + type: 'status', + icon: 'status', + title: 'Status', + unique: true, + operators: [expect.objectContaining({ value: '=' })], + }); - expect(wrapper.vm.projectBranches).toEqual(mockBranchesAfterMap); + expect(findTagToken()).toMatchObject({ + type: 'tag', + icon: 'tag', + title: 'Tag name', + unique: true, + operators: [expect.objectContaining({ value: '=' })], + }); }); it('emits filterPipelines on submit with correct filter', () => { @@ -94,4 +95,80 @@ describe('Pipelines filtered search', () => { expect(wrapper.emitted('filterPipelines')).toBeTruthy(); expect(wrapper.emitted('filterPipelines')[0]).toEqual([mockSearch]); }); + + it('disables tag name token when branch name token is active', () => { + findFilteredSearch().vm.$emit('input', [ + { type: 'ref', value: { data: 'branch-1', operator: '=' } }, + { type: 'filtered-search-term', value: { data: '' } }, + ]); + + return wrapper.vm.$nextTick().then(() => { + expect(findBranchToken().disabled).toBe(false); + expect(findTagToken().disabled).toBe(true); + }); + }); + + it('disables branch name token when tag name token is active', () => { + findFilteredSearch().vm.$emit('input', [ + { type: 'tag', value: { data: 'tag-1', operator: '=' } }, + { type: 'filtered-search-term', value: { data: '' } }, + ]); + + return wrapper.vm.$nextTick().then(() => { + expect(findBranchToken().disabled).toBe(true); + expect(findTagToken().disabled).toBe(false); + }); + }); + + it('resets tokens disabled state on clear', () => { + findFilteredSearch().vm.$emit('clearInput'); + + return wrapper.vm.$nextTick().then(() => { + expect(findBranchToken().disabled).toBe(false); + expect(findTagToken().disabled).toBe(false); + }); + }); + + it('resets tokens disabled state when clearing tokens by backspace', () => { + findFilteredSearch().vm.$emit('input', [{ type: 'filtered-search-term', value: { data: '' } }]); + + return wrapper.vm.$nextTick().then(() => { + expect(findBranchToken().disabled).toBe(false); + expect(findTagToken().disabled).toBe(false); + }); + }); + + describe('Url query params', () => { + const params = { + username: 'deja.green', + ref: 'master', + }; + + beforeEach(() => { + createComponent(params); + }); + + it('sets default value if url query params', () => { + const expectedValueProp = [ + { + type: 'username', + value: { + data: params.username, + operator: '=', + }, + }, + { + type: 'ref', + value: { + data: params.ref, + operator: '=', + }, + }, + { type: 'filtered-search-term', value: { data: '' } }, + ]; + + expect(findFilteredSearch().props('value')).toEqual(expectedValueProp); + expect(findFilteredSearch().props('value')).toHaveLength(expectedValueProp.length); + }); + }); }); |