diff options
author | Phil Hughes <me@iamphill.com> | 2018-10-01 16:00:08 +0300 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2018-10-01 16:00:08 +0300 |
commit | aac9d70a8c40b819b9d19d66d8a86b439c72f130 (patch) | |
tree | 9338dd7b9ff7e00c7aa82be9af7786d94c914b3c /spec | |
parent | 4d7705ce928c7eed3ce92356711c6c3ace5e12a8 (diff) | |
parent | adbf6149cf1778cd48a9bbf8e97332669dbcb7cb (diff) |
Merge branch 'ide-keep-right-pane-tabs-alive' into 'master'
Keep IDE RightPane views alive
See merge request gitlab-org/gitlab-ce!21980
Diffstat (limited to 'spec')
8 files changed, 215 insertions, 20 deletions
diff --git a/spec/javascripts/ide/components/ide_status_bar_spec.js b/spec/javascripts/ide/components/ide_status_bar_spec.js index 0e93c5193a1..47d6492a7a6 100644 --- a/spec/javascripts/ide/components/ide_status_bar_spec.js +++ b/spec/javascripts/ide/components/ide_status_bar_spec.js @@ -1,6 +1,7 @@ import Vue from 'vue'; import store from '~/ide/stores'; import ideStatusBar from '~/ide/components/ide_status_bar.vue'; +import { rightSidebarViews } from '~/ide/constants'; import { createComponentWithStore } from 'spec/helpers/vue_mount_component_helper'; import { resetStore } from '../helpers'; import { projectData } from '../mock_data'; @@ -64,7 +65,7 @@ describe('ideStatusBar', () => { describe('pipeline status', () => { it('opens right sidebar on clicking icon', done => { - spyOn(vm, 'setRightPane'); + spyOn(vm, 'openRightPane'); Vue.set(vm.$store.state.pipelines, 'latestPipeline', { details: { status: { @@ -80,7 +81,7 @@ describe('ideStatusBar', () => { .then(() => { vm.$el.querySelector('.ide-status-pipeline button').click(); - expect(vm.setRightPane).toHaveBeenCalledWith('pipelines-list'); + expect(vm.openRightPane).toHaveBeenCalledWith(rightSidebarViews.pipelines); }) .then(done) .catch(done.fail); diff --git a/spec/javascripts/ide/components/panes/right_spec.js b/spec/javascripts/ide/components/panes/right_spec.js index c75975d2af6..4899f850cf4 100644 --- a/spec/javascripts/ide/components/panes/right_spec.js +++ b/spec/javascripts/ide/components/panes/right_spec.js @@ -25,7 +25,8 @@ describe('IDE right pane', () => { describe('active', () => { it('renders merge request button as active', done => { - vm.$store.state.rightPane = rightSidebarViews.mergeRequestInfo; + vm.$store.state.rightPane.isOpen = true; + vm.$store.state.rightPane.currentView = rightSidebarViews.mergeRequestInfo.name; vm.$store.state.currentMergeRequestId = '123'; vm.$store.state.currentProjectId = 'gitlab-ce'; vm.$store.state.currentMergeRequestId = 1; @@ -41,20 +42,21 @@ describe('IDE right pane', () => { }, }; - vm.$nextTick(() => { - expect(vm.$el.querySelector('.ide-sidebar-link.active')).not.toBe(null); - expect( - vm.$el.querySelector('.ide-sidebar-link.active').getAttribute('data-original-title'), - ).toBe('Merge Request'); - - done(); - }); + vm.$nextTick() + .then(() => { + expect(vm.$el.querySelector('.ide-sidebar-link.active')).not.toBe(null); + expect( + vm.$el.querySelector('.ide-sidebar-link.active').getAttribute('data-original-title'), + ).toBe('Merge Request'); + }) + .then(done) + .catch(done.fail); }); }); describe('click', () => { beforeEach(() => { - spyOn(vm, 'setRightPane'); + spyOn(vm, 'open'); }); it('sets view to merge request', done => { @@ -63,7 +65,7 @@ describe('IDE right pane', () => { vm.$nextTick(() => { vm.$el.querySelector('.ide-sidebar-link').click(); - expect(vm.setRightPane).toHaveBeenCalledWith(rightSidebarViews.mergeRequestInfo); + expect(vm.open).toHaveBeenCalledWith(rightSidebarViews.mergeRequestInfo); done(); }); diff --git a/spec/javascripts/ide/components/repo_editor_spec.js b/spec/javascripts/ide/components/repo_editor_spec.js index 0e2e246defd..991fb750876 100644 --- a/spec/javascripts/ide/components/repo_editor_spec.js +++ b/spec/javascripts/ide/components/repo_editor_spec.js @@ -319,8 +319,8 @@ describe('RepoEditor', () => { }); }); - it('calls updateDimensions when rightPane is updated', done => { - vm.$store.state.rightPane = 'testing'; + it('calls updateDimensions when rightPane is opened', done => { + vm.$store.state.rightPane.isOpen = true; vm.$nextTick(() => { expect(vm.editor.updateDimensions).toHaveBeenCalled(); diff --git a/spec/javascripts/ide/helpers.js b/spec/javascripts/ide/helpers.js index 3ce9c9fcda1..7e107747346 100644 --- a/spec/javascripts/ide/helpers.js +++ b/spec/javascripts/ide/helpers.js @@ -6,6 +6,7 @@ import mergeRequestsState from '~/ide/stores/modules/merge_requests/state'; import pipelinesState from '~/ide/stores/modules/pipelines/state'; import branchesState from '~/ide/stores/modules/branches/state'; import fileTemplatesState from '~/ide/stores/modules/file_templates/state'; +import paneState from '~/ide/stores/modules/pane/state'; export const resetStore = store => { const newState = { @@ -15,6 +16,7 @@ export const resetStore = store => { pipelines: pipelinesState(), branches: branchesState(), fileTemplates: fileTemplatesState(), + rightPane: paneState(), }; store.replaceState(newState); }; diff --git a/spec/javascripts/ide/stores/modules/pane/actions_spec.js b/spec/javascripts/ide/stores/modules/pane/actions_spec.js new file mode 100644 index 00000000000..f150ded6df5 --- /dev/null +++ b/spec/javascripts/ide/stores/modules/pane/actions_spec.js @@ -0,0 +1,87 @@ +import * as actions from '~/ide/stores/modules/pane/actions'; +import * as types from '~/ide/stores/modules/pane/mutation_types'; +import testAction from 'spec/helpers/vuex_action_helper'; + +describe('IDE pane module actions', () => { + const TEST_VIEW = { name: 'test' }; + const TEST_VIEW_KEEP_ALIVE = { name: 'test-keep-alive', keepAlive: true }; + + describe('toggleOpen', () => { + it('dispatches open if closed', done => { + testAction( + actions.toggleOpen, + TEST_VIEW, + { isOpen: false }, + [], + [{ type: 'open', payload: TEST_VIEW }], + done, + ); + }); + + it('dispatches close if opened', done => { + testAction( + actions.toggleOpen, + TEST_VIEW, + { isOpen: true }, + [], + [{ type: 'close' }], + done, + ); + }); + }); + + describe('open', () => { + it('commits SET_OPEN', done => { + testAction( + actions.open, + null, + {}, + [{ type: types.SET_OPEN, payload: true }], + [], + done, + ); + }); + + it('commits SET_CURRENT_VIEW if view is given', done => { + testAction( + actions.open, + TEST_VIEW, + {}, + [ + { type: types.SET_OPEN, payload: true }, + { type: types.SET_CURRENT_VIEW, payload: TEST_VIEW.name }, + ], + [], + done, + ); + }); + + it('commits KEEP_ALIVE_VIEW if keepAlive is true', done => { + testAction( + actions.open, + TEST_VIEW_KEEP_ALIVE, + {}, + [ + { type: types.SET_OPEN, payload: true }, + { type: types.SET_CURRENT_VIEW, payload: TEST_VIEW_KEEP_ALIVE.name }, + { type: types.KEEP_ALIVE_VIEW, payload: TEST_VIEW_KEEP_ALIVE.name }, + ], + [], + done, + ); + }); + }); + + describe('close', () => { + it('commits SET_OPEN', done => { + testAction( + actions.close, + null, + {}, + [{ type: types.SET_OPEN, payload: false }], + [], + done, + ); + }); + }); +}); diff --git a/spec/javascripts/ide/stores/modules/pane/getters_spec.js b/spec/javascripts/ide/stores/modules/pane/getters_spec.js new file mode 100644 index 00000000000..2060863b5d6 --- /dev/null +++ b/spec/javascripts/ide/stores/modules/pane/getters_spec.js @@ -0,0 +1,61 @@ +import * as getters from '~/ide/stores/modules/pane/getters'; +import state from '~/ide/stores/modules/pane/state'; + +describe('IDE pane module getters', () => { + const TEST_VIEW = 'test-view'; + const TEST_KEEP_ALIVE_VIEWS = { + [TEST_VIEW]: true, + }; + + describe('isActiveView', () => { + it('returns true if given view matches currentView', () => { + const result = getters.isActiveView({ currentView: 'A' })('A'); + + expect(result).toBe(true); + }); + + it('returns false if given view does not match currentView', () => { + const result = getters.isActiveView({ currentView: 'A' })('B'); + + expect(result).toBe(false); + }); + }); + + describe('isAliveView', () => { + it('returns true if given view is in keepAliveViews', () => { + const result = getters.isAliveView( + { keepAliveViews: TEST_KEEP_ALIVE_VIEWS }, + {}, + )(TEST_VIEW); + + expect(result).toBe(true); + }); + + it('returns true if given view is active view and open', () => { + const result = getters.isAliveView( + { ...state(), isOpen: true }, + { isActiveView: () => true }, + )(TEST_VIEW); + + expect(result).toBe(true); + }); + + it('returns false if given view is active view and closed', () => { + const result = getters.isAliveView( + state(), + { isActiveView: () => true }, + )(TEST_VIEW); + + expect(result).toBe(false); + }); + + it('returns false if given view is not activeView', () => { + const result = getters.isAliveView( + { ...state(), isOpen: true }, + { isActiveView: () => false }, + )(TEST_VIEW); + + expect(result).toBe(false); + }); + }); +}); diff --git a/spec/javascripts/ide/stores/modules/pane/mutations_spec.js b/spec/javascripts/ide/stores/modules/pane/mutations_spec.js new file mode 100644 index 00000000000..b5fcd35912e --- /dev/null +++ b/spec/javascripts/ide/stores/modules/pane/mutations_spec.js @@ -0,0 +1,42 @@ +import state from '~/ide/stores/modules/pane/state'; +import mutations from '~/ide/stores/modules/pane/mutations'; +import * as types from '~/ide/stores/modules/pane/mutation_types'; + +describe('IDE pane module mutations', () => { + const TEST_VIEW = 'test-view'; + let mockedState; + + beforeEach(() => { + mockedState = state(); + }); + + describe('SET_OPEN', () => { + it('sets isOpen', () => { + mockedState.isOpen = false; + + mutations[types.SET_OPEN](mockedState, true); + + expect(mockedState.isOpen).toBe(true); + }); + }); + + describe('SET_CURRENT_VIEW', () => { + it('sets currentView', () => { + mockedState.currentView = null; + + mutations[types.SET_CURRENT_VIEW](mockedState, TEST_VIEW); + + expect(mockedState.currentView).toEqual(TEST_VIEW); + }); + }); + + describe('KEEP_ALIVE_VIEW', () => { + it('adds entry to keepAliveViews', () => { + mutations[types.KEEP_ALIVE_VIEW](mockedState, TEST_VIEW); + + expect(mockedState.keepAliveViews).toEqual({ + [TEST_VIEW]: true, + }); + }); + }); +}); diff --git a/spec/javascripts/ide/stores/modules/pipelines/actions_spec.js b/spec/javascripts/ide/stores/modules/pipelines/actions_spec.js index 91edb388791..d85354c3681 100644 --- a/spec/javascripts/ide/stores/modules/pipelines/actions_spec.js +++ b/spec/javascripts/ide/stores/modules/pipelines/actions_spec.js @@ -315,29 +315,29 @@ describe('IDE pipelines actions', () => { 'job', mockedState, [{ type: types.SET_DETAIL_JOB, payload: 'job' }], - [{ type: 'setRightPane', payload: 'jobs-detail' }], + [{ type: 'rightPane/open', payload: rightSidebarViews.jobsDetail }], done, ); }); - it('dispatches setRightPane as pipeline when job is null', done => { + it('dispatches rightPane/open as pipeline when job is null', done => { testAction( setDetailJob, null, mockedState, [{ type: types.SET_DETAIL_JOB, payload: null }], - [{ type: 'setRightPane', payload: rightSidebarViews.pipelines }], + [{ type: 'rightPane/open', payload: rightSidebarViews.pipelines }], done, ); }); - it('dispatches setRightPane as job', done => { + it('dispatches rightPane/open as job', done => { testAction( setDetailJob, 'job', mockedState, [{ type: types.SET_DETAIL_JOB, payload: 'job' }], - [{ type: 'setRightPane', payload: rightSidebarViews.jobsDetail }], + [{ type: 'rightPane/open', payload: rightSidebarViews.jobsDetail }], done, ); }); |