debian-mirror-gitlab/spec/frontend/diffs/components/diff_expansion_cell_spec.js

227 lines
6.9 KiB
JavaScript
Raw Normal View History

2020-10-24 23:57:45 +05:30
import { getByText } from '@testing-library/dom';
2021-03-11 19:13:27 +05:30
import { mount } from '@vue/test-utils';
import { cloneDeep } from 'lodash';
2019-10-12 21:52:04 +05:30
import DiffExpansionCell from '~/diffs/components/diff_expansion_cell.vue';
2021-02-22 17:27:13 +05:30
import { INLINE_DIFF_VIEW_TYPE } from '~/diffs/constants';
2021-03-11 19:13:27 +05:30
import { getPreviousLineIndex } from '~/diffs/store/utils';
import { createStore } from '~/mr_notes/stores';
2019-10-12 21:52:04 +05:30
import diffFileMockData from '../mock_data/diff_file';
const EXPAND_UP_CLASS = '.js-unfold';
const EXPAND_DOWN_CLASS = '.js-unfold-down';
2020-04-08 14:13:33 +05:30
const lineSources = {
[INLINE_DIFF_VIEW_TYPE]: 'highlighted_diff_lines',
};
const lineHandlers = {
2021-03-08 18:12:59 +05:30
[INLINE_DIFF_VIEW_TYPE]: (line) => line,
2020-04-08 14:13:33 +05:30
};
function makeLoadMoreLinesPayload({
sinceLine,
toLine,
oldLineNumber,
diffViewType,
fileHash,
nextLineNumbers = {},
unfold = false,
bottom = false,
isExpandDown = false,
}) {
return {
endpoint: 'contextLinesPath',
params: {
since: sinceLine,
to: toLine,
offset: toLine + 1 - oldLineNumber,
view: diffViewType,
unfold,
bottom,
},
lineNumbers: {
oldLineNumber,
newLineNumber: toLine + 1,
},
nextLineNumbers,
fileHash,
isExpandDown,
};
}
function getLine(file, type, index) {
const source = lineSources[type];
const handler = lineHandlers[type];
return handler(file[source][index]);
}
2019-10-12 21:52:04 +05:30
describe('DiffExpansionCell', () => {
2020-04-08 14:13:33 +05:30
let mockFile;
let mockLine;
let store;
beforeEach(() => {
mockFile = cloneDeep(diffFileMockData);
2020-11-24 15:15:51 +05:30
mockLine = getLine(mockFile, INLINE_DIFF_VIEW_TYPE, 8);
2020-04-08 14:13:33 +05:30
store = createStore();
store.state.diffs.diffFiles = [mockFile];
2020-04-22 19:07:51 +05:30
jest.spyOn(store, 'dispatch').mockReturnValue(Promise.resolve());
2020-04-08 14:13:33 +05:30
});
2019-10-12 21:52:04 +05:30
const createComponent = (options = {}) => {
const defaults = {
2020-04-08 14:13:33 +05:30
fileHash: mockFile.file_hash,
2019-10-12 21:52:04 +05:30
contextLinesPath: 'contextLinesPath',
2020-04-08 14:13:33 +05:30
line: mockLine,
2019-10-12 21:52:04 +05:30
isTop: false,
isBottom: false,
};
2021-03-08 18:12:59 +05:30
const propsData = { ...defaults, ...options };
2019-10-12 21:52:04 +05:30
2021-03-08 18:12:59 +05:30
return mount(DiffExpansionCell, { store, propsData });
2019-10-12 21:52:04 +05:30
};
2021-03-08 18:12:59 +05:30
const findExpandUp = (wrapper) => wrapper.find(EXPAND_UP_CLASS);
const findExpandDown = (wrapper) => wrapper.find(EXPAND_DOWN_CLASS);
const findExpandAll = ({ element }) => getByText(element, 'Show all unchanged lines');
2020-04-08 14:13:33 +05:30
2019-10-12 21:52:04 +05:30
describe('top row', () => {
it('should have "expand up" and "show all" option', () => {
2021-03-08 18:12:59 +05:30
const wrapper = createComponent({
2019-10-12 21:52:04 +05:30
isTop: true,
});
2021-03-08 18:12:59 +05:30
expect(findExpandUp(wrapper).exists()).toBe(true);
2022-04-04 11:22:00 +05:30
expect(findExpandDown(wrapper).exists()).toBe(true);
expect(findExpandUp(wrapper).attributes('disabled')).not.toBeDefined();
expect(findExpandDown(wrapper).attributes('disabled')).toBeDefined();
2021-03-08 18:12:59 +05:30
expect(findExpandAll(wrapper)).not.toBe(null);
2019-10-12 21:52:04 +05:30
});
});
describe('middle row', () => {
it('should have "expand down", "show all", "expand up" option', () => {
2021-03-08 18:12:59 +05:30
const wrapper = createComponent();
2019-10-12 21:52:04 +05:30
2021-03-08 18:12:59 +05:30
expect(findExpandUp(wrapper).exists()).toBe(true);
expect(findExpandDown(wrapper).exists()).toBe(true);
expect(findExpandAll(wrapper)).not.toBe(null);
2019-10-12 21:52:04 +05:30
});
});
describe('bottom row', () => {
it('should have "expand down" and "show all" option', () => {
2021-03-08 18:12:59 +05:30
const wrapper = createComponent({
2019-10-12 21:52:04 +05:30
isBottom: true,
});
2021-03-08 18:12:59 +05:30
expect(findExpandDown(wrapper).exists()).toBe(true);
2022-04-04 11:22:00 +05:30
expect(findExpandUp(wrapper).exists()).toBe(true);
expect(findExpandDown(wrapper).attributes('disabled')).not.toBeDefined();
expect(findExpandUp(wrapper).attributes('disabled')).toBeDefined();
2021-03-08 18:12:59 +05:30
expect(findExpandAll(wrapper)).not.toBe(null);
2020-04-08 14:13:33 +05:30
});
});
describe('any row', () => {
[
2020-11-24 15:15:51 +05:30
{ diffViewType: INLINE_DIFF_VIEW_TYPE, lineIndex: 8, file: { parallel_diff_lines: [] } },
].forEach(({ diffViewType, file, lineIndex }) => {
2020-04-08 14:13:33 +05:30
describe(`with diffViewType (${diffViewType})`, () => {
beforeEach(() => {
2020-11-24 15:15:51 +05:30
mockLine = getLine(mockFile, diffViewType, lineIndex);
2020-04-08 14:13:33 +05:30
store.state.diffs.diffFiles = [{ ...mockFile, ...file }];
store.state.diffs.diffViewType = diffViewType;
});
it('does not initially dispatch anything', () => {
expect(store.dispatch).not.toHaveBeenCalled();
});
it('on expand all clicked, dispatch loadMoreLines', () => {
const oldLineNumber = mockLine.meta_data.old_pos;
const newLineNumber = mockLine.meta_data.new_pos;
const previousIndex = getPreviousLineIndex(diffViewType, mockFile, {
oldLineNumber,
newLineNumber,
});
2021-03-08 18:12:59 +05:30
const wrapper = createComponent();
2020-04-08 14:13:33 +05:30
2021-03-08 18:12:59 +05:30
findExpandAll(wrapper).click();
2020-04-08 14:13:33 +05:30
expect(store.dispatch).toHaveBeenCalledWith(
'diffs/loadMoreLines',
makeLoadMoreLinesPayload({
fileHash: mockFile.file_hash,
toLine: newLineNumber - 1,
sinceLine: previousIndex,
oldLineNumber,
diffViewType,
}),
);
});
it('on expand up clicked, dispatch loadMoreLines', () => {
mockLine.meta_data.old_pos = 200;
mockLine.meta_data.new_pos = 200;
const oldLineNumber = mockLine.meta_data.old_pos;
const newLineNumber = mockLine.meta_data.new_pos;
2021-03-08 18:12:59 +05:30
const wrapper = createComponent();
2020-04-08 14:13:33 +05:30
2021-03-08 18:12:59 +05:30
findExpandUp(wrapper).trigger('click');
2020-04-08 14:13:33 +05:30
expect(store.dispatch).toHaveBeenCalledWith(
'diffs/loadMoreLines',
makeLoadMoreLinesPayload({
fileHash: mockFile.file_hash,
toLine: newLineNumber - 1,
sinceLine: 179,
oldLineNumber,
diffViewType,
unfold: true,
}),
);
});
it('on expand down clicked, dispatch loadMoreLines', () => {
2020-11-24 15:15:51 +05:30
mockFile[lineSources[diffViewType]][lineIndex + 1] = cloneDeep(
mockFile[lineSources[diffViewType]][lineIndex],
2020-04-08 14:13:33 +05:30
);
2020-11-24 15:15:51 +05:30
const nextLine = getLine(mockFile, diffViewType, lineIndex + 1);
2020-04-08 14:13:33 +05:30
nextLine.meta_data.old_pos = 300;
nextLine.meta_data.new_pos = 300;
mockLine.meta_data.old_pos = 200;
mockLine.meta_data.new_pos = 200;
2021-03-08 18:12:59 +05:30
const wrapper = createComponent();
2020-04-08 14:13:33 +05:30
2021-03-08 18:12:59 +05:30
findExpandDown(wrapper).trigger('click');
2020-04-08 14:13:33 +05:30
expect(store.dispatch).toHaveBeenCalledWith('diffs/loadMoreLines', {
endpoint: 'contextLinesPath',
params: {
since: 1,
to: 21, // the load amount, plus 1 line
offset: 0,
view: diffViewType,
unfold: true,
bottom: true,
},
lineNumbers: {
// when expanding down, these are based on the previous line, 0, in this case
oldLineNumber: 0,
newLineNumber: 0,
},
nextLineNumbers: { old_line: 200, new_line: 200 },
fileHash: mockFile.file_hash,
isExpandDown: true,
});
});
});
2019-10-12 21:52:04 +05:30
});
});
});