IE11 - Issues with contenteditable

[kein-b]

In IE11

1. The @ mention only works fine on the 1st mention, succeeding mentions will no longer trigger.
2. Moving the cursor on the beginning of the mention will make the whole element unresponsive to input.

These bugs can be replicated on the demo page and our app which uses version 3.6.0 https://zurb.github.io/tribute/example/

Issue 1

Issue 2

[ashwin1014]

i'm facing this issue too. Does not work on typing '@' for the second time. Below is a video showing the issue. Tested version 3.6.0. & 3.5.3 ZURB Tribute _ Demo - Internet Explorer 2019-03-05 14-28-21.zip

[pleunv]

Running into the same issue. Slowly trying to figure out (man, IE debugging is awful) and I'm running into a weird quirk with window.getSelection() in IE10/IE11. The first time it gets triggered in a paragraph it returns the text node as anchorNode, as it should... However, upon any subsequent triggers it returns the parent HTMLParagraphElement instead which in its textContent also contains the previous tribute element's <span> in addition to the second trigger char, i.e. "John Doe @" instead of just " @", breaking all further trigger parsing.

I'm honestly not really sure how to fix this.

[pleunv]

Funnily enough, if you add an empty html element at the end of your selectTemplate it seems to work around the issue and window.getSelection() goes back to selecting the text node in IE. Something like

selectTemplate: `<span class="fr-deletable fr-tribute">${item.original.name}</span><span />`

[Coru89]

@ashwin1014 @pleunv - i'm facing this issue as well. Did either of you get this sorted? The workaround doesnt seem to work for me.

[pleunv]

Still using my workaround mentioned above I'm afraid.