Ckeditor5: Font highlight not working when paste from word file.

Created on 26 May 2020  ·  12Comments  ·  Source: ckeditor/ckeditor5

📝 Provide detailed reproduction steps (if any)

  1. Take word file.
  2. Highlight some text using the "Text Highlight Color" form word toolbar save the file.
  3. Paste the word file data into the CKEdior5

✔️ Expected result

_What is the expected result of the above steps?_
I have expected that it will paste the same highlighted text in the editor.

❌ Actual result

_What is the actual result of the above steps?_
It simply adds plane text with no styling.

📃 Other details

  • Browser:Crome
  • OS: Windows 10
  • CKEditor version: 5
  • Installed CKEditor plugins: "Document editor"

If you'd like to see this fixed sooner, add a 👍 reaction to this post.
OK

feedback duplicate bug

Most helpful comment

I checked it with the file you provided and here are my findings - pasting with highlight works, but only with specific plugin combinations:

  • fontBackgroundColor + tableProperties = works
  • fontBackgroundColor + tableProperties + pasteFromOffice = doesn't work
  • fontBackgroundColor + pasteFromOffice = doesn't work
  • fontBackgroundColor = doesn't work

( I'm using Word 365 MSO 16.0.12730.20252 )

@ankitcodefarm would you be so kind to check and confirm this?

All 12 comments

yes sir
I have seen this page and but the style lost when i paste if from the word file.
here is the file
I have try this file on the Ckeditor5 demo on live server it's also not showing the styling of the word file.

All font styling getting lost.
Try this word file
https://easyupload.io/6n4xyv

I checked it with the file you provided and here are my findings - pasting with highlight works, but only with specific plugin combinations:

  • fontBackgroundColor + tableProperties = works
  • fontBackgroundColor + tableProperties + pasteFromOffice = doesn't work
  • fontBackgroundColor + pasteFromOffice = doesn't work
  • fontBackgroundColor = doesn't work

( I'm using Word 365 MSO 16.0.12730.20252 )

@ankitcodefarm would you be so kind to check and confirm this?

hi @FilipTokarski thanks you sir for the comment
I am working on this since last week and
yes I will check and confirm as you derived here in the comment.

Hi @FilipTokarski
Still the issue is there.
I have check at my side I have removed "pasteFromOffice" Plugins form my "ckeditor.js" but still I did not get the stying back when I paste.

I am using (Microsoft Word 2010)
This below is how the "fontBackgroundColor + tableProperties" added in my "ckeditor.js"

import TableProperties from '@ckeditor/ckeditor5-table/src/tableproperties';
import FontBackgroundColor from '@ckeditor/ckeditor5-font/src/fontbackgroundcolor.js';

I have also added this issue on StackOverflow
I added my complete code there.

https://stackoverflow.com/questions/62036441/ckeditor-5-removes-the-text-styling-when-paste-from-word-file

That's strange. For me, if I remove pasteFromOffice and leave tableProperties + fontBackgroundColor, rebuild the editor, pasting with highlight works 100%. Maybe it's a case of different MS Word version.
Anyway, the issue is confirmed - pasting highlight doesn't work with PFO plugin enabled.

Thanks guys! Let's merge this into #7275.

hi @FilipTokarski after removing pasteFromOffice the other styling issue came up like all font get the same size
font size styling is lost, header and other text looks same
in inspect it showing only p tag for every text

can you help me with this?

Unfortunately until pasteFromOffice is fixed, there will be some trade-off when using it. Without it you will lose ability to paste preserved content from Word, but with it you can stumble upon some highlight and table background color bugs. Also please bear in mind that PFO is not always 100% accurate when pasting content, so I guess the decision how to use it is now up to you.

Hello @FilipTokarski & @Reinmar
Sorry if I am interrupting you guys.
it's my kind request to you guys that if your team found any solution to this issue, please let me know or tag me here so I get notification from GIT.

Hi @ankitcodefarm! We're already on this issue, PR with fix is on review - #7313.

Was this page helpful?
0 / 5 - 0 ratings