nhn / tui.editor

🍞📝 Markdown WYSIWYG Editor. GFM Standard + Chart & UML Extensible.
http://ui.toast.com/tui-editor
MIT License
17.09k stars 1.73k forks source link

Widget syntax is not unwrapped in markdown in WYSIWYG mode #2663

Open mib112 opened 2 years ago

mib112 commented 2 years ago

Describe the bug

If you use a widget in WYSIWYG mode and then check the markdown using getMarkdown, you can see that the widget syntax is included in the markdown.

To Reproduce

Steps to reproduce the behavior:

  1. In WYSIWYG mode, use a Widget https://github.com/nhn/tui.editor/blob/master/docs/en/widget.md
  2. check the markdown using getMarkdown
  3. markdown will contain $$widgetN ... $$

Expected behavior

Widget syntax should be unwrapped in WYSIWYG mode.

Screenshots

Bildschirmfoto 2022-08-08 um 13 54 12 Bildschirmfoto 2022-08-08 um 13 54 32

Desktop (please complete the following information):

markusbrunner-design commented 2 years ago

Steps to reproduce for a default @username behaviour:

    let mentionRule = /(?<before>^|\s+)@(?<username>[a-z]+)(?<after>\s+)/;
    let ownWidgetRules = [
        {
            rule: mentionRule,
            toDOM(text) {
                const rule = mentionRule ;
                const matched = text.match(rule).groups;
                const mentionContainer = document.createElement('span');
                mentionContainer.innerHTML = (matched.before
                                                + '<a href="https://some-domain/profiles/people/'
                                                + matched.username + '" data-username="'
                                                + matched.username + '">@'
                                                + matched.username + '</a>' + matched.after);
                return mentionContainer;
            },
        },
    ];
// add them in tui-editor options with => widgetRules: ownWidgetRules,

It's in general very buggy if you move the cursor! Sometimes it gets replaced and other times not!

But if you change to markdown and then back to WYSIWYG you always will get this content: $$widget0 @usernamegiven $$

renderer-problems

juanpbarani commented 1 year ago

Hi, is there any news regarding this? Or a workaround to avoid having those $$widget text? Thanks!

paddy1905 commented 6 months ago

Hey, I have exactly the same problem. In WYSIWYG mode editor#getMarkdown returns the $$ widget $$ wrapper. In MARKDOWN mode this problem does not occur. It is really annoying. Could you please check that?

Thanks in advance, Patrick