Internet Explorer 11 hides picker when scrollbar is clicked

[christophersandmann]

In IE 11 the on-blur event is called when a user clicks the scrollbar of the picker.

This will hide the picker if option "hidePickerOnBlur" is true.

Open this fiddle (forked from the demo-fiddle) in IE 11 to reproduce the issue.

[carpii]

I spent a bit of time on this

It seems to be an annoying bug in IE11.. when you click the scrollbar, it transfers input focus to the body tag, and then the scrollArea which causes the emojipicker to blur, and close.

The only solution I could find was to handle closing the picker myself, and setting

hidePickerOnBlur: false

Here's a routine to reopen the picker, when focus is transferred to the scrollArea. It results in some flickering as the emojiPicker is closed and then instantly reopened, but its the best I could come up with

var area = elem.data("emojioneArea");
    if ($(area).scrollArea !== undefined){
        $(area).scrollArea.on("focus", function(evt) { elem.data("emojioneArea").showPicker(); });
    }