Commit 46d3651f authored by Vitaly Slobodin's avatar Vitaly Slobodin

Merge branch '328641-insert-images/pass-render-markdown-to-image-extension' into 'master'

Pass uploadsPath and renderMarkdown function to Image extension

See merge request gitlab-org/gitlab!65680
parents beb0a6c8 9d0c2edd
......@@ -44,7 +44,13 @@ const ExtendedImage = Image.extend({
},
];
},
}).configure({ inline: true });
});
export const tiptapExtension = ExtendedImage;
export const serializer = defaultMarkdownSerializer.nodes.image;
const serializer = defaultMarkdownSerializer.nodes.image;
export const configure = ({ renderMarkdown, uploadsPath }) => {
return {
tiptapExtension: ExtendedImage.configure({ inline: true, renderMarkdown, uploadsPath }),
serializer,
};
};
......@@ -26,29 +26,6 @@ import { ContentEditor } from './content_editor';
import createMarkdownSerializer from './markdown_serializer';
import trackInputRulesAndShortcuts from './track_input_rules_and_shortcuts';
const builtInContentEditorExtensions = [
Blockquote,
Bold,
BulletList,
Code,
CodeBlockHighlight,
Document,
Dropcursor,
Gapcursor,
HardBreak,
Heading,
History,
HorizontalRule,
Image,
Italic,
Link,
ListItem,
OrderedList,
Paragraph,
Strike,
Text,
];
const collectTiptapExtensions = (extensions = []) =>
extensions.map(({ tiptapExtension }) => tiptapExtension);
......@@ -63,11 +40,39 @@ const createTiptapEditor = ({ extensions = [], ...options } = {}) =>
...options,
});
export const createContentEditor = ({ renderMarkdown, extensions = [], tiptapOptions } = {}) => {
export const createContentEditor = ({
renderMarkdown,
uploadsPath,
extensions = [],
tiptapOptions,
} = {}) => {
if (!isFunction(renderMarkdown)) {
throw new Error(PROVIDE_SERIALIZER_OR_RENDERER_ERROR);
}
const builtInContentEditorExtensions = [
Blockquote,
Bold,
BulletList,
Code,
CodeBlockHighlight,
Document,
Dropcursor,
Gapcursor,
HardBreak,
Heading,
History,
HorizontalRule,
Image.configure({ uploadsPath, renderMarkdown }),
Italic,
Link,
ListItem,
OrderedList,
Paragraph,
Strike,
Text,
];
const allExtensions = [...builtInContentEditorExtensions, ...extensions];
const tiptapExtensions = collectTiptapExtensions(allExtensions).map(trackInputRulesAndShortcuts);
const tiptapEditor = createTiptapEditor({ extensions: tiptapExtensions, ...tiptapOptions });
......
......@@ -264,6 +264,7 @@ export default {
this.contentEditor ||
createContentEditor({
renderMarkdown: (markdown) => this.getContentHTML(markdown),
uploadsPath: this.pageInfo.uploadsPath,
tiptapOptions: {
onUpdate: () => this.handleContentChange(),
},
......
......@@ -5,10 +5,11 @@ import { createTestContentEditorExtension } from '../test_utils';
describe('content_editor/services/create_editor', () => {
let renderMarkdown;
let editor;
const uploadsPath = '/uploads';
beforeEach(() => {
renderMarkdown = jest.fn();
editor = createContentEditor({ renderMarkdown });
editor = createContentEditor({ renderMarkdown, uploadsPath });
});
it('sets gl-outline-0! class selector to the tiptapEditor instance', () => {
......@@ -48,4 +49,13 @@ describe('content_editor/services/create_editor', () => {
it('throws an error when a renderMarkdown fn is not provided', () => {
expect(() => createContentEditor()).toThrow(PROVIDE_SERIALIZER_OR_RENDERER_ERROR);
});
it('provides uploadsPath and renderMarkdown function to Image extension', () => {
expect(
editor.tiptapEditor.extensionManager.extensions.find((e) => e.name === 'image').options,
).toMatchObject({
uploadsPath,
renderMarkdown,
});
});
});
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment