Problems with execCommand justification in Firefox?

I am creating a very simple WYSWIG editor for div s contenteditable = "true". I use execCommandfor simple formatting, for example, bold, italics and underline along with text alignment.

PROBLEM: Bold, italics, underline everything, but using justifyCenter(or any excuse) doesn't work in Firefox, but works in Chrome and Safari. Chrome and Safari don't seem to like my justifyRight, but they work just fine with justifyLeft and justifyCenter. In Firefox, I get the following:

uncaught exception: [Exception ... "Returned component failure code: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMNSHTMLDocument.execCommand]" nsresult: "0x80004005 (NS_ERROR_FAILURE)"

I can’t understand what’s wrong, but I wonder if this could have something to do with the designMode that should be installed in Firefox? However, bold, italics and underline work fine, without me designMode is explicitly included.

Any ideas? Thanks in advance.

+3
source share
2 answers

I know this kind of like a late answer, and you probably already understood that, but for those who haven't, try setting contenteditable to true for the body. I’m trying to find a way around this, because every browser justifies the text without it, and I don’t want the whole page to be edited.

+1
source

: https://bugzilla.mozilla.org/show_bug.cgi?id=442186 - :

try
{
    document.execCommand('justifyright', false, null);
}
catch (e)
{
    //special case for Mozilla Bug #442186
    if(e && e.result == 2147500037)
    {
        //probably firefox bug 442186 - workaround
        var range = window.getSelection().getRangeAt(0);
        var dummy = document.createElement('br');

        //find node with contentEditable
        var ceNode = range.startContainer.parentNode;
        while(ceNode && ceNode.contentEditable != 'true')
            ceNode = ceNode.parentNode;

        if(!ceNode)
            throw 'Selected node is not editable!';

        ceNode.insertBefore(dummy, ceNode.childNodes[0]);
        document.execCommand('justifyright', false, null);
        dummy.parentNode.removeChild(dummy);
    }
    else if(console && console.log)
        console.log(e);
}

(a <br />) justify *.

+1

Source: https://habr.com/ru/post/1754703/


All Articles