diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-01-22 09:08:39 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-01-22 09:08:39 +0000 |
commit | 001243986195143c395a9811d8254bbf1b9ebfa1 (patch) | |
tree | 6d6d665154fd38beea6ea7f8985330f956565bb3 /spec/frontend | |
parent | 83d8c1d61762898eb4e69878f117cbb2ef5be494 (diff) | |
download | gitlab-ce-001243986195143c395a9811d8254bbf1b9ebfa1.tar.gz |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'spec/frontend')
-rw-r--r-- | spec/frontend/monitoring/components/dashboard_spec.js | 83 | ||||
-rw-r--r-- | spec/frontend/monitoring/mock_data.js | 17 | ||||
-rw-r--r-- | spec/frontend/monitoring/store/getters_spec.js | 55 |
3 files changed, 139 insertions, 16 deletions
diff --git a/spec/frontend/monitoring/components/dashboard_spec.js b/spec/frontend/monitoring/components/dashboard_spec.js index 007429a3d02..195abae3783 100644 --- a/spec/frontend/monitoring/components/dashboard_spec.js +++ b/spec/frontend/monitoring/components/dashboard_spec.js @@ -28,6 +28,15 @@ describe('Dashboard', () => { let wrapper; let mock; + const findEnvironmentsDropdown = () => wrapper.find({ ref: 'monitorEnvironmentsDropdown' }); + const findAllEnvironmentsDropdownItems = () => findEnvironmentsDropdown().findAll(GlDropdownItem); + const setSearchTerm = searchTerm => { + wrapper.vm.$store.commit( + `monitoringDashboard/${types.SET_ENVIRONMENTS_SEARCH_TERM}`, + searchTerm, + ); + }; + const createShallowWrapper = (props = {}, options = {}) => { wrapper = shallowMount(Dashboard, { localVue, @@ -52,9 +61,6 @@ describe('Dashboard', () => { }); }; - const findEnvironmentsDropdown = () => wrapper.find({ ref: 'monitorEnvironmentsDropdown' }); - const findAllEnvironmentsDropdownItems = () => findEnvironmentsDropdown().findAll(GlDropdownItem); - beforeEach(() => { store = createStore(); mock = new MockAdapter(axios); @@ -155,12 +161,9 @@ describe('Dashboard', () => { wrapper.vm .$nextTick() .then(() => { - const environmentDropdownItems = findAllEnvironmentsDropdownItems(); + expect(findAllEnvironmentsDropdownItems().length).toEqual(environmentData.length); - expect(wrapper.vm.environments.length).toEqual(environmentData.length); - expect(environmentDropdownItems.length).toEqual(wrapper.vm.environments.length); - - environmentDropdownItems.wrappers.forEach((itemWrapper, index) => { + findAllEnvironmentsDropdownItems().wrappers.forEach((itemWrapper, index) => { const anchorEl = itemWrapper.find('a'); if (anchorEl.exists() && environmentData[index].metrics_path) { const href = anchorEl.attributes('href'); @@ -248,6 +251,70 @@ describe('Dashboard', () => { }); }); + describe('searchable environments dropdown', () => { + beforeEach(() => { + createMountedWrapper( + { hasMetrics: true }, + { + attachToDocument: true, + stubs: ['graph-group', 'panel-type'], + provide: { + glFeatures: { searchableEnvironmentsDropdown: true }, + }, + }, + ); + + setupComponentStore(wrapper); + + return wrapper.vm.$nextTick(); + }); + + afterEach(() => { + wrapper.destroy(); + }); + + it('renders a search input', () => { + expect(wrapper.find({ ref: 'monitorEnvironmentsDropdownSearch' }).exists()).toBe(true); + }); + + it('renders dropdown items', () => { + findAllEnvironmentsDropdownItems().wrappers.forEach((itemWrapper, index) => { + const anchorEl = itemWrapper.find('a'); + if (anchorEl.exists()) { + expect(anchorEl.text()).toBe(environmentData[index].name); + } + }); + }); + + it('filters rendered dropdown items', () => { + const searchTerm = 'production'; + const resultEnvs = environmentData.filter(({ name }) => name.indexOf(searchTerm) !== -1); + setSearchTerm(searchTerm); + + return wrapper.vm.$nextTick(() => { + expect(findAllEnvironmentsDropdownItems().length).toEqual(resultEnvs.length); + }); + }); + + it('does not filter dropdown items if search term is empty string', () => { + const searchTerm = ''; + setSearchTerm(searchTerm); + + return wrapper.vm.$nextTick(() => { + expect(findAllEnvironmentsDropdownItems().length).toEqual(environmentData.length); + }); + }); + + it("shows error message if search term doesn't match", () => { + const searchTerm = 'does-not-exist'; + setSearchTerm(searchTerm); + + return wrapper.vm.$nextTick(() => { + expect(wrapper.find({ ref: 'monitorEnvironmentsDropdownMsg' }).isVisible()).toBe(true); + }); + }); + }); + describe('drag and drop function', () => { const findDraggables = () => wrapper.findAll(VueDraggable); const findEnabledDraggables = () => findDraggables().filter(f => !f.attributes('disabled')); diff --git a/spec/frontend/monitoring/mock_data.js b/spec/frontend/monitoring/mock_data.js index 094554f525c..ada3e44f0a4 100644 --- a/spec/frontend/monitoring/mock_data.js +++ b/spec/frontend/monitoring/mock_data.js @@ -331,6 +331,14 @@ export const mockedQueryResultPayloadCoresTotal = { ], }; +const extraEnvironmentData = new Array(15).fill(null).map((_, idx) => ({ + id: 136 + idx, + name: `no-deployment/noop-branch-${idx}`, + state: 'available', + created_at: '2018-07-04T18:39:41.702Z', + updated_at: '2018-07-04T18:44:54.010Z', +})); + export const environmentData = [ { id: 34, @@ -368,14 +376,7 @@ export const environmentData = [ id: 128, }, }, - { - id: 36, - name: 'no-deployment/noop-branch', - state: 'available', - created_at: '2018-07-04T18:39:41.702Z', - updated_at: '2018-07-04T18:44:54.010Z', - }, -]; +].concat(extraEnvironmentData); export const metricsDashboardResponse = { dashboard: { diff --git a/spec/frontend/monitoring/store/getters_spec.js b/spec/frontend/monitoring/store/getters_spec.js index 097a5ca7f7c..263050b462f 100644 --- a/spec/frontend/monitoring/store/getters_spec.js +++ b/spec/frontend/monitoring/store/getters_spec.js @@ -3,6 +3,7 @@ import mutations from '~/monitoring/stores/mutations'; import * as types from '~/monitoring/stores/mutation_types'; import { metricStates } from '~/monitoring/constants'; import { + environmentData, metricsDashboardPayload, mockedEmptyResult, mockedQueryResultPayload, @@ -214,4 +215,58 @@ describe('Monitoring store Getters', () => { }); }); }); + + describe('filteredEnvironments', () => { + let state; + const setupState = (initState = {}) => { + state = { + ...state, + ...initState, + }; + }; + + beforeAll(() => { + setupState({ + environments: environmentData, + }); + }); + + afterAll(() => { + state = null; + }); + + [ + { + input: '', + output: 17, + }, + { + input: ' ', + output: 17, + }, + { + input: null, + output: 17, + }, + { + input: 'does-not-exist', + output: 0, + }, + { + input: 'noop-branch-', + output: 15, + }, + { + input: 'noop-branch-9', + output: 1, + }, + ].forEach(({ input, output }) => { + it(`filteredEnvironments returns ${output} items for ${input}`, () => { + setupState({ + environmentsSearchTerm: input, + }); + expect(getters.filteredEnvironments(state).length).toBe(output); + }); + }); + }); }); |