739 lines
25 KiB
JavaScript
739 lines
25 KiB
JavaScript
import axios from 'axios';
|
|
import MockAdapter from 'axios-mock-adapter';
|
|
import Attachment from '~/content_editor/extensions/attachment';
|
|
import DrawioDiagram from '~/content_editor/extensions/drawio_diagram';
|
|
import Image from '~/content_editor/extensions/image';
|
|
import Audio from '~/content_editor/extensions/audio';
|
|
import Video from '~/content_editor/extensions/video';
|
|
import Link from '~/content_editor/extensions/link';
|
|
import { VARIANT_DANGER } from '~/alert';
|
|
import { HTTP_STATUS_INTERNAL_SERVER_ERROR, HTTP_STATUS_OK } from '~/lib/utils/http_status';
|
|
import eventHubFactory from '~/helpers/event_hub_factory';
|
|
import { createTestEditor, createDocBuilder, expectDocumentAfterTransaction } from '../test_utils';
|
|
import {
|
|
PROJECT_WIKI_ATTACHMENT_IMAGE_HTML,
|
|
PROJECT_WIKI_ATTACHMENT_IMAGE_SVG_HTML,
|
|
PROJECT_WIKI_ATTACHMENT_AUDIO_HTML,
|
|
PROJECT_WIKI_ATTACHMENT_VIDEO_HTML,
|
|
PROJECT_WIKI_ATTACHMENT_LINK_HTML,
|
|
PROJECT_WIKI_ATTACHMENT_DRAWIO_DIAGRAM_HTML,
|
|
} from '../test_constants';
|
|
|
|
describe('content_editor/extensions/attachment', () => {
|
|
let tiptapEditor;
|
|
let doc;
|
|
let p;
|
|
let image;
|
|
let audio;
|
|
let drawioDiagram;
|
|
let video;
|
|
let link;
|
|
let renderMarkdown;
|
|
let mock;
|
|
let eventHub;
|
|
|
|
const uploadsPath = '/uploads/';
|
|
const imageFile = new File(['foo'], 'test-file.png', { type: 'image/png' });
|
|
const imageFileSvg = new File(['foo'], 'test-file.svg', { type: 'image/svg+xml' });
|
|
const audioFile = new File(['foo'], 'test-file.mp3', { type: 'audio/mpeg' });
|
|
const videoFile = new File(['foo'], 'test-file.mp4', { type: 'video/mp4' });
|
|
const videoFile1 = new File(['foo'], 'test-file1.mp4', { type: 'video/mp4' });
|
|
const drawioDiagramFile = new File(['foo'], 'test-file.drawio.svg', { type: 'image/svg+xml' });
|
|
const attachmentFile = new File(['foo'], 'test-file.zip', { type: 'application/zip' });
|
|
const attachmentFile1 = new File(['foo'], 'test-file1.zip', { type: 'application/zip' });
|
|
const attachmentFile2 = new File(['foo'], 'test-file2.zip', { type: 'application/zip' });
|
|
|
|
const markdownApiResult = {
|
|
'test-file.png': PROJECT_WIKI_ATTACHMENT_IMAGE_HTML,
|
|
'test-file.svg': PROJECT_WIKI_ATTACHMENT_IMAGE_SVG_HTML,
|
|
'test-file.mp3': PROJECT_WIKI_ATTACHMENT_AUDIO_HTML,
|
|
'test-file.mp4': PROJECT_WIKI_ATTACHMENT_VIDEO_HTML,
|
|
'test-file1.mp4': PROJECT_WIKI_ATTACHMENT_VIDEO_HTML.replace(/test-file/g, 'test-file1'),
|
|
'test-file.zip': PROJECT_WIKI_ATTACHMENT_LINK_HTML,
|
|
'test-file1.zip': PROJECT_WIKI_ATTACHMENT_LINK_HTML.replace(/test-file/g, 'test-file1'),
|
|
'test-file2.zip': PROJECT_WIKI_ATTACHMENT_LINK_HTML.replace(/test-file/g, 'test-file2'),
|
|
'test-file.drawio.svg': PROJECT_WIKI_ATTACHMENT_DRAWIO_DIAGRAM_HTML,
|
|
};
|
|
|
|
const [, group, project] = markdownApiResult[attachmentFile.name].match(
|
|
/\/(group[0-9]+)\/(project[0-9]+)\//,
|
|
);
|
|
const blobUrl = 'blob:https://gitlab.com/048c7ac1-98de-4a37-ab1b-0206d0ea7e1b';
|
|
|
|
beforeEach(() => {
|
|
renderMarkdown = jest.fn();
|
|
eventHub = eventHubFactory();
|
|
|
|
tiptapEditor = createTestEditor({
|
|
extensions: [
|
|
Link,
|
|
Image,
|
|
Audio,
|
|
Video,
|
|
DrawioDiagram,
|
|
Attachment.configure({ renderMarkdown, uploadsPath, eventHub }),
|
|
],
|
|
});
|
|
|
|
({
|
|
builders: { doc, p, image, audio, video, link, drawioDiagram },
|
|
} = createDocBuilder({
|
|
tiptapEditor,
|
|
names: {
|
|
image: { nodeType: Image.name },
|
|
link: { nodeType: Link.name },
|
|
audio: { nodeType: Audio.name },
|
|
video: { nodeType: Video.name },
|
|
drawioDiagram: { nodeType: DrawioDiagram.name },
|
|
},
|
|
}));
|
|
|
|
mock = new MockAdapter(axios);
|
|
});
|
|
|
|
afterEach(() => {
|
|
mock.reset();
|
|
});
|
|
|
|
it.each`
|
|
eventType | propName | eventData | output
|
|
${'paste'} | ${'handlePaste'} | ${{ clipboardData: { getData: jest.fn(), files: [attachmentFile] } }} | ${true}
|
|
${'paste'} | ${'handlePaste'} | ${{ clipboardData: { getData: jest.fn(), files: [] } }} | ${undefined}
|
|
${'drop'} | ${'handleDrop'} | ${{ dataTransfer: { getData: jest.fn(), files: [attachmentFile] } }} | ${true}
|
|
`('handles $eventType properly', ({ eventType, propName, eventData, output }) => {
|
|
mock.onPost().reply(HTTP_STATUS_OK, {
|
|
link: {
|
|
markdown: ``,
|
|
},
|
|
});
|
|
|
|
renderMarkdown.mockResolvedValue(PROJECT_WIKI_ATTACHMENT_IMAGE_HTML);
|
|
|
|
const event = Object.assign(new Event(eventType), eventData);
|
|
const handled = tiptapEditor.view.someProp(propName, (eventHandler) => {
|
|
return eventHandler(tiptapEditor.view, event);
|
|
});
|
|
|
|
expect(handled).toBe(output);
|
|
});
|
|
|
|
describe('uploadAttachment command', () => {
|
|
let initialDoc;
|
|
beforeEach(() => {
|
|
initialDoc = doc(p(''));
|
|
tiptapEditor.commands.setContent(initialDoc.toJSON());
|
|
});
|
|
|
|
describe.each`
|
|
nodeType | html | file | mediaType
|
|
${'image (png)'} | ${PROJECT_WIKI_ATTACHMENT_IMAGE_HTML} | ${imageFile} | ${(attrs) => image(attrs)}
|
|
${'image (svg)'} | ${PROJECT_WIKI_ATTACHMENT_IMAGE_SVG_HTML} | ${imageFileSvg} | ${(attrs) => image(attrs)}
|
|
${'audio'} | ${PROJECT_WIKI_ATTACHMENT_AUDIO_HTML} | ${audioFile} | ${(attrs) => audio(attrs)}
|
|
${'video'} | ${PROJECT_WIKI_ATTACHMENT_VIDEO_HTML} | ${videoFile} | ${(attrs) => video(attrs)}
|
|
${'drawioDiagram'} | ${PROJECT_WIKI_ATTACHMENT_DRAWIO_DIAGRAM_HTML} | ${drawioDiagramFile} | ${(attrs) => drawioDiagram(attrs)}
|
|
`('when the file is $nodeType', ({ html, file, mediaType }) => {
|
|
beforeEach(() => {
|
|
renderMarkdown.mockResolvedValue(html);
|
|
});
|
|
|
|
describe('when uploading succeeds', () => {
|
|
const successResponse = {
|
|
link: {
|
|
markdown: ``,
|
|
},
|
|
};
|
|
|
|
beforeEach(() => {
|
|
mock.onPost().reply(HTTP_STATUS_OK, successResponse);
|
|
});
|
|
|
|
it('inserts a media content with src set to the encoded content and uploading=file_name', async () => {
|
|
const expectedDoc = doc(
|
|
p(mediaType({ uploading: file.name, src: blobUrl, alt: file.name })),
|
|
);
|
|
|
|
await expectDocumentAfterTransaction({
|
|
tiptapEditor,
|
|
number: 1,
|
|
expectedDoc,
|
|
action: () => tiptapEditor.commands.uploadAttachment({ file }),
|
|
});
|
|
});
|
|
|
|
it('updates the inserted content with canonicalSrc when upload is successful', async () => {
|
|
const expectedDoc = doc(
|
|
p(
|
|
mediaType({
|
|
canonicalSrc: file.name,
|
|
src: blobUrl,
|
|
alt: expect.stringContaining('test-file'),
|
|
uploading: false,
|
|
}),
|
|
),
|
|
);
|
|
|
|
await expectDocumentAfterTransaction({
|
|
tiptapEditor,
|
|
number: 2,
|
|
expectedDoc,
|
|
action: () => tiptapEditor.commands.uploadAttachment({ file }),
|
|
});
|
|
});
|
|
});
|
|
|
|
describe('when uploading a large file', () => {
|
|
beforeEach(() => {
|
|
// Set max file size to 1 byte, our file is 3 bytes
|
|
gon.max_file_size = 1 / 1024 / 1024;
|
|
});
|
|
|
|
it('emits an alert event that includes an error message', () => {
|
|
tiptapEditor.commands.uploadAttachment({ file });
|
|
|
|
return new Promise((resolve) => {
|
|
eventHub.$on('alert', ({ message, variant }) => {
|
|
expect(variant).toBe(VARIANT_DANGER);
|
|
expect(message).toContain('File is too big');
|
|
resolve();
|
|
});
|
|
});
|
|
});
|
|
});
|
|
|
|
describe('when uploading request fails', () => {
|
|
beforeEach(() => {
|
|
mock.onPost().reply(HTTP_STATUS_INTERNAL_SERVER_ERROR);
|
|
});
|
|
|
|
it('resets the doc to original state', async () => {
|
|
const expectedDoc = doc(p(''));
|
|
|
|
await expectDocumentAfterTransaction({
|
|
tiptapEditor,
|
|
number: 2,
|
|
expectedDoc,
|
|
action: () => tiptapEditor.commands.uploadAttachment({ file }),
|
|
});
|
|
});
|
|
|
|
it('emits an alert event that includes an error message', () => {
|
|
tiptapEditor.commands.uploadAttachment({ file });
|
|
|
|
return new Promise((resolve) => {
|
|
eventHub.$on('alert', ({ message, variant }) => {
|
|
expect(variant).toBe(VARIANT_DANGER);
|
|
expect(message).toBe('An error occurred while uploading the file. Please try again.');
|
|
resolve();
|
|
});
|
|
});
|
|
});
|
|
});
|
|
});
|
|
|
|
describe('when the file has a zip (or any other attachment) mime type', () => {
|
|
beforeEach(() => {
|
|
renderMarkdown.mockResolvedValue(markdownApiResult[attachmentFile.name]);
|
|
});
|
|
|
|
describe('when uploading succeeds', () => {
|
|
const successResponse = {
|
|
link: {
|
|
markdown: '[test-file](test-file.zip)',
|
|
},
|
|
};
|
|
|
|
beforeEach(() => {
|
|
mock.onPost().reply(HTTP_STATUS_OK, successResponse);
|
|
});
|
|
|
|
it('inserts a link with a blob url', async () => {
|
|
const expectedDoc = doc(
|
|
p(link({ uploading: attachmentFile.name, href: blobUrl }, 'test-file.zip')),
|
|
);
|
|
|
|
await expectDocumentAfterTransaction({
|
|
tiptapEditor,
|
|
number: 1,
|
|
expectedDoc,
|
|
action: () => tiptapEditor.commands.uploadAttachment({ file: attachmentFile }),
|
|
});
|
|
});
|
|
|
|
it('updates the blob url link with an actual link with canonicalSrc and href attrs', async () => {
|
|
const expectedDoc = doc(
|
|
p(
|
|
link(
|
|
{
|
|
canonicalSrc: 'test-file.zip',
|
|
href: `/${group}/${project}/-/wikis/test-file.zip`,
|
|
},
|
|
'test-file.zip',
|
|
),
|
|
),
|
|
);
|
|
|
|
await expectDocumentAfterTransaction({
|
|
tiptapEditor,
|
|
number: 2,
|
|
expectedDoc,
|
|
action: () => tiptapEditor.commands.uploadAttachment({ file: attachmentFile }),
|
|
});
|
|
});
|
|
});
|
|
|
|
describe('when uploading request fails', () => {
|
|
beforeEach(() => {
|
|
mock.onPost().reply(HTTP_STATUS_INTERNAL_SERVER_ERROR);
|
|
});
|
|
|
|
it('resets the doc to orginal state', async () => {
|
|
const expectedDoc = doc(p(''));
|
|
|
|
await expectDocumentAfterTransaction({
|
|
tiptapEditor,
|
|
number: 2,
|
|
expectedDoc,
|
|
action: () => tiptapEditor.commands.uploadAttachment({ file: attachmentFile }),
|
|
});
|
|
});
|
|
|
|
it('emits an alert event that includes an error message', () => {
|
|
tiptapEditor.commands.uploadAttachment({ file: attachmentFile });
|
|
|
|
eventHub.$on('alert', ({ message, variant }) => {
|
|
expect(variant).toBe(VARIANT_DANGER);
|
|
expect(message).toBe('An error occurred while uploading the file. Please try again.');
|
|
});
|
|
});
|
|
});
|
|
});
|
|
|
|
describe('uploading multiple files', () => {
|
|
const uploadMultipleFiles = () => {
|
|
const files = [
|
|
attachmentFile,
|
|
imageFile,
|
|
videoFile,
|
|
attachmentFile1,
|
|
attachmentFile2,
|
|
videoFile1,
|
|
audioFile,
|
|
];
|
|
|
|
for (const file of files) {
|
|
renderMarkdown.mockImplementation((markdown) =>
|
|
Promise.resolve(markdownApiResult[markdown.match(/\((.+?)\)$/)[1]]),
|
|
);
|
|
|
|
mock
|
|
.onPost()
|
|
.replyOnce(HTTP_STATUS_OK, { link: { markdown: `` } });
|
|
|
|
tiptapEditor.commands.uploadAttachment({ file });
|
|
}
|
|
};
|
|
|
|
it.each([
|
|
[1, () => doc(p(link({ href: blobUrl, uploading: 'test-file.zip' }, 'test-file.zip')))],
|
|
[
|
|
2,
|
|
() =>
|
|
doc(
|
|
p(link({ href: blobUrl, uploading: 'test-file.zip' }, 'test-file.zip')),
|
|
p(image({ alt: 'test-file.png', src: blobUrl, uploading: 'test-file.png' })),
|
|
),
|
|
],
|
|
[
|
|
3,
|
|
() =>
|
|
doc(
|
|
p(link({ href: blobUrl, uploading: 'test-file.zip' }, 'test-file.zip')),
|
|
p(image({ alt: 'test-file.png', src: blobUrl, uploading: 'test-file.png' })),
|
|
p(video({ alt: 'test-file.mp4', src: blobUrl, uploading: 'test-file.mp4' })),
|
|
),
|
|
],
|
|
[
|
|
4,
|
|
() =>
|
|
doc(
|
|
p(link({ href: blobUrl, uploading: 'test-file.zip' }, 'test-file.zip')),
|
|
p(image({ alt: 'test-file.png', src: blobUrl, uploading: 'test-file.png' })),
|
|
p(video({ alt: 'test-file.mp4', src: blobUrl, uploading: 'test-file.mp4' })),
|
|
p(link({ href: blobUrl, uploading: 'test-file1.zip' }, 'test-file1.zip')),
|
|
),
|
|
],
|
|
[
|
|
5,
|
|
() =>
|
|
doc(
|
|
p(link({ href: blobUrl, uploading: 'test-file.zip' }, 'test-file.zip')),
|
|
p(image({ alt: 'test-file.png', src: blobUrl, uploading: 'test-file.png' })),
|
|
p(video({ alt: 'test-file.mp4', src: blobUrl, uploading: 'test-file.mp4' })),
|
|
p(link({ href: blobUrl, uploading: 'test-file1.zip' }, 'test-file1.zip')),
|
|
p(link({ href: blobUrl, uploading: 'test-file2.zip' }, 'test-file2.zip')),
|
|
),
|
|
],
|
|
[
|
|
6,
|
|
() =>
|
|
doc(
|
|
p(link({ href: blobUrl, uploading: 'test-file.zip' }, 'test-file.zip')),
|
|
p(image({ alt: 'test-file.png', src: blobUrl, uploading: 'test-file.png' })),
|
|
p(video({ alt: 'test-file.mp4', src: blobUrl, uploading: 'test-file.mp4' })),
|
|
p(link({ href: blobUrl, uploading: 'test-file1.zip' }, 'test-file1.zip')),
|
|
p(link({ href: blobUrl, uploading: 'test-file2.zip' }, 'test-file2.zip')),
|
|
p(video({ alt: 'test-file1.mp4', src: blobUrl, uploading: 'test-file1.mp4' })),
|
|
),
|
|
],
|
|
[
|
|
7,
|
|
() =>
|
|
doc(
|
|
p(link({ href: blobUrl, uploading: 'test-file.zip' }, 'test-file.zip')),
|
|
p(image({ alt: 'test-file.png', src: blobUrl, uploading: 'test-file.png' })),
|
|
p(video({ alt: 'test-file.mp4', src: blobUrl, uploading: 'test-file.mp4' })),
|
|
p(link({ href: blobUrl, uploading: 'test-file1.zip' }, 'test-file1.zip')),
|
|
p(link({ href: blobUrl, uploading: 'test-file2.zip' }, 'test-file2.zip')),
|
|
p(video({ alt: 'test-file1.mp4', src: blobUrl, uploading: 'test-file1.mp4' })),
|
|
p(audio({ alt: 'test-file.mp3', src: blobUrl, uploading: 'test-file.mp3' })),
|
|
),
|
|
],
|
|
[
|
|
8,
|
|
() =>
|
|
doc(
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file.zip`,
|
|
canonicalSrc: 'test-file.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file.zip',
|
|
),
|
|
),
|
|
p(image({ alt: 'test-file.png', src: blobUrl, uploading: 'test-file.png' })),
|
|
p(video({ alt: 'test-file.mp4', src: blobUrl, uploading: 'test-file.mp4' })),
|
|
p(link({ href: blobUrl, uploading: 'test-file1.zip' }, 'test-file1.zip')),
|
|
p(link({ href: blobUrl, uploading: 'test-file2.zip' }, 'test-file2.zip')),
|
|
p(video({ alt: 'test-file1.mp4', src: blobUrl, uploading: 'test-file1.mp4' })),
|
|
p(audio({ alt: 'test-file.mp3', src: blobUrl, uploading: 'test-file.mp3' })),
|
|
),
|
|
],
|
|
[
|
|
9,
|
|
() =>
|
|
doc(
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file.zip`,
|
|
canonicalSrc: 'test-file.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file.zip',
|
|
),
|
|
),
|
|
p(
|
|
image({
|
|
alt: 'test-file.png',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file.png',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
p(video({ alt: 'test-file.mp4', src: blobUrl, uploading: 'test-file.mp4' })),
|
|
p(link({ href: blobUrl, uploading: 'test-file1.zip' }, 'test-file1.zip')),
|
|
p(link({ href: blobUrl, uploading: 'test-file2.zip' }, 'test-file2.zip')),
|
|
p(video({ alt: 'test-file1.mp4', src: blobUrl, uploading: 'test-file1.mp4' })),
|
|
p(audio({ alt: 'test-file.mp3', src: blobUrl, uploading: 'test-file.mp3' })),
|
|
),
|
|
],
|
|
[
|
|
10,
|
|
() =>
|
|
doc(
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file.zip`,
|
|
canonicalSrc: 'test-file.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file.zip',
|
|
),
|
|
),
|
|
p(
|
|
image({
|
|
alt: 'test-file.png',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file.png',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
p(
|
|
video({
|
|
alt: 'test-file.mp4',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file.mp4',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
p(link({ href: blobUrl, uploading: 'test-file1.zip' }, 'test-file1.zip')),
|
|
p(link({ href: blobUrl, uploading: 'test-file2.zip' }, 'test-file2.zip')),
|
|
p(video({ alt: 'test-file1.mp4', src: blobUrl, uploading: 'test-file1.mp4' })),
|
|
p(audio({ alt: 'test-file.mp3', src: blobUrl, uploading: 'test-file.mp3' })),
|
|
),
|
|
],
|
|
[
|
|
11,
|
|
() =>
|
|
doc(
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file.zip`,
|
|
canonicalSrc: 'test-file.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file.zip',
|
|
),
|
|
),
|
|
p(
|
|
image({
|
|
alt: 'test-file.png',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file.png',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
p(
|
|
video({
|
|
alt: 'test-file.mp4',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file.mp4',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file1.zip`,
|
|
canonicalSrc: 'test-file1.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file1.zip',
|
|
),
|
|
),
|
|
p(link({ href: blobUrl, uploading: 'test-file2.zip' }, 'test-file2.zip')),
|
|
p(video({ alt: 'test-file1.mp4', src: blobUrl, uploading: 'test-file1.mp4' })),
|
|
p(audio({ alt: 'test-file.mp3', src: blobUrl, uploading: 'test-file.mp3' })),
|
|
),
|
|
],
|
|
[
|
|
12,
|
|
() =>
|
|
doc(
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file.zip`,
|
|
canonicalSrc: 'test-file.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file.zip',
|
|
),
|
|
),
|
|
p(
|
|
image({
|
|
alt: 'test-file.png',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file.png',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
p(
|
|
video({
|
|
alt: 'test-file.mp4',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file.mp4',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file1.zip`,
|
|
canonicalSrc: 'test-file1.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file1.zip',
|
|
),
|
|
),
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file2.zip`,
|
|
canonicalSrc: 'test-file2.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file2.zip',
|
|
),
|
|
),
|
|
p(video({ alt: 'test-file1.mp4', src: blobUrl, uploading: 'test-file1.mp4' })),
|
|
p(audio({ alt: 'test-file.mp3', src: blobUrl, uploading: 'test-file.mp3' })),
|
|
),
|
|
],
|
|
[
|
|
13,
|
|
() =>
|
|
doc(
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file.zip`,
|
|
canonicalSrc: 'test-file.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file.zip',
|
|
),
|
|
),
|
|
p(
|
|
image({
|
|
alt: 'test-file.png',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file.png',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
p(
|
|
video({
|
|
alt: 'test-file.mp4',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file.mp4',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file1.zip`,
|
|
canonicalSrc: 'test-file1.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file1.zip',
|
|
),
|
|
),
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file2.zip`,
|
|
canonicalSrc: 'test-file2.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file2.zip',
|
|
),
|
|
),
|
|
p(
|
|
video({
|
|
alt: 'test-file1.mp4',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file1.mp4',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
p(audio({ alt: 'test-file.mp3', src: blobUrl, uploading: 'test-file.mp3' })),
|
|
),
|
|
],
|
|
[
|
|
14,
|
|
() =>
|
|
doc(
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file.zip`,
|
|
canonicalSrc: 'test-file.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file.zip',
|
|
),
|
|
),
|
|
p(
|
|
image({
|
|
alt: 'test-file.png',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file.png',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
p(
|
|
video({
|
|
alt: 'test-file.mp4',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file.mp4',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file1.zip`,
|
|
canonicalSrc: 'test-file1.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file1.zip',
|
|
),
|
|
),
|
|
p(
|
|
link(
|
|
{
|
|
href: `/${group}/${project}/-/wikis/test-file2.zip`,
|
|
canonicalSrc: 'test-file2.zip',
|
|
uploading: false,
|
|
},
|
|
'test-file2.zip',
|
|
),
|
|
),
|
|
p(
|
|
video({
|
|
alt: 'test-file1.mp4',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file1.mp4',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
p(
|
|
audio({
|
|
alt: 'test-file.mp3',
|
|
src: blobUrl,
|
|
canonicalSrc: 'test-file.mp3',
|
|
uploading: false,
|
|
}),
|
|
),
|
|
),
|
|
],
|
|
])('uploads all files of mixed types successfully (tx %i)', async (n, document) => {
|
|
await expectDocumentAfterTransaction({
|
|
tiptapEditor,
|
|
number: n,
|
|
expectedDoc: document(),
|
|
action: uploadMultipleFiles,
|
|
});
|
|
});
|
|
|
|
it('cleans up the state if all uploads fail', async () => {
|
|
await expectDocumentAfterTransaction({
|
|
tiptapEditor,
|
|
number: 14,
|
|
expectedDoc: doc(p(), p(), p(), p(), p(), p(), p()),
|
|
action: () => {
|
|
// Set max file size to 1 byte, our file is 3 bytes
|
|
gon.max_file_size = 1 / 1024 / 1024;
|
|
uploadMultipleFiles();
|
|
},
|
|
});
|
|
});
|
|
});
|
|
});
|
|
});
|