2020-06-23 00:09:42 +05:30
|
|
|
import {
|
|
|
|
editor as monacoEditor,
|
|
|
|
languages as monacoLanguages,
|
|
|
|
Range,
|
|
|
|
Selection,
|
|
|
|
} from 'monaco-editor';
|
2018-11-08 19:23:39 +05:30
|
|
|
import Editor from '~/ide/lib/editor';
|
2020-10-24 23:57:45 +05:30
|
|
|
import { createStore } from '~/ide/stores';
|
2020-05-24 23:13:21 +05:30
|
|
|
import { defaultEditorOptions } from '~/ide/lib/editor_options';
|
2018-05-09 12:01:36 +05:30
|
|
|
import { file } from '../helpers';
|
|
|
|
|
|
|
|
describe('Multi-file editor library', () => {
|
|
|
|
let instance;
|
|
|
|
let el;
|
|
|
|
let holder;
|
2020-10-24 23:57:45 +05:30
|
|
|
let store;
|
2018-05-09 12:01:36 +05:30
|
|
|
|
2021-03-08 18:12:59 +05:30
|
|
|
const setNodeOffsetWidth = (val) => {
|
2020-05-24 23:13:21 +05:30
|
|
|
Object.defineProperty(instance.instance.getDomNode(), 'offsetWidth', {
|
|
|
|
get() {
|
|
|
|
return val;
|
|
|
|
},
|
|
|
|
});
|
|
|
|
};
|
|
|
|
|
2018-11-08 19:23:39 +05:30
|
|
|
beforeEach(() => {
|
2020-10-24 23:57:45 +05:30
|
|
|
store = createStore();
|
2018-05-09 12:01:36 +05:30
|
|
|
el = document.createElement('div');
|
|
|
|
holder = document.createElement('div');
|
|
|
|
el.appendChild(holder);
|
|
|
|
|
|
|
|
document.body.appendChild(el);
|
|
|
|
|
2020-10-24 23:57:45 +05:30
|
|
|
instance = Editor.create(store);
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
afterEach(() => {
|
2020-05-24 23:13:21 +05:30
|
|
|
instance.modelManager.dispose();
|
2018-05-09 12:01:36 +05:30
|
|
|
instance.dispose();
|
2020-05-24 23:13:21 +05:30
|
|
|
Editor.editorInstance = null;
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
el.remove();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('creates instance of editor', () => {
|
2018-11-08 19:23:39 +05:30
|
|
|
expect(Editor.editorInstance).not.toBeNull();
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
it('creates instance returns cached instance', () => {
|
2020-10-24 23:57:45 +05:30
|
|
|
expect(Editor.create(store)).toEqual(instance);
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
describe('createInstance', () => {
|
|
|
|
it('creates editor instance', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(monacoEditor, 'create');
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
instance.createInstance(holder);
|
|
|
|
|
2018-11-08 19:23:39 +05:30
|
|
|
expect(monacoEditor.create).toHaveBeenCalled();
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
it('creates dirty diff controller', () => {
|
|
|
|
instance.createInstance(holder);
|
|
|
|
|
|
|
|
expect(instance.dirtyDiffController).not.toBeNull();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('creates model manager', () => {
|
|
|
|
instance.createInstance(holder);
|
|
|
|
|
|
|
|
expect(instance.modelManager).not.toBeNull();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('createDiffInstance', () => {
|
|
|
|
it('creates editor instance', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(monacoEditor, 'createDiffEditor');
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
instance.createDiffInstance(holder);
|
|
|
|
|
2018-11-08 19:23:39 +05:30
|
|
|
expect(monacoEditor.createDiffEditor).toHaveBeenCalledWith(holder, {
|
2020-05-24 23:13:21 +05:30
|
|
|
...defaultEditorOptions,
|
2020-06-23 00:09:42 +05:30
|
|
|
ignoreTrimWhitespace: false,
|
2018-05-09 12:01:36 +05:30
|
|
|
quickSuggestions: false,
|
|
|
|
occurrencesHighlight: false,
|
2020-05-24 23:13:21 +05:30
|
|
|
renderSideBySide: false,
|
2020-06-23 00:09:42 +05:30
|
|
|
readOnly: false,
|
|
|
|
renderLineHighlight: 'none',
|
|
|
|
hideCursorInOverviewRuler: true,
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('createModel', () => {
|
|
|
|
it('calls model manager addModel', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(instance.modelManager, 'addModel').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
instance.createModel('FILE');
|
|
|
|
|
2018-10-15 14:42:47 +05:30
|
|
|
expect(instance.modelManager.addModel).toHaveBeenCalledWith('FILE', null);
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('attachModel', () => {
|
|
|
|
let model;
|
|
|
|
|
|
|
|
beforeEach(() => {
|
|
|
|
instance.createInstance(document.createElement('div'));
|
|
|
|
|
|
|
|
model = instance.createModel(file());
|
|
|
|
});
|
|
|
|
|
|
|
|
it('sets the current model on the instance', () => {
|
|
|
|
instance.attachModel(model);
|
|
|
|
|
|
|
|
expect(instance.currentModel).toBe(model);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('attaches the model to the current instance', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(instance.instance, 'setModel').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
instance.attachModel(model);
|
|
|
|
|
|
|
|
expect(instance.instance.setModel).toHaveBeenCalledWith(model.getModel());
|
|
|
|
});
|
|
|
|
|
|
|
|
it('sets original & modified when diff editor', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(instance.instance, 'getEditorType').mockReturnValue('vs.editor.IDiffEditor');
|
|
|
|
jest.spyOn(instance.instance, 'setModel').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
instance.attachModel(model);
|
|
|
|
|
|
|
|
expect(instance.instance.setModel).toHaveBeenCalledWith({
|
|
|
|
original: model.getOriginalModel(),
|
|
|
|
modified: model.getModel(),
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
it('attaches the model to the dirty diff controller', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(instance.dirtyDiffController, 'attachModel').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
instance.attachModel(model);
|
|
|
|
|
|
|
|
expect(instance.dirtyDiffController.attachModel).toHaveBeenCalledWith(model);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('re-decorates with the dirty diff controller', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(instance.dirtyDiffController, 'reDecorate').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
instance.attachModel(model);
|
|
|
|
|
|
|
|
expect(instance.dirtyDiffController.reDecorate).toHaveBeenCalledWith(model);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('attachMergeRequestModel', () => {
|
|
|
|
let model;
|
|
|
|
|
|
|
|
beforeEach(() => {
|
|
|
|
instance.createDiffInstance(document.createElement('div'));
|
|
|
|
|
|
|
|
const f = file();
|
|
|
|
f.mrChanges = { diff: 'ABC' };
|
|
|
|
f.baseRaw = 'testing';
|
|
|
|
|
|
|
|
model = instance.createModel(f);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('sets original & modified', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(instance.instance, 'setModel').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
instance.attachMergeRequestModel(model);
|
|
|
|
|
|
|
|
expect(instance.instance.setModel).toHaveBeenCalledWith({
|
|
|
|
original: model.getBaseModel(),
|
|
|
|
modified: model.getModel(),
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('clearEditor', () => {
|
|
|
|
it('resets the editor model', () => {
|
|
|
|
instance.createInstance(document.createElement('div'));
|
|
|
|
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(instance.instance, 'setModel').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
instance.clearEditor();
|
|
|
|
|
|
|
|
expect(instance.instance.setModel).toHaveBeenCalledWith(null);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2020-05-24 23:13:21 +05:30
|
|
|
describe('languages', () => {
|
|
|
|
it('registers custom languages defined with Monaco', () => {
|
|
|
|
expect(monacoLanguages.getLanguages()).toEqual(
|
|
|
|
expect.arrayContaining([
|
|
|
|
expect.objectContaining({
|
|
|
|
id: 'vue',
|
|
|
|
}),
|
|
|
|
]),
|
|
|
|
);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2020-06-23 00:09:42 +05:30
|
|
|
describe('replaceSelectedText', () => {
|
|
|
|
let model;
|
|
|
|
let editor;
|
|
|
|
|
|
|
|
beforeEach(() => {
|
|
|
|
instance.createInstance(holder);
|
|
|
|
|
|
|
|
model = instance.createModel({
|
|
|
|
...file(),
|
|
|
|
key: 'index.md',
|
|
|
|
path: 'index.md',
|
|
|
|
});
|
|
|
|
|
|
|
|
instance.attachModel(model);
|
|
|
|
|
|
|
|
editor = instance.instance;
|
|
|
|
editor.getModel().setValue('foo bar baz');
|
|
|
|
editor.setSelection(new Range(1, 5, 1, 8));
|
|
|
|
|
|
|
|
instance.replaceSelectedText('hello');
|
|
|
|
});
|
|
|
|
|
|
|
|
it('replaces the text selected in editor with the one provided', () => {
|
|
|
|
expect(editor.getModel().getValue()).toBe('foo hello baz');
|
|
|
|
});
|
|
|
|
|
|
|
|
it('sets cursor to end of the replaced string', () => {
|
|
|
|
const selection = editor.getSelection();
|
|
|
|
expect(selection).toEqual(new Selection(1, 10, 1, 10));
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
2018-05-09 12:01:36 +05:30
|
|
|
describe('dispose', () => {
|
|
|
|
it('calls disposble dispose method', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(instance.disposable, 'dispose');
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
instance.dispose();
|
|
|
|
|
|
|
|
expect(instance.disposable.dispose).toHaveBeenCalled();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('resets instance', () => {
|
|
|
|
instance.createInstance(document.createElement('div'));
|
|
|
|
|
|
|
|
expect(instance.instance).not.toBeNull();
|
|
|
|
|
|
|
|
instance.dispose();
|
|
|
|
|
|
|
|
expect(instance.instance).toBeNull();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('does not dispose modelManager', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(instance.modelManager, 'dispose').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
instance.dispose();
|
|
|
|
|
|
|
|
expect(instance.modelManager.dispose).not.toHaveBeenCalled();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('does not dispose decorationsController', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(instance.decorationsController, 'dispose').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
instance.dispose();
|
|
|
|
|
|
|
|
expect(instance.decorationsController.dispose).not.toHaveBeenCalled();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('updateDiffView', () => {
|
|
|
|
describe('edit mode', () => {
|
|
|
|
it('does not update options', () => {
|
|
|
|
instance.createInstance(holder);
|
|
|
|
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(instance.instance, 'updateOptions').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
instance.updateDiffView();
|
|
|
|
|
|
|
|
expect(instance.instance.updateOptions).not.toHaveBeenCalled();
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('diff mode', () => {
|
|
|
|
beforeEach(() => {
|
|
|
|
instance.createDiffInstance(holder);
|
|
|
|
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(instance.instance, 'updateOptions');
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
it('sets renderSideBySide to false if el is less than 700 pixels', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
setNodeOffsetWidth(600);
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
expect(instance.instance.updateOptions).not.toHaveBeenCalledWith({
|
|
|
|
renderSideBySide: false,
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
it('sets renderSideBySide to false if el is more than 700 pixels', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
setNodeOffsetWidth(800);
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
expect(instance.instance.updateOptions).not.toHaveBeenCalledWith({
|
|
|
|
renderSideBySide: true,
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('isDiffEditorType', () => {
|
|
|
|
it('returns true when diff editor', () => {
|
|
|
|
instance.createDiffInstance(holder);
|
|
|
|
|
|
|
|
expect(instance.isDiffEditorType).toBe(true);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('returns false when not diff editor', () => {
|
|
|
|
instance.createInstance(holder);
|
|
|
|
|
|
|
|
expect(instance.isDiffEditorType).toBe(false);
|
|
|
|
});
|
|
|
|
});
|
2018-11-08 19:23:39 +05:30
|
|
|
|
|
|
|
it('sets quickSuggestions to false when language is markdown', () => {
|
|
|
|
instance.createInstance(holder);
|
|
|
|
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(instance.instance, 'updateOptions');
|
2018-11-08 19:23:39 +05:30
|
|
|
|
|
|
|
const model = instance.createModel({
|
|
|
|
...file(),
|
|
|
|
key: 'index.md',
|
|
|
|
path: 'index.md',
|
|
|
|
});
|
|
|
|
|
|
|
|
instance.attachModel(model);
|
|
|
|
|
|
|
|
expect(instance.instance.updateOptions).toHaveBeenCalledWith({
|
|
|
|
readOnly: false,
|
|
|
|
quickSuggestions: false,
|
|
|
|
});
|
|
|
|
});
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|