BUG:

GrapesJS version

• I confirm to use the latest version of GrapesJS

What browser are you using?

92.0.4515.131 (Official Build) (64-bit)

Reproducible demo link

N/A

Describe the bug

How to reproduce the bug?

1. Insert HTML into canvas using the editor.Canvas.getBody().ownerDocument.execCommand('insertHTML', false, HTMLString) command.
2. the inserted HTML does show up on the editor canvas.
3. Use the editor's editor.getHtml() function.
4. The returned HTML string by editor.getHtml() does not contain the HTML that was inserted using the execCommand command.

What is the expected behavior? The final HTML should return HTML inserted using execCommand

What is the current behavior? The final HTML does not contain HTML inserted using execCommand

If is necessary to execute some code in order to reproduce the bug, paste it here below:

another issue with the first approach listed below is that editor.addComponent() adds the component to the end of the DOM and the insertHTML command inserts the html of that component into the current cursor position.

const [varEl] = editor.addComponents(
            '<span class="am-var no-tooltip" data-gjs-editable="false" data-gjs-droppable="false" data-gjs-selectable="false" data-am-var="' +
                key +
                '" style="white-space:nowrap; padding: 1%; font-size: inherit; margin: 1% 2%; cursor: pointer;">' +
                variable +
                '</span>'
        );

editor.Canvas.getBody().ownerDocument.execCommand(
            'insertHTML',
            false,
            `&nbsp;${varEl.toHTML()}&nbsp;`
        );

editor.getHtml()

I have also tried adding an HTML string instead of the component.toHTML() approach mentioned above like so which doesn't work either:

editor.Canvas.getBody().ownerDocument.execCommand(
        'insertHTML',
        false,
        '&nbsp;<span class="am-var no-tooltip" data-gjs-editable="false" data-gjs-droppable="false" data-gjs-selectable="false" data-am-var="' +
                key +
                '" style="white-space:nowrap; padding: 1%; font-size: inherit; margin: 1% 2%; cursor: pointer;">' +
                variable +
                '</span>&nbsp;'
)

Code of Conduct

• I agree to follow this project's Code of Conduct