2018-11-08 19:23:39 +05:30
|
|
|
import { Range } from 'monaco-editor';
|
|
|
|
import Editor from '~/ide/lib/editor';
|
2018-05-09 12:01:36 +05:30
|
|
|
import ModelManager from '~/ide/lib/common/model_manager';
|
|
|
|
import DecorationsController from '~/ide/lib/decorations/controller';
|
2018-10-15 14:42:47 +05:30
|
|
|
import DirtyDiffController, { getDiffChangeType, getDecorator } from '~/ide/lib/diff/controller';
|
2018-05-09 12:01:36 +05:30
|
|
|
import { computeDiff } from '~/ide/lib/diff/diff';
|
|
|
|
import { file } from '../../helpers';
|
|
|
|
|
|
|
|
describe('Multi-file editor library dirty diff controller', () => {
|
|
|
|
let editorInstance;
|
|
|
|
let controller;
|
|
|
|
let modelManager;
|
|
|
|
let decorationsController;
|
|
|
|
let model;
|
|
|
|
|
2018-11-08 19:23:39 +05:30
|
|
|
beforeEach(() => {
|
|
|
|
editorInstance = Editor.create();
|
|
|
|
editorInstance.createInstance(document.createElement('div'));
|
2018-05-09 12:01:36 +05:30
|
|
|
|
2018-11-08 19:23:39 +05:30
|
|
|
modelManager = new ModelManager();
|
|
|
|
decorationsController = new DecorationsController(editorInstance);
|
2018-05-09 12:01:36 +05:30
|
|
|
|
2018-11-08 19:23:39 +05:30
|
|
|
model = modelManager.addModel(file('path'));
|
2018-05-09 12:01:36 +05:30
|
|
|
|
2018-11-08 19:23:39 +05:30
|
|
|
controller = new DirtyDiffController(modelManager, decorationsController);
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
afterEach(() => {
|
|
|
|
controller.dispose();
|
|
|
|
model.dispose();
|
|
|
|
decorationsController.dispose();
|
|
|
|
editorInstance.dispose();
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('getDiffChangeType', () => {
|
|
|
|
['added', 'removed', 'modified'].forEach(type => {
|
|
|
|
it(`returns ${type}`, () => {
|
|
|
|
const change = {
|
|
|
|
[type]: true,
|
|
|
|
};
|
|
|
|
|
|
|
|
expect(getDiffChangeType(change)).toBe(type);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('getDecorator', () => {
|
|
|
|
['added', 'removed', 'modified'].forEach(type => {
|
|
|
|
it(`returns with linesDecorationsClassName for ${type}`, () => {
|
|
|
|
const change = {
|
|
|
|
[type]: true,
|
|
|
|
};
|
|
|
|
|
|
|
|
expect(getDecorator(change).options.linesDecorationsClassName).toBe(
|
|
|
|
`dirty-diff dirty-diff-${type}`,
|
|
|
|
);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('returns with line numbers', () => {
|
|
|
|
const change = {
|
|
|
|
lineNumber: 1,
|
|
|
|
endLineNumber: 2,
|
|
|
|
[type]: true,
|
|
|
|
};
|
|
|
|
|
2018-11-08 19:23:39 +05:30
|
|
|
const { range } = getDecorator(change);
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
expect(range.startLineNumber).toBe(1);
|
|
|
|
expect(range.endLineNumber).toBe(2);
|
|
|
|
expect(range.startColumn).toBe(1);
|
|
|
|
expect(range.endColumn).toBe(1);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('attachModel', () => {
|
|
|
|
it('adds change event callback', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(model, 'onChange').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
controller.attachModel(model);
|
|
|
|
|
|
|
|
expect(model.onChange).toHaveBeenCalled();
|
|
|
|
});
|
|
|
|
|
2018-10-15 14:42:47 +05:30
|
|
|
it('adds dispose event callback', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(model, 'onDispose').mockImplementation(() => {});
|
2018-10-15 14:42:47 +05:30
|
|
|
|
|
|
|
controller.attachModel(model);
|
|
|
|
|
|
|
|
expect(model.onDispose).toHaveBeenCalled();
|
|
|
|
});
|
|
|
|
|
2018-05-09 12:01:36 +05:30
|
|
|
it('calls throttledComputeDiff on change', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(controller, 'throttledComputeDiff').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
controller.attachModel(model);
|
|
|
|
|
|
|
|
model.getModel().setValue('123');
|
|
|
|
|
|
|
|
expect(controller.throttledComputeDiff).toHaveBeenCalled();
|
|
|
|
});
|
2018-10-15 14:42:47 +05:30
|
|
|
|
|
|
|
it('caches model', () => {
|
|
|
|
controller.attachModel(model);
|
|
|
|
|
|
|
|
expect(controller.models.has(model.url)).toBe(true);
|
|
|
|
});
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
describe('computeDiff', () => {
|
|
|
|
it('posts to worker', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(controller.dirtyDiffWorker, 'postMessage').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
controller.computeDiff(model);
|
|
|
|
|
|
|
|
expect(controller.dirtyDiffWorker.postMessage).toHaveBeenCalledWith({
|
|
|
|
path: model.path,
|
|
|
|
originalContent: '',
|
|
|
|
newContent: '',
|
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('reDecorate', () => {
|
2018-10-15 14:42:47 +05:30
|
|
|
it('calls computeDiff when no decorations are cached', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(controller, 'computeDiff').mockImplementation(() => {});
|
2018-10-15 14:42:47 +05:30
|
|
|
|
|
|
|
controller.reDecorate(model);
|
|
|
|
|
|
|
|
expect(controller.computeDiff).toHaveBeenCalledWith(model);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('calls decorate when decorations are cached', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(controller.decorationsController, 'decorate').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
2018-10-15 14:42:47 +05:30
|
|
|
controller.decorationsController.decorations.set(model.url, 'test');
|
|
|
|
|
2018-05-09 12:01:36 +05:30
|
|
|
controller.reDecorate(model);
|
|
|
|
|
2018-10-15 14:42:47 +05:30
|
|
|
expect(controller.decorationsController.decorate).toHaveBeenCalledWith(model);
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('decorate', () => {
|
|
|
|
it('adds decorations into decorations controller', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(controller.decorationsController, 'addDecorations').mockImplementation(() => {});
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
controller.decorate({ data: { changes: [], path: model.path } });
|
|
|
|
|
2018-10-15 14:42:47 +05:30
|
|
|
expect(controller.decorationsController.addDecorations).toHaveBeenCalledWith(
|
|
|
|
model,
|
|
|
|
'dirtyDiff',
|
2020-05-24 23:13:21 +05:30
|
|
|
expect.anything(),
|
2018-10-15 14:42:47 +05:30
|
|
|
);
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
|
|
|
|
it('adds decorations into editor', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
const spy = jest.spyOn(controller.decorationsController.editor.instance, 'deltaDecorations');
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
controller.decorate({
|
|
|
|
data: { changes: computeDiff('123', '1234'), path: model.path },
|
|
|
|
});
|
|
|
|
|
|
|
|
expect(spy).toHaveBeenCalledWith(
|
|
|
|
[],
|
|
|
|
[
|
|
|
|
{
|
2018-11-08 19:23:39 +05:30
|
|
|
range: new Range(1, 1, 1, 1),
|
2018-05-09 12:01:36 +05:30
|
|
|
options: {
|
|
|
|
isWholeLine: true,
|
|
|
|
linesDecorationsClassName: 'dirty-diff dirty-diff-modified',
|
|
|
|
},
|
|
|
|
},
|
|
|
|
],
|
|
|
|
);
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
describe('dispose', () => {
|
|
|
|
it('calls disposable dispose', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(controller.disposable, 'dispose');
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
controller.dispose();
|
|
|
|
|
|
|
|
expect(controller.disposable.dispose).toHaveBeenCalled();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('terminates worker', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(controller.dirtyDiffWorker, 'terminate');
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
controller.dispose();
|
|
|
|
|
|
|
|
expect(controller.dirtyDiffWorker.terminate).toHaveBeenCalled();
|
|
|
|
});
|
|
|
|
|
|
|
|
it('removes worker event listener', () => {
|
2020-05-24 23:13:21 +05:30
|
|
|
jest.spyOn(controller.dirtyDiffWorker, 'removeEventListener');
|
2018-05-09 12:01:36 +05:30
|
|
|
|
|
|
|
controller.dispose();
|
|
|
|
|
2018-10-15 14:42:47 +05:30
|
|
|
expect(controller.dirtyDiffWorker.removeEventListener).toHaveBeenCalledWith(
|
|
|
|
'message',
|
2020-05-24 23:13:21 +05:30
|
|
|
expect.anything(),
|
2018-10-15 14:42:47 +05:30
|
|
|
);
|
|
|
|
});
|
|
|
|
|
|
|
|
it('clears cached models', () => {
|
|
|
|
controller.attachModel(model);
|
|
|
|
|
|
|
|
model.dispose();
|
|
|
|
|
|
|
|
expect(controller.models.size).toBe(0);
|
2018-05-09 12:01:36 +05:30
|
|
|
});
|
|
|
|
});
|
|
|
|
});
|