debian-mirror-gitlab/spec/frontend/behaviors/copy_as_gfm_spec.js

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

135 lines
3.9 KiB
JavaScript
Raw Normal View History

2022-04-04 11:22:00 +05:30
import waitForPromises from 'helpers/wait_for_promises';
2019-03-02 22:35:43 +05:30
import initCopyAsGFM, { CopyAsGFM } from '~/behaviors/markdown/copy_as_gfm';
2018-03-17 18:26:18 +05:30
describe('CopyAsGFM', () => {
describe('CopyAsGFM.pasteGFM', () => {
2021-07-02 01:05:55 +05:30
let target;
beforeEach(() => {
target = document.createElement('input');
target.value = 'This is code: ';
2022-07-16 23:28:13 +05:30
// needed for the underlying insertText to work
document.execCommand = jest.fn(() => false);
2021-07-02 01:05:55 +05:30
});
// When GFM code is copied, we put the regular plain text
// on the clipboard as `text/plain`, and the GFM as `text/x-gfm`.
// This emulates the behavior of `getData` with that data.
function callPasteGFM(data = { 'text/plain': 'code', 'text/x-gfm': '`code`' }) {
2018-03-17 18:26:18 +05:30
const e = {
originalEvent: {
clipboardData: {
getData(mimeType) {
2021-07-02 01:05:55 +05:30
return data[mimeType] || null;
2018-03-17 18:26:18 +05:30
},
},
},
preventDefault() {},
2021-07-02 01:05:55 +05:30
target,
2018-03-17 18:26:18 +05:30
};
CopyAsGFM.pasteGFM(e);
}
it('wraps pasted code when not already in code tags', () => {
2021-07-02 01:05:55 +05:30
callPasteGFM();
expect(target.value).toBe('This is code: `code`');
});
2018-12-13 13:39:08 +05:30
2021-07-02 01:05:55 +05:30
it('does not wrap pasted code when already in code tags', () => {
target.value = 'This is code: `';
2018-03-17 18:26:18 +05:30
callPasteGFM();
2021-07-02 01:05:55 +05:30
expect(target.value).toBe('This is code: `code');
2018-03-17 18:26:18 +05:30
});
2021-07-02 01:05:55 +05:30
it('does not allow xss in x-gfm-html', () => {
const testEl = document.createElement('div');
jest.spyOn(document, 'createElement').mockReturnValueOnce(testEl);
2018-12-13 13:39:08 +05:30
2021-07-02 01:05:55 +05:30
callPasteGFM({ 'text/plain': 'code', 'text/x-gfm-html': 'code<img/src/onerror=alert(1)>' });
2018-03-17 18:26:18 +05:30
2021-07-02 01:05:55 +05:30
expect(testEl.innerHTML).toBe('code<img src="">');
2018-03-17 18:26:18 +05:30
});
});
2018-11-08 19:23:39 +05:30
describe('CopyAsGFM.copyGFM', () => {
// Stub getSelection to return a purpose-built object.
const stubSelection = (html, parentNode) => ({
getRangeAt: () => ({
commonAncestorContainer: { tagName: parentNode },
cloneContents: () => {
const fragment = document.createDocumentFragment();
const node = document.createElement('div');
node.innerHTML = html;
2021-03-08 18:12:59 +05:30
Array.from(node.childNodes).forEach((item) => fragment.appendChild(item));
2018-11-08 19:23:39 +05:30
return fragment;
},
}),
rangeCount: 1,
});
const clipboardData = {
setData() {},
};
const simulateCopy = () => {
const e = {
originalEvent: {
clipboardData,
},
preventDefault() {},
stopPropagation() {},
};
CopyAsGFM.copyAsGFM(e, CopyAsGFM.transformGFMSelection);
2022-04-04 11:22:00 +05:30
return waitForPromises();
2018-11-08 19:23:39 +05:30
};
2022-04-04 11:22:00 +05:30
beforeAll(() => {
2019-03-02 22:35:43 +05:30
initCopyAsGFM();
// Fake call to nodeToGfm so the import of lazy bundle happened
2022-04-04 11:22:00 +05:30
return CopyAsGFM.nodeToGFM(document.createElement('div'));
2019-03-02 22:35:43 +05:30
});
2020-06-23 00:09:42 +05:30
beforeEach(() => jest.spyOn(clipboardData, 'setData'));
2018-11-08 19:23:39 +05:30
describe('list handling', () => {
2022-04-04 11:22:00 +05:30
it('uses correct gfm for unordered lists', async () => {
2018-11-08 19:23:39 +05:30
const selection = stubSelection('<li>List Item1</li><li>List Item2</li>\n', 'UL');
2019-03-02 22:35:43 +05:30
2020-06-23 00:09:42 +05:30
window.getSelection = jest.fn(() => selection);
2022-04-04 11:22:00 +05:30
await simulateCopy();
2018-11-08 19:23:39 +05:30
2022-04-04 11:22:00 +05:30
const expectedGFM = '* List Item1\n* List Item2';
2018-12-13 13:39:08 +05:30
2022-04-04 11:22:00 +05:30
expect(clipboardData.setData).toHaveBeenCalledWith('text/x-gfm', expectedGFM);
2018-11-08 19:23:39 +05:30
});
2022-04-04 11:22:00 +05:30
it('uses correct gfm for ordered lists', async () => {
2018-11-08 19:23:39 +05:30
const selection = stubSelection('<li>List Item1</li><li>List Item2</li>\n', 'OL');
2019-03-02 22:35:43 +05:30
2020-06-23 00:09:42 +05:30
window.getSelection = jest.fn(() => selection);
2022-04-04 11:22:00 +05:30
await simulateCopy();
2018-11-08 19:23:39 +05:30
2022-04-04 11:22:00 +05:30
const expectedGFM = '1. List Item1\n1. List Item2';
2018-12-13 13:39:08 +05:30
2022-04-04 11:22:00 +05:30
expect(clipboardData.setData).toHaveBeenCalledWith('text/x-gfm', expectedGFM);
2018-11-08 19:23:39 +05:30
});
});
});
2020-10-24 23:57:45 +05:30
describe('CopyAsGFM.quoted', () => {
const sampleGFM = '* List 1\n* List 2\n\n`Some code`';
2022-04-04 11:22:00 +05:30
it('adds quote char `> ` to each line', () => {
2020-10-24 23:57:45 +05:30
const expectedQuotedGFM = '> * List 1\n> * List 2\n> \n> `Some code`';
expect(CopyAsGFM.quoted(sampleGFM)).toEqual(expectedQuotedGFM);
});
});
2018-03-17 18:26:18 +05:30
});