Firefox: execCommand throughs NS_ERROR_FAILURE when used with angular

[josefromsanjose]

this.options.ownerDocument.execCommand throws an NS_ERROR_FAILURE when wrapped in an angular wrapper whenexecActionInternal() is called for the ordered and unordered list buttons.

It causes some weird behavior that duplicates the medium editor element's parent node several times.

Example: before:

<div class="parent">
<p medium-editor class="medium-editor">I am an editor and the p tag is my editor element</p>
<div>Some sibling element</div>
</div>

after:

<div class="parent">
<p medium-editor class="medium-editor">I am an editor and the p tag is my editor element</p>
</div>
<div class="parent">
<div>Some sibling element</div>
</div>

Anyone have any idea that is and if there is a solution. It works fine as long as it is not used with Angular.

This is only an issue in Firefox.

[kkulikowski]

hello @josefromsanjose, did you figure it out? I have the same issue and nothing i had in mind works..

[josefromsanjose]

Hi @kkulikowski, no I didn't, at least with this project. I ended up creating my own directive because I need a bit more than this project offers. I found that this is an issue when there is not initial html tags inside the element that is the editor. We solved it by making sure it was always initialized with a paragraph tag.

If you look at the source code around line 27.

I changed this

ngModel.$render = function() {
          ngModel.editor.setContent(ngModel.$viewValue || "");
          var placeholder = ngModel.editor.getExtensionByName('placeholder');
          if (placeholder) {
            placeholder.updatePlaceholder(iElement[0]);
 }

To this:

ngModel.$render = function() {
          ngModel.editor.setContent(ngModel.$viewValue || "<p></p>");
          var placeholder = ngModel.editor.getExtensionByName('placeholder');
          if (placeholder) {
            placeholder.updatePlaceholder(iElement[0]);
 }

Try that and see if it helps. Firefox in general doesn't seem to work well with Medium Editor and adding Angular to the mix didn't seem to help.