Redactor: blur event causing errors

Question

I am using redactor for a text editor on a laravel project.

Whenever the editor is on the page, and is initialized, I get this error whenever I click anywhere.

Uncaught TypeError: $(...).closest(...).size is not a function(…)  
Uncaught TypeError: $current.closest(...).size is not a function(…) 

This is fired whenever I type in the editor, or just click anywhere on the page. The editor is getting initialized fine, and is working fine. I'm not sure why it's complaining about the blur event.

This is how I am initializing it:

$('#myInput').redactor({
        'buttons': ['html', 'formatting', 'bold', 'italic', 'unorderedlist', 'orderedlist', 'link'],
        'placeholder': 'Comments...'
    });

It looks like this is one of the parts that is not happy:

$(document).on('mousedown.redactor-blur.'+this.uuid,

I'm using Redactor 10.2.5

Thank you for any suggestions!

Answer 1

I'm using Redactor 10.2.2 but I got similar error after upgrading jquery version (2.x -> 3.x).

I think that there is some conflict with jquery version 3 and the below 2 lines:

line 1463:    if ($(e.target).closest('.redactor-editor, .redactor-toolbar, .redactor-dropdown').size() !== 0)
line 6913:    if ($current.closest(element).size() > 0)

should modified

line 1463:    if ($(e.target).closest('.redactor-editor, .redactor-toolbar, .redactor-dropdown').length !== 0)
line 6913:    if ($current.closest(element).length > 0)

for Reactor 10.2.5.

I hope this may help you.

Answer 2

I think this solution would be better

$(function() {
    $.fn.size = function() {
        return this.length;
    }
});

You don't have to change vendor so you won't have to deal with changes every time you install your app somewhere.