Word Style Tags Appear on paste - Only in Firefox on a Mac

[Steven]

We have a strange issue where when we copy and paste from Word to the Telerik Editor (2018.3.910.45) using Firefox on a Mac (running 12.4). that the editor inserts a large <style> tag with a font face element inside. See Attached Screenshot. This is only the case when using a Mac and Firefox. I can recreate the issue on the Telerik Demo page. https://demos.telerik.com/aspnet-ajax/editor/examples/cleaningwordformatting/defaultcs.aspx

 

Any thoughts on how to fix this would be most appreciated. Thanks! We tried utilizing the ConvertFontToSpan and ConvertInLineStylesToAttributes options in the content filter.

[Rumen]

Can you set the StripFormattingOptions property to "MSWordRemoveAll,Css" and test again? The Css setting will strip the <style> tag on paste.

If this does not solve the problem, can you please provide the Word file so that I can test it on my side?

[Steven]

Yes. Attached are the screenshots of the "clean" text that show a large font face style chunk of code. I also attached the word document via a onedrive link. This again only happens in Firefox on my Mac. It does not happen with chrome.

Training Example Word Document.docx

[Rumen]

Hi Steven,

Thank you for the provided detailed information which helped me reproduce the reported issue.

To fix it, I suggest attaching to the OnClientPasteHtrml client event of RadEditor and strip the style tag as shown below:

    <script type="text/javascript">
        function OnClientPasteHtml(sender, args) {
            var commandName = args.get_commandName();
            var value = args.get_value();

            if (commandName == "Paste") {
                        

                value = value.replace(/<style((.|\\n|\\r)*?)<\/style>/gi, ""); //strip the style tag with a regular expression
                args.set_value(value);  //set the modified content in the editor
            }
        }
    </script>
    <telerik:RadEditor runat="server" StripFormattingOptions="MSWordRemoveAll,Css" OnClientPasteHtml="OnClientPasteHtml">
        <Content>
        </Content>
    </telerik:RadEditor>

Please test and let me know how it goes.

 

Regards,
Rumen
Progress Telerik

[Steven]

Hi Rumen,

Thanks so much for this response. We were able to implement this but unfortunately we are still getting a huge style code chunk when we paste in using the paste from word, or when we paste in directly.  Again, this seemingly only happens on Firefox on Mac.

[Rumen]

Hi Steven,

It looks like that for some reason the /<style((.|\\n|\\r)*?)<\/style>/gi regular expression does not strip the style tag that you get on MAC.

My advice is to:

• Approach one: put a debugger inside the OnClientPasteHtml function and
  • verify that the function is executed
  • use a regular expression to match and strip this style tag on your own
• or strip the style tag when submitting the content using a custom content filter or inside the OnClientSubmit event of RadEditor.