Opened 6 months ago

Closed 6 months ago

Last modified 4 months ago

#16847 closed New Feature (fixed)

Inline styles from clipboard data transfer when pasting from Word

Reported by: Marek Lewandowski Owned by: Tomasz Jakut
Priority: Normal Milestone: CKEditor 4.7.0
Component: Plugin : Paste from Word Version: 4.7.0
Keywords: Cc:

Description (last modified by Marek Lewandowski)

While serializing to HTML, Word inlines styles to some elements, while leaving classes in others.

A style element that contains all the styles for a given selector is put in html > head element of text/html clipboard which is currently not pasted into CKEditor.

What we need to do here is to make sure that we check text/html dataTransfer to check for these style elements, and inline them into matched elements.

One thing to keep in mind that we don't want to inline mso- specific styles. At the end it's fine for us to inline even unknown css, as it will get stripped by ACF after processing.

Change History (9)

comment:1 Changed 6 months ago by Marek Lewandowski

Status: newconfirmed

comment:2 Changed 6 months ago by Tomasz Jakut

Owner: set to Tomasz Jakut
Status: confirmedassigned

comment:3 Changed 6 months ago by Tomasz Jakut

The feature is working, however some tests are still failing:

The first test seems to fail due to changes in HTML markup that are made by using native DOMParser. The second test needs more investigation.

The main changes made in this ticket are:

  • introduction of second parameter to CKEDITOR.plugins.clipboard.dataTransfer.getData that allows to fetch the original pasted HTML (full HTML, not stripped to body only)
  • adding CKEDITOR.plugins.pastefromord.inlineStyles that parses pasted HTML using native DOMParser, fetches all style tags and rewrite them to [style] attributes for appropriate elements.

Current WIP is on branch:t/16847.

comment:4 Changed 6 months ago by Marek Lewandowski

Some early review feedback:

  • text/html datatransfer content in fixtures looks good, but we need to reorganize it.

As you see the datatransfer is exact same for every browser and it makes sense, because it's Word which is setting the clipboard, and browser has only to provide API to access it.

  • Change tests/plugins/pastefromword/manual/inlinestyles.md manual test explicitly be based on provided docx fixture and reference it's path in the manual test description. Also provide precise repro steps, use this missing Verdana font paragraph which is a subject of issue discussion.
  • There's some garbage leaked to the end of pasted content, when pasting in Chrome from InlineStyles.docx:

https://i.imgur.com/abxExQN.png

Surprisingly I can't repro it on Firefox.

From what I have seen, this garbage is added by the Chrome itself, even though clipboard held by OS is fine - so it's clearly a Chrome fault. You can see it in tests/plugins/pastefromword/generated/_fixtures/InlineStyles/word2013/chrome.html.

It's even weirder because it occurs... randomly :D I saw that it happens if I had a lot of plain text in clipboard, and copied content from Word after this? Can't tell exactly.

I've also did minor docs updates, changes were pushed to the branch.

  • docs updates,
  • added docx fixtures generated on Windows,
  • added liststyle, htmlwriter plugins to the manual test
    • without liststyle Roman numbering were not preserved,
    • htmlwriter plugin for source button output readability.

comment:5 Changed 6 months ago by Tomasz Jakut

Status: assignedreview

The inliner is implemented and enabled in browsers that support custom data types via dataTransfer. Also tests are updated. Pushed to branch:t/16847-nbsp.

comment:6 Changed 6 months ago by Marek Lewandowski

Status: reviewreview_failed

Good job! We're almost there!

Pushed a minor change to the branch.

comment:7 Changed 6 months ago by Marek Lewandowski

Resolution: fixed
Status: review_failedclosed

LGTM merged to major with git:e8afc33cd.

comment:8 Changed 6 months ago by Marek Lewandowski

Description: modified (diff)

comment:9 Changed 4 months ago by Marek Lewandowski

Summary: Pick styles from clipboard data transfer when pasting from WordInline styles from clipboard data transfer when pasting from Word
Note: See TracTickets for help on using tickets.
© 2003 – 2017 CKSource – Frederico Knabben. All rights reserved. | Terms of use | Privacy policy