TinyMce adding long <div id="mouseposition... tags

Question

I am very recently having an issue with tinymce adding div tags into everything it's enabled on. This is entering a lot of characters into our database that is not necessary and sometimes it exceeds the maximum characters, and will not allow users to enter information.

The information being entered is:

important test  <div id="mouseposition-extension-element-full-container" style="position: fixed; top: 0px; left: 0px; right: 0px; bottom: 0px; pointer-events: none; z-index: 2147483647; font-weight: 400;">  <div id="mouseposition-extension-element-rect-display" style="display: none; position: absolute; background: rgba(255, 255, 255, 0.7); outline: black solid 1px; font-size: 12px; z-index: 2147483647; justify-content: center; align-items: center; user-select: none; cursor: default; color: #000000; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; width: 0px; height: 0px;">  <pre style="flex: 1 1 0%; text-align: center; background-color: rgba(255, 255, 255, 0.7); color: #000000; min-width: 42px; min-height: 12px; transition: all 1s ease 0s;">&nbsp;</pre>  </div>  <pre id="mouseposition-extension-element-coordinate-display" style="position: absolute; display: none; background: #ffffff; font-size: 12px; line-height: 14px; border-radius: 3px; border-width: 1px; border-color: #222222 black #333333; border-style: solid; padding: 3px; z-index: 2147483647; color: #222222; user-select: none; cursor: default; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;">&nbsp;</pre>  </div>

This is a very recent issue, and to my knowledge no changes were made to the site. This is happening on every page tinymce is enabled, and it started sometime recently, as in the past hour. User's were entering things fine, and the next minute I'm getting calls about it not working. My question is how do I remove this div tag? I feel it is also important to note that on tinymce if I view the source code, an option available on the editor itself, that it does show all of that div information.

My tinymce initialization is:

<script type="text/javascript">
        tinymce.init({
          mode : "textareas",

            force_br_newlines : false,
            force_p_newlines : false,
            forced_root_block : false,
        selector: 'textarea',
    plugins: [
    "advlist autolink lists charmap print preview anchor",
    "searchreplace visualblocks code fullscreen",
    "insertdatetime contextmenu paste save"
  ],
    toolbar: "bullist numlist",
     statusbar: false,
     setup: function (ed) {
        ed.on('change', function () {
            ed.save();
        });
    }
    });
</script>

Which again, has worked fine until very recently. I use the same initialization on the few pages that use it.

The picture is of the source code, as viewed from the toolbar of tinymce. The important test text at the top is what I have entered into the text area. tinymce editor source code

Are you including TinyMCE from an online source that is not version-specific, such as Tiny's own CDN? That would explain why this issue only popped up very recently. Say, for example, 5.0.15 worked, and the latest 5.0.16 produces this issue - then their CDN (specific only to major version changes) would cause this issue, whereas something like CDNJS you could specifically select 5.0.15, or downloading it to your server. — zbee
@zbee It is linked via a folder on the server. So unfortunately that is not the case here. Thank you for the reply! — KJ Work
Oh ... that is very odd that the behavior changed then by itself - if there is version control for your code, I would look into that. Obviously an answer including an API setting that allowed you to fix this would solve the issue, but reverting a breaking change such as this would be even easier. — zbee
Small update, I have found that this issue only happens on Chrome. It does not occur on Firefox or Edge. — KJ Work

Connor Whalen Connor Whalen · Accepted Answer · 2019-10-24T16:30:28

I encountered this issue today, for me the culprit was the Coordinates chrome extension. I'm not sure if there's a workaround that lets you keep using the extension, but turning it off fixed this issue for me.

TinyMce adding long <div id="mouseposition... tags

1 Answers