I'm using jodit-react, and have noticed that when toggling on 'source' view, it runs the cleanHTML plugin, which deletes things like empty <span> tags.
In the docs for the underlying Jodit library, it appears easy to set the specific tags that cleanHTML will allow: https://xdsoft.net/jodit/docs/modules/plugins_clean_html.html
I'm trying to figure out how I can do this in the react wrapper. Has anyone got any idea?
I tried disabling the cleanHtml plugin all together and it stopped deleting the empty elements, but I don't want to disable it if I don't have to.
This is my code:
const EditorConvertToHTML: React.FC<editorConvertToHTMLProps> = ({
myRef,
value,
onHandleChange,
fieldName,
index,
}) => {
const toolbarButtons = [
"bold",
"ul",
"source"
];
const config: IJoditEditorProps["config"] = {
readonly: false,
buttonsMD: toolbarButtons,
};
return useMemo(
() => (
<div>
<JoditEditor
ref={myRef}
value={value || ""}
config={config}
onChange={(newContent) => {
onHandleChange(fieldName)(newContent, index);
}}
/>
</div>
),
[]
);
};
I tried this but it didn't work:
{
name: "source",
cleanHTML: {
allowTags: { span: true },
},
}