mirror of
https://github.com/BookStackApp/BookStack.git
synced 2025-05-09 02:20:09 +00:00
Ensured wysiwyg details contents are wrapped in block elements
Fixes issue where inline-only content would disappear when unwrapping a details block element.
This commit is contained in:
parent
a9ee2e6889
commit
f86bb27a83
3 changed files with 37 additions and 5 deletions
resources/js/wysiwyg
|
@ -235,7 +235,7 @@ export function build(options) {
|
||||||
"-doc-root[doc-root|#text]",
|
"-doc-root[doc-root|#text]",
|
||||||
"-li[details]",
|
"-li[details]",
|
||||||
"+code-block[pre]",
|
"+code-block[pre]",
|
||||||
"+doc-root[code-block]"
|
"+doc-root[p|h1|h2|h3|h4|h5|h6|blockquote|code-block|div]"
|
||||||
].join(','),
|
].join(','),
|
||||||
plugins: gatherPlugins(options),
|
plugins: gatherPlugins(options),
|
||||||
contextmenu: false,
|
contextmenu: false,
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
* @param {Editor} editor
|
* @param {Editor} editor
|
||||||
* @param {String} url
|
* @param {String} url
|
||||||
*/
|
*/
|
||||||
|
import {blockElementTypes} from "./util";
|
||||||
|
|
||||||
function register(editor, url) {
|
function register(editor, url) {
|
||||||
|
|
||||||
|
@ -217,14 +218,26 @@ function ensureDetailsWrappedInEditable(detailsEl) {
|
||||||
unwrapDetailsEditable(detailsEl);
|
unwrapDetailsEditable(detailsEl);
|
||||||
|
|
||||||
detailsEl.attr('contenteditable', 'false');
|
detailsEl.attr('contenteditable', 'false');
|
||||||
const wrap = tinymce.html.Node.create('doc-root', {contenteditable: 'true'});
|
const rootWrap = tinymce.html.Node.create('doc-root', {contenteditable: 'true'});
|
||||||
|
let previousBlockWrap = null;
|
||||||
|
|
||||||
for (const child of detailsEl.children()) {
|
for (const child of detailsEl.children()) {
|
||||||
if (child.name !== 'summary') {
|
if (child.name === 'summary') continue;
|
||||||
wrap.append(child);
|
const isBlock = blockElementTypes.includes(child.name);
|
||||||
|
|
||||||
|
if (!isBlock) {
|
||||||
|
if (!previousBlockWrap) {
|
||||||
|
previousBlockWrap = tinymce.html.Node.create('p');
|
||||||
|
rootWrap.append(previousBlockWrap);
|
||||||
|
}
|
||||||
|
previousBlockWrap.append(child);
|
||||||
|
} else {
|
||||||
|
rootWrap.append(child);
|
||||||
|
previousBlockWrap = null;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
detailsEl.append(wrap);
|
detailsEl.append(rootWrap);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
19
resources/js/wysiwyg/util.js
Normal file
19
resources/js/wysiwyg/util.js
Normal file
|
@ -0,0 +1,19 @@
|
||||||
|
|
||||||
|
|
||||||
|
export const blockElementTypes = [
|
||||||
|
'p',
|
||||||
|
'h1',
|
||||||
|
'h2',
|
||||||
|
'h3',
|
||||||
|
'h4',
|
||||||
|
'h5',
|
||||||
|
'h6',
|
||||||
|
'div',
|
||||||
|
'blockquote',
|
||||||
|
'pre',
|
||||||
|
'code-block',
|
||||||
|
'details',
|
||||||
|
'ul',
|
||||||
|
'ol',
|
||||||
|
'table'
|
||||||
|
];
|
Loading…
Add table
Add a link
Reference in a new issue