debian-mirror-gitlab/spec/frontend/projects/project_find_file_spec.js

Ignoring revisions in .git-blame-ignore-revs. Click here to bypass and see the normal blame view.

94 lines
2.8 KiB
JavaScript
Raw Normal View History

2019-12-04 20:38:33 +05:30
import MockAdapter from 'axios-mock-adapter';
import $ from 'jquery';
import { TEST_HOST } from 'helpers/test_constants';
2022-04-04 11:22:00 +05:30
import waitForPromises from 'helpers/wait_for_promises';
2021-01-03 14:25:43 +05:30
import { sanitize } from '~/lib/dompurify';
2020-01-01 13:55:28 +05:30
import axios from '~/lib/utils/axios_utils';
2023-04-23 21:23:45 +05:30
import { HTTP_STATUS_OK } from '~/lib/utils/http_status';
2022-03-02 08:16:31 +05:30
import ProjectFindFile from '~/projects/project_find_file';
2019-12-26 22:10:19 +05:30
2021-01-03 14:25:43 +05:30
jest.mock('~/lib/dompurify', () => ({
addHook: jest.fn(),
2021-03-08 18:12:59 +05:30
sanitize: jest.fn((val) => val),
2020-10-24 23:57:45 +05:30
}));
2019-12-04 20:38:33 +05:30
2021-06-08 01:23:25 +05:30
const BLOB_URL_TEMPLATE = `${TEST_HOST}/namespace/project/blob/main`;
const FILE_FIND_URL = `${TEST_HOST}/namespace/project/files/main?format=json`;
const FIND_TREE_URL = `${TEST_HOST}/namespace/project/tree/main`;
2019-12-04 20:38:33 +05:30
const TEMPLATE = `<div class="file-finder-holder tree-holder js-file-finder" data-blob-url-template="${BLOB_URL_TEMPLATE}" data-file-find-url="${FILE_FIND_URL}" data-find-tree-url="${FIND_TREE_URL}">
<input class="file-finder-input" id="file_find" />
<div class="tree-content-holder">
<div class="table-holder">
<table class="files-slider tree-table">
<tbody />
</table>
</div>
</div>
</div>`;
describe('ProjectFindFile', () => {
let element;
let mock;
const getProjectFindFileInstance = () =>
new ProjectFindFile(element, {
url: FILE_FIND_URL,
treeUrl: FIND_TREE_URL,
blobUrlTemplate: BLOB_URL_TEMPLATE,
});
const findFiles = () =>
element
.find('.tree-table tr')
.toArray()
2021-03-08 18:12:59 +05:30
.map((el) => ({
2019-12-04 20:38:33 +05:30
text: el.textContent,
href: el.querySelector('a').href,
}));
2019-12-26 22:10:19 +05:30
const files = [
2020-01-01 13:55:28 +05:30
{ path: 'fileA.txt', escaped: 'fileA.txt' },
{ path: 'fileB.txt', escaped: 'fileB.txt' },
{ path: 'fi#leC.txt', escaped: 'fi%23leC.txt' },
{ path: 'folderA/fileD.txt', escaped: 'folderA/fileD.txt' },
{ path: 'folder#B/fileE.txt', escaped: 'folder%23B/fileE.txt' },
{ path: 'folde?rC/fil#F.txt', escaped: 'folde%3FrC/fil%23F.txt' },
2019-12-26 22:10:19 +05:30
];
2022-04-04 11:22:00 +05:30
beforeEach(() => {
2019-12-04 20:38:33 +05:30
// Create a mock adapter for stubbing axios API requests
mock = new MockAdapter(axios);
element = $(TEMPLATE);
2021-03-08 18:12:59 +05:30
mock.onGet(FILE_FIND_URL).replyOnce(
2023-04-23 21:23:45 +05:30
HTTP_STATUS_OK,
2021-03-08 18:12:59 +05:30
files.map((x) => x.path),
);
2019-12-26 22:10:19 +05:30
getProjectFindFileInstance(); // This triggers a load / axios call + subsequent render in the constructor
2020-01-01 13:55:28 +05:30
2022-04-04 11:22:00 +05:30
return waitForPromises();
2019-12-04 20:38:33 +05:30
});
afterEach(() => {
// Reset the mock adapter
mock.restore();
2019-12-26 22:10:19 +05:30
sanitize.mockClear();
2019-12-04 20:38:33 +05:30
});
2020-01-01 13:55:28 +05:30
it('loads and renders elements from remote server', () => {
expect(findFiles()).toEqual(
files.map(({ path, escaped }) => ({
text: path,
href: `${BLOB_URL_TEMPLATE}/${escaped}`,
})),
);
2019-12-04 20:38:33 +05:30
});
2019-12-26 22:10:19 +05:30
2020-01-01 13:55:28 +05:30
it('sanitizes search text', () => {
2019-12-26 22:10:19 +05:30
const searchText = element.find('.file-finder-input').val();
2020-01-01 13:55:28 +05:30
expect(sanitize).toHaveBeenCalledTimes(1);
expect(sanitize).toHaveBeenCalledWith(searchText);
2019-12-26 22:10:19 +05:30
});
2019-12-04 20:38:33 +05:30
});