HtmlEditor crashes when pasting from Word

[Anspitzen]

Describe the bug
When pasting a slightly bit more rows from a Word Document into a HtmlEditor the app/browsertab will go into deadlock

To Reproduce
Steps to reproduce the behavior:
Have a slightly larger Word document. Not big, just more than 2 pages. I set it up the following:

1. I took the Source code of the RadzenHtmlEditor.razor.cs file. (the first 60 Lines were enough to get a significant lag of the whole UI, double and it did not react anymore, or only after several minutes blocking the whole App)

2. Copy it to an empty word file. Like mentioned, 60 Lines are already heavy impact. In Word that is about 2(.5) pages

3. Copy the resulting content of the word file to clipboard (CTRL+A; CTRL+C)

4. Go to Demo

5. Paste the contents of the Word document into the Editor

6. App locks and not even F5 does clear it.

Expected behavior
The app doesn't lock and the text gets pasted

Desktop (please complete the following information):

• Browser chrome

Additional context
Not even F5 is helping, the app is still in deadlock for the whole tab. You have to close the tab (so browser is terminating everything) and reopen the tab to get a refresh

[akorchev]

If you are using server rendering mode you would hit the SignalR default payload threshold. Can't do much to avoid that I am afraid.

[Anspitzen]

I know of the 32kB Signal R limit. And on interactive I would get a disconnect from websocket. But that happens even with just one Word copied from the word file. That I have tested on an interactive server render.

But the demo is not limited to that 32kB limit as far as I know. There does pasting a single word from a word file work. But not really more. And even 32kB are more than enough to send the whole word file with the full code block of the editor (27kB) which is about 7 times as much as I try on copy with the first 60 lines/2 pages.

[akorchev]

You can debug the paste handler - there isn't anything much done there really. It just sends it via interop to Blazor and then inserts the HTML returned.

[akorchev]

I cannot reproduce this behavior with the online demo and pasting the complete source of RadzenHtmlEditor.razor.cs. It does take some time due to the sheer size of payload (64kb) but it completes. Here is a screen recording of my experience.

[Anspitzen]

[akorchev]

The problem seems to occur because of the size of the pasted content. It is too much to transfer via JS interop. I don't think we can do anything to mitigate that.

[Anspitzen]

Expanding on in, in case someone else is searching for it:
Copy from Outlook also crashes a "normal" configured blazor app when pasting into the Html Editor
Copy from Excel, OneNote and PowerPoint does work though.

On Word and Outlook you get by calling e.clipboardData.getData("text/html") a full html markup with references to xml formats and your recent file list, some logic (litterally if statements for markup) etc. Basically you copy the markup for the WebApp of Word also to the text. And that is a lot more than 32kB. So the SignalR connection gets closed and blazor reinitializes the connection

When calling to getData("text") of text/plain you get the text you copied.

The Html-Editor calls first for HTML markup from pasted content, then the plaintext as fallback. That seems to be for getting the formating (the color, font size and weight etc) for your copied text.

So you paste more than just your text when copying from Word or Outlook

[Anspitzen]

Same does happen when posting a picture into the editor without an upload url.
There it will be converted to base64 and get to a size to crash the connection really fast. 320x170px png is already too big! base64 does increase file size by ~30%. So limit would be about 24kB file size for pictures.