Commit 368b29a5 authored by Paul Slaughter's avatar Paul Slaughter Committed by Phil Hughes

Give IDE editor lib a ctor dependency on store

- Previously it was dependent on a store
  singleton instance
parent c00c10ed
......@@ -167,7 +167,7 @@ export default {
},
mounted() {
if (!this.editor) {
this.editor = Editor.create(this.editorOptions);
this.editor = Editor.create(this.$store, this.editorOptions);
}
this.initEditor();
......
......@@ -3,7 +3,7 @@ import { mapActions } from 'vuex';
import Translate from '~/vue_shared/translate';
import { identity } from 'lodash';
import ide from './components/ide.vue';
import store from './stores';
import { createStore } from './stores';
import { createRouter } from './ide_router';
import { parseBoolean } from '../lib/utils/common_utils';
import { resetServiceWorkersPublicPath } from '../lib/utils/webpack';
......@@ -32,6 +32,7 @@ export function initIde(el, options = {}) {
if (!el) return null;
const { rootComponent = ide, extendStore = identity } = options;
const store = createStore();
const router = createRouter(store);
return new Vue({
......
import { debounce } from 'lodash';
import { editor as monacoEditor, KeyCode, KeyMod, Range } from 'monaco-editor';
import store from '../stores';
import DecorationsController from './decorations/controller';
import DirtyDiffController from './diff/controller';
import Disposable from './common/disposable';
......@@ -20,14 +19,14 @@ function setupThemes() {
}
export default class Editor {
static create(options = {}) {
static create(...args) {
if (!this.editorInstance) {
this.editorInstance = new Editor(options);
this.editorInstance = new Editor(...args);
}
return this.editorInstance;
}
constructor(options = {}) {
constructor(store, options = {}) {
this.currentModel = null;
this.instance = null;
this.dirtyDiffController = null;
......@@ -42,6 +41,7 @@ export default class Editor {
...defaultDiffEditorOptions,
...options,
};
this.store = store;
setupThemes();
registerLanguages(...languages);
......@@ -215,6 +215,7 @@ export default class Editor {
}
addCommands() {
const { store } = this;
const getKeyCode = key => {
const monacoKeyMod = key.indexOf('KEY_') === 0;
......
......@@ -33,5 +33,3 @@ export const createStoreOptions = () => ({
});
export const createStore = () => new Vuex.Store(createStoreOptions());
export default createStore();
import Vue from 'vue';
import store from '~/ide/stores';
import { createStore } from '~/ide/stores';
import { leftSidebarViews } from '~/ide/constants';
import ActivityBar from '~/ide/components/activity_bar.vue';
import { createComponentWithStore } from '../../helpers/vue_mount_component_helper';
import { resetStore } from '../helpers';
describe('IDE activity bar', () => {
const Component = Vue.extend(ActivityBar);
let vm;
let store;
beforeEach(() => {
store = createStore();
Vue.set(store.state.projects, 'abcproject', {
web_url: 'testing',
});
......@@ -20,8 +22,6 @@ describe('IDE activity bar', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
describe('updateActivityBarView', () => {
......
import Vue from 'vue';
import store from '~/ide/stores';
import { createStore } from '~/ide/stores';
import emptyState from '~/ide/components/commit_sidebar/empty_state.vue';
import { createComponentWithStore } from '../../../helpers/vue_mount_component_helper';
import { resetStore } from '../../helpers';
describe('IDE commit panel empty state', () => {
let vm;
let store;
beforeEach(() => {
store = createStore();
const Component = Vue.extend(emptyState);
Vue.set(store.state, 'noChangesStateSvgPath', 'no-changes');
......@@ -19,8 +21,6 @@ describe('IDE commit panel empty state', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
it('renders no changes text when last commit message is empty', () => {
......
import Vue from 'vue';
import { createComponentWithStore } from 'helpers/vue_mount_component_helper';
import { projectData } from 'jest/ide/mock_data';
import store from '~/ide/stores';
import { createStore } from '~/ide/stores';
import CommitForm from '~/ide/components/commit_sidebar/form.vue';
import { leftSidebarViews } from '~/ide/constants';
import { resetStore } from '../../helpers';
import waitForPromises from 'helpers/wait_for_promises';
describe('IDE commit form', () => {
const Component = Vue.extend(CommitForm);
let vm;
let store;
const beginCommitButton = () => vm.$el.querySelector('[data-testid="begin-commit-button"]');
beforeEach(() => {
store = createStore();
store.state.changedFiles.push('test');
store.state.currentProjectId = 'abcproject';
store.state.currentBranchId = 'master';
......@@ -24,8 +25,6 @@ describe('IDE commit form', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
it('enables begin commit button when there are changes', () => {
......
import Vue from 'vue';
import { createComponentWithStore } from 'helpers/vue_mount_component_helper';
import store from '~/ide/stores';
import { createStore } from '~/ide/stores';
import listCollapsed from '~/ide/components/commit_sidebar/list_collapsed.vue';
import { file } from '../../helpers';
import { removeWhitespace } from '../../../helpers/text_helper';
describe('Multi-file editor commit sidebar list collapsed', () => {
let vm;
let store;
beforeEach(() => {
store = createStore();
const Component = Vue.extend(listCollapsed);
vm = createComponentWithStore(Component, store, {
......
import Vue from 'vue';
import { createComponentWithStore } from 'helpers/vue_mount_component_helper';
import store from '~/ide/stores';
import { createStore } from '~/ide/stores';
import commitSidebarList from '~/ide/components/commit_sidebar/list.vue';
import { file, resetStore } from '../../helpers';
import { file } from '../../helpers';
describe('Multi-file editor commit sidebar list', () => {
let store;
let vm;
beforeEach(() => {
store = createStore();
const Component = Vue.extend(commitSidebarList);
vm = createComponentWithStore(Component, store, {
......@@ -26,8 +29,6 @@ describe('Multi-file editor commit sidebar list', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
describe('with a list of files', () => {
......
import Vue from 'vue';
import { createComponentWithStore } from 'helpers/vue_mount_component_helper';
import { resetStore } from 'jest/ide/helpers';
import store from '~/ide/stores';
import { createStore } from '~/ide/stores';
import radioGroup from '~/ide/components/commit_sidebar/radio_group.vue';
describe('IDE commit sidebar radio group', () => {
let vm;
let store;
beforeEach(done => {
store = createStore();
const Component = Vue.extend(radioGroup);
store.state.commit.commitAction = '2';
......@@ -25,8 +27,6 @@ describe('IDE commit sidebar radio group', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
it('uses label if present', () => {
......
import Vue from 'vue';
import store from '~/ide/stores';
import { createStore } from '~/ide/stores';
import successMessage from '~/ide/components/commit_sidebar/success_message.vue';
import { createComponentWithStore } from '../../../helpers/vue_mount_component_helper';
import { resetStore } from '../../helpers';
describe('IDE commit panel successful commit state', () => {
let vm;
let store;
beforeEach(() => {
store = createStore();
const Component = Vue.extend(successMessage);
vm = createComponentWithStore(Component, store, {
......@@ -19,8 +21,6 @@ describe('IDE commit panel successful commit state', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
it('renders last commit message when it exists', done => {
......
......@@ -2,7 +2,7 @@ import Vue from 'vue';
import { createComponentWithStore } from 'helpers/vue_mount_component_helper';
import { createStore } from '~/ide/stores';
import FileRowExtra from '~/ide/components/file_row_extra.vue';
import { file, resetStore } from '../helpers';
import { file } from '../helpers';
describe('IDE extra file row component', () => {
let Component;
......@@ -32,7 +32,6 @@ describe('IDE extra file row component', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
stagedFilesCount = 0;
unstagedFilesCount = 0;
......
......@@ -2,7 +2,7 @@ import Vue from 'vue';
import { mountComponentWithStore } from 'helpers/vue_mount_component_helper';
import { createStore } from '~/ide/stores';
import Bar from '~/ide/components/file_templates/bar.vue';
import { resetStore, file } from '../../helpers';
import { file } from '../../helpers';
describe('IDE file templates bar component', () => {
let Component;
......@@ -26,7 +26,6 @@ describe('IDE file templates bar component', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
describe('template type dropdown', () => {
......
......@@ -3,7 +3,7 @@ import IdeReview from '~/ide/components/ide_review.vue';
import { createStore } from '~/ide/stores';
import { createComponentWithStore } from '../../helpers/vue_mount_component_helper';
import { trimText } from '../../helpers/text_helper';
import { resetStore, file } from '../helpers';
import { file } from '../helpers';
import { projectData } from '../mock_data';
describe('IDE review mode', () => {
......@@ -26,8 +26,6 @@ describe('IDE review mode', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
it('renders list of files', () => {
......
import Vue from 'vue';
import { createComponentWithStore } from 'helpers/vue_mount_component_helper';
import store from '~/ide/stores';
import { createStore } from '~/ide/stores';
import ideSidebar from '~/ide/components/ide_side_bar.vue';
import { leftSidebarViews } from '~/ide/constants';
import { resetStore } from '../helpers';
import { projectData } from '../mock_data';
describe('IdeSidebar', () => {
let vm;
let store;
beforeEach(() => {
store = createStore();
const Component = Vue.extend(ideSidebar);
store.state.currentProjectId = 'abcproject';
......@@ -20,8 +22,6 @@ describe('IdeSidebar', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
it('renders a sidebar', () => {
......
......@@ -2,7 +2,7 @@ import Vue from 'vue';
import { createComponentWithStore } from 'helpers/vue_mount_component_helper';
import { createStore } from '~/ide/stores';
import ide from '~/ide/components/ide.vue';
import { file, resetStore } from '../helpers';
import { file } from '../helpers';
import { projectData } from '../mock_data';
import extendStore from '~/ide/stores/extend';
......@@ -41,8 +41,6 @@ describe('ide component, empty repo', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
it('renders "New file" button in empty repo', done => {
......@@ -63,8 +61,6 @@ describe('ide component, non-empty repo', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
it('shows error message when set', done => {
......
import Vue from 'vue';
import IdeTreeList from '~/ide/components/ide_tree_list.vue';
import store from '~/ide/stores';
import { createStore } from '~/ide/stores';
import { createComponentWithStore } from '../../helpers/vue_mount_component_helper';
import { resetStore, file } from '../helpers';
import { file } from '../helpers';
import { projectData } from '../mock_data';
describe('IDE tree list', () => {
......@@ -10,6 +10,7 @@ describe('IDE tree list', () => {
const normalBranchTree = [file('fileName')];
const emptyBranchTree = [];
let vm;
let store;
const bootstrapWithTree = (tree = normalBranchTree) => {
store.state.currentProjectId = 'abcproject';
......@@ -25,10 +26,12 @@ describe('IDE tree list', () => {
});
};
beforeEach(() => {
store = createStore();
});
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
describe('normal branch', () => {
......
import Vue from 'vue';
import IdeTree from '~/ide/components/ide_tree.vue';
import store from '~/ide/stores';
import { createStore } from '~/ide/stores';
import { createComponentWithStore } from '../../helpers/vue_mount_component_helper';
import { resetStore, file } from '../helpers';
import { file } from '../helpers';
import { projectData } from '../mock_data';
describe('IdeRepoTree', () => {
let store;
let vm;
beforeEach(() => {
store = createStore();
const IdeRepoTree = Vue.extend(IdeTree);
store.state.currentProjectId = 'abcproject';
......@@ -24,8 +27,6 @@ describe('IdeRepoTree', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
it('renders list of files', () => {
......
import Vue from 'vue';
import { createComponentWithStore } from 'helpers/vue_mount_component_helper';
import store from '~/ide/stores';
import { createStore } from '~/ide/stores';
import newDropdown from '~/ide/components/new_dropdown/index.vue';
import { resetStore } from '../../helpers';
describe('new dropdown component', () => {
let store;
let vm;
beforeEach(() => {
store = createStore();
const component = Vue.extend(newDropdown);
vm = createComponentWithStore(component, store, {
......@@ -30,8 +32,6 @@ describe('new dropdown component', () => {
afterEach(() => {
vm.$destroy();
resetStore(vm.$store);
});
it('renders new file, upload and new directory links', () => {
......
import * as pathUtils from 'path';
import { decorateData } from '~/ide/stores/utils';
import state from '~/ide/stores/state';
import commitState from '~/ide/stores/modules/commit/state';
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 = {
...state(),
commit: commitState(),
mergeRequests: mergeRequestsState(),
pipelines: pipelinesState(),
branches: branchesState(),
fileTemplates: fileTemplatesState(),
rightPane: paneState(),
};
store.replaceState(newState);
};
export const file = (name = 'name', id = name, type = '', parent = null) =>
decorateData({
......
......@@ -2,14 +2,17 @@ import Editor from '~/ide/lib/editor';
import DecorationsController from '~/ide/lib/decorations/controller';
import Model from '~/ide/lib/common/model';
import { file } from '../../helpers';
import { createStore } from '~/ide/stores';
describe('Multi-file editor library decorations controller', () => {
let editorInstance;
let controller;
let model;
let store;
beforeEach(() => {
editorInstance = Editor.create();
store = createStore();
editorInstance = Editor.create(store);
editorInstance.createInstance(document.createElement('div'));
controller = new DecorationsController(editorInstance);
......
......@@ -4,6 +4,7 @@ import ModelManager from '~/ide/lib/common/model_manager';
import DecorationsController from '~/ide/lib/decorations/controller';
import DirtyDiffController, { getDiffChangeType, getDecorator } from '~/ide/lib/diff/controller';
import { computeDiff } from '~/ide/lib/diff/diff';
import { createStore } from '~/ide/stores';
import { file } from '../../helpers';
describe('Multi-file editor library dirty diff controller', () => {
......@@ -12,9 +13,12 @@ describe('Multi-file editor library dirty diff controller', () => {
let modelManager;
let decorationsController;
let model;
let store;
beforeEach(() => {
editorInstance = Editor.create();
store = createStore();
editorInstance = Editor.create(store);
editorInstance.createInstance(document.createElement('div'));
modelManager = new ModelManager();
......
......@@ -5,6 +5,7 @@ import {
Selection,
} from 'monaco-editor';
import Editor from '~/ide/lib/editor';
import { createStore } from '~/ide/stores';
import { defaultEditorOptions } from '~/ide/lib/editor_options';
import { file } from '../helpers';
......@@ -12,6 +13,7 @@ describe('Multi-file editor library', () => {
let instance;
let el;
let holder;
let store;
const setNodeOffsetWidth = val => {
Object.defineProperty(instance.instance.getDomNode(), 'offsetWidth', {
......@@ -22,13 +24,14 @@ describe('Multi-file editor library', () => {
};
beforeEach(() => {
store = createStore();
el = document.createElement('div');
holder = document.createElement('div');
el.appendChild(holder);
document.body.appendChild(el);
instance = Editor.create();
instance = Editor.create(store);
});
afterEach(() => {
......@@ -44,7 +47,7 @@ describe('Multi-file editor library', () => {
});
it('creates instance returns cached instance', () => {
expect(Editor.create()).toEqual(instance);
expect(Editor.create(store)).toEqual(instance);
});
describe('createInstance', () => {
......
import MockAdapter from 'axios-mock-adapter';
import axios from '~/lib/utils/axios_utils';
import store from '~/ide/stores';
import { createStore } from '~/ide/stores';
import createFlash from '~/flash';
import {
getMergeRequestData,
......@@ -10,7 +10,6 @@ import {
} from '~/ide/stores/actions/merge_request';
import service from '~/ide/services';
import { leftSidebarViews, PERMISSION_READ_MR } from '~/ide/constants';
import { resetStore } from '../../helpers';
const TEST_PROJECT = 'abcproject';
const TEST_PROJECT_ID = 17;
......@@ -18,9 +17,12 @@ const TEST_PROJECT_ID = 17;
jest.mock('~/flash');
describe('IDE store merge request actions', () => {
let store;
let mock;
beforeEach(() => {
store = createStore();
mock = new MockAdapter(axios);
store.state.projects[TEST_PROJECT] = {
......@@ -34,7 +36,6 @@ describe('IDE store merge request actions', () => {
afterEach(() => {
mock.restore();
resetStore(store);
});
describe('getMergeRequestsForBranch', () => {
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment