Wysiwyg-editor: svg tags are being removed on html.insert

[CrazyClicker]

Hello there!

I'm using Katex to build formulas and created small plugin for that, but I faced a problem when froala removes svg tags from an inserted code.

My settings for allowed tags:

htmlAllowedTags: ['.*'],
htmlRemoveTags: ['script', 'style', 'base'],

I've tried to list svg tag in htmlAllowedTags, but it didn't help. What did helped me is

htmlUntouched: true,

But I'm not really sure I want to remain all code untouched. The goal is only to keep svg tags.

Here is the code generated by katex https://pastebin.com/K0QPcmJr

Expected behavior.

svg tags are in place

Actual behavior.

svg tags are removed

Steps to reproduce the problem.

pass html code from pastebin above to editor.html.insert method.

OS.

OSX

Browser.

Chrome

[stefanneculai]

@CrazyClicker could you please make a jsFiddle?

[CrazyClicker]

I was able to fix problem with combination of htmlAllowedTags and htmlAllowedEmptyTags while preparing fiddle.

Sorry for bothering you. Thanks!

[andrewkolos]

@CrazyClicker Could you share your configuration? I also happen to be trying to create a katex plugin, but svg and path tags keep getting removed even after I added them to htmlAllowedTags. This is causing fraction bars and square root symbols to not render correctly.

update: JSFiddle: https://jsfiddle.net/p6fuyz4L/3/

[andrewkolos]

Solved my issue. Added path and line to htmlAllowedEmptyTags in my fiddle. Config below should work:

let config = {
        htmlAllowedEmptyTags: ['textarea', 'a', 'iframe', 'object', 'video', 'style', 'script', '.fa', 'span', 'p', 'path', 'line'],
        htmlAllowedTags: ['.*'],
        htmlAllowedAttrs: ['.*'],
        htmlRemoveTags: ['script']
      };
$(function() {
        $('textarea').froalaEditor(config);
});

If any part of the equation is not rendering, check for missing tags in the resulting markup. Make sure they are included in htmlAllowedTags and htmlAllowedEmptyTags.

edit: formatting