Blur event dispatched when pasting with forcePlainText or cleanPastedHTML

[apptaro]

Description

Set either forcePlainText or cleanPastedHTML to be true, then pasting something dispatches blur event. This is because focus is temporarily moved to pastebin during pasting, and the pastebin is not considered the extension's interaction element.

Steps to reproduce

1. Create an editor with either forcePlainText: true or cleanPastedHTML: true
2. Add a blur event handler.
3. Paste something to see a blur event has been dispatched.

Expected behavior: Blur event should not be dispatched.

Actual behavior: Blur event is dispatched.

Link to an example: https://jsfiddle.net/apptaro/cL2h3n2m/

Versions

• medium-editor: 5.23.1
• browser: Chrome 60.0.3112.78
• OS: Windows 7

[j0k3r]

then pasting something dispatches blur event

And it should not?

[apptaro]

And it should not. From the documentation,

blur is triggered whenever a contenteditable element within an editor has lost focus to an element other than an editor maintained element (ie Toolbar, Anchor Preview, etc)

When pasting something, focus is temporarily moved to the pasteBin element, which is an editor maintained element.

[dcsaszar]

See #1166 and #1213

[moteey]

If anyone is still struggling with this, I found a way to check if blur and/or focus events are dispatched due to pasting:

Blur event:

MediumEditor.subscribe('blur', blurFunction)

function blurFunction (data) {
  if (data.srcElement && data.srcElement.innerText === '%ME_PASTEBIN%') {
    // Blur event was dispatched due to pasting
  }
}

Focus event:

MediumEditor.subscribe('focus', focusFunction)

function focusFunction (data) {
  if (data.relatedTarget && data.relatedTarget.innerText === '%ME_PASTEBIN%') {
    // Focus event was dispatched due to pasting
  }
}

[ghidoras]

@moteey That didn't work for me in the following scenario:

const inst = new MediumEditor(...)
inst.subscribe('editableBlur', function (event, editable) {
        if (event?.srcElement.innerText === '%ME_PASTEBIN%') {
           // innerText here is empty
        }
});

then pasting something dispatches blur event

And it should not?

Looking at my example just above, if you have an empty input for a "comment reply" scenario, which should cancel the replying mode on blur (when no text added), when pasting something it will actually cancel replying, which shouldn't. That's my use case. And weirdly enough, it fires the blur before paste when pasting with CTRL + V but not from "right click => paste".