kopia lustrzana https://github.com/wagtail/wagtail
Refactor Draftail exports to match exposed module
rodzic
d86f48842d
commit
aecfce73ec
|
@ -6,10 +6,6 @@ import { IS_IE11, STRINGS } from '../../config/wagtailConfig';
|
|||
|
||||
import Icon from '../Icon/Icon';
|
||||
|
||||
import registry from './registry';
|
||||
|
||||
export { registry };
|
||||
|
||||
export { default as Link } from './decorators/Link';
|
||||
export { default as Document } from './decorators/Document';
|
||||
export { default as ImageBlock } from './blocks/ImageBlock';
|
||||
|
@ -17,6 +13,20 @@ export { default as EmbedBlock } from './blocks/EmbedBlock';
|
|||
|
||||
export { default as ModalWorkflowSource } from './sources/ModalWorkflowSource';
|
||||
|
||||
/**
|
||||
* Registry for client-side code of Draftail plugins.
|
||||
*/
|
||||
const PLUGINS = {};
|
||||
|
||||
const registerPlugin = (plugin) => {
|
||||
PLUGINS[plugin.type] = plugin;
|
||||
return PLUGINS;
|
||||
};
|
||||
|
||||
/**
|
||||
* Wraps a style/block/entity type’s icon with an icon font implementation,
|
||||
* so Draftail can use icon fonts in its toolbar.
|
||||
*/
|
||||
export const wrapWagtailIcon = type => {
|
||||
const isIconFont = type.icon && typeof type.icon === 'string';
|
||||
if (isIconFont) {
|
||||
|
@ -33,7 +43,7 @@ export const wrapWagtailIcon = type => {
|
|||
* @param {string} fieldName
|
||||
* @param {Object} options
|
||||
*/
|
||||
export const initEditor = (fieldName, options) => {
|
||||
const initEditor = (fieldName, options) => {
|
||||
const field = document.querySelector(`[name="${fieldName}"]`);
|
||||
const editorWrapper = document.createElement('div');
|
||||
field.parentNode.appendChild(editorWrapper);
|
||||
|
@ -47,9 +57,9 @@ export const initEditor = (fieldName, options) => {
|
|||
let entityTypes = options.entityTypes || [];
|
||||
|
||||
entityTypes = entityTypes.map(wrapWagtailIcon).map((type) => {
|
||||
const plugin = registry.getPlugin(type.type);
|
||||
// Override the properties defined in the JS plugin: Python should be the source of truth.
|
||||
const plugin = PLUGINS[type.type];
|
||||
|
||||
// Override the properties defined in the JS plugin: Python should be the source of truth.
|
||||
return Object.assign({}, plugin, type);
|
||||
});
|
||||
|
||||
|
@ -68,7 +78,6 @@ export const initEditor = (fieldName, options) => {
|
|||
enableLineBreak={{ description: STRINGS.LINE_BREAK }}
|
||||
showUndoControl={{ description: STRINGS.UNDO }}
|
||||
showRedoControl={{ description: STRINGS.REDO }}
|
||||
// If increasing above 4, we will need to add styles for the extra nesting levels.
|
||||
maxListNesting={4}
|
||||
// Draft.js + IE 11 presents some issues with pasting rich text. Disable rich paste there.
|
||||
stripPastedStyles={IS_IE11}
|
||||
|
@ -85,3 +94,8 @@ export const initEditor = (fieldName, options) => {
|
|||
// Bind editor instance to its field so it can be accessed imperatively elsewhere.
|
||||
field.draftailEditor = draftailEditor;
|
||||
};
|
||||
|
||||
export default {
|
||||
initEditor,
|
||||
registerPlugin,
|
||||
};
|
||||
|
|
|
@ -1,7 +1,5 @@
|
|||
import {
|
||||
import draftail, {
|
||||
wrapWagtailIcon,
|
||||
initEditor,
|
||||
registry,
|
||||
ModalWorkflowSource,
|
||||
Link,
|
||||
Document,
|
||||
|
@ -21,7 +19,7 @@ describe('Draftail', () => {
|
|||
field.value = 'null';
|
||||
document.body.appendChild(field);
|
||||
|
||||
initEditor('test', {});
|
||||
draftail.initEditor('test', {});
|
||||
|
||||
expect(field.draftailEditor).toBeDefined();
|
||||
});
|
||||
|
@ -32,7 +30,7 @@ describe('Draftail', () => {
|
|||
field.value = 'null';
|
||||
document.body.appendChild(field);
|
||||
|
||||
initEditor('test', {});
|
||||
draftail.initEditor('test', {});
|
||||
|
||||
field.draftailEditor.saveState();
|
||||
|
||||
|
@ -45,13 +43,13 @@ describe('Draftail', () => {
|
|||
field.value = 'null';
|
||||
document.body.appendChild(field);
|
||||
|
||||
registry.registerPlugin({
|
||||
draftail.registerPlugin({
|
||||
type: 'IMAGE',
|
||||
source: () => {},
|
||||
block: () => {},
|
||||
});
|
||||
|
||||
initEditor('test', {
|
||||
draftail.initEditor('test', {
|
||||
entityTypes: [
|
||||
{ type: 'IMAGE' },
|
||||
],
|
||||
|
@ -78,7 +76,20 @@ describe('Draftail', () => {
|
|||
});
|
||||
});
|
||||
|
||||
it('#registry', () => expect(registry).toBeDefined());
|
||||
describe('#registerPlugin', () => {
|
||||
it('works', () => {
|
||||
const plugin = {
|
||||
type: 'TEST',
|
||||
source: null,
|
||||
decorator: null,
|
||||
};
|
||||
|
||||
expect(draftail.registerPlugin(plugin)).toMatchObject({
|
||||
TEST: plugin,
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
it('#ModalWorkflowSource', () => expect(ModalWorkflowSource).toBeDefined());
|
||||
it('#Link', () => expect(Link).toBeDefined());
|
||||
it('#Document', () => expect(Document).toBeDefined());
|
||||
|
|
|
@ -1,14 +0,0 @@
|
|||
const plugins = {};
|
||||
|
||||
const registerPlugin = (plugin) => {
|
||||
plugins[plugin.type] = plugin;
|
||||
|
||||
return plugins;
|
||||
};
|
||||
|
||||
const getPlugin = (type) => plugins[type];
|
||||
|
||||
export default {
|
||||
registerPlugin,
|
||||
getPlugin,
|
||||
};
|
|
@ -1,15 +0,0 @@
|
|||
import registry from './registry';
|
||||
|
||||
describe('registry', () => {
|
||||
it('works', () => {
|
||||
const plugin = {
|
||||
type: 'TEST',
|
||||
source: null,
|
||||
decorator: null,
|
||||
};
|
||||
|
||||
expect(registry.getPlugin('TEST')).not.toBeDefined();
|
||||
registry.registerPlugin(plugin);
|
||||
expect(registry.getPlugin('TEST')).toBe(plugin);
|
||||
});
|
||||
});
|
|
@ -1,6 +1,4 @@
|
|||
import {
|
||||
initEditor,
|
||||
registry,
|
||||
import draftail, {
|
||||
ModalWorkflowSource,
|
||||
Link,
|
||||
Document,
|
||||
|
@ -11,10 +9,8 @@ import {
|
|||
/**
|
||||
* Entry point loaded when the Draftail editor is in use.
|
||||
*/
|
||||
const draftail = registry;
|
||||
|
||||
// Expose Draftail as a global, with the initEditor function.
|
||||
draftail.initEditor = initEditor;
|
||||
// Expose module as a global.
|
||||
window.draftail = draftail;
|
||||
|
||||
// Plugins for the built-in entities.
|
||||
|
|
|
@ -6,9 +6,6 @@ describe('draftail.entry', () => {
|
|||
});
|
||||
|
||||
it('has defaults registered', () => {
|
||||
expect(window.draftail.getPlugin('LINK')).toBeDefined();
|
||||
expect(window.draftail.getPlugin('DOCUMENT')).toBeDefined();
|
||||
expect(window.draftail.getPlugin('IMAGE')).toBeDefined();
|
||||
expect(window.draftail.getPlugin('EMBED')).toBeDefined();
|
||||
expect(Object.keys(window.draftail.registerPlugin({}))).toEqual(["DOCUMENT", "LINK", "IMAGE", "EMBED", "undefined"]);
|
||||
});
|
||||
});
|
||||
|
|
Ładowanie…
Reference in New Issue