Handle pasting from different sources

[mtias]

We are adding a paste.js to Block API files in @iseulde #1331.

This will be the place to centralize the handling of content being pasted from different sources (WordPress, markdown, google docs, word, pages, etc). The intention is to convert things that are pasted into proper blocks with proper attributes.

Related: #1180, #1423.

[youknowriad]

related #589 #590 since it could be used to convert existing posts?

[nic-bertino]

We discussed detection of embeddable content through paste in #1325. The simple idea being that if an Instagram URL is pasted in the editor of one block, the UI would suggest creating a new embed block with that content. Let me know if that's outside of the scope of this issue.

[jasmussen]

Added @georgeh also, per his request, as he's worked on some pasting on WordPress.com in the past. George feel free to unassign yourself if this, up on closer inspection, isn't up your alley after all.

[jasmussen]

We should also split this ticket up into one for pasting from Word, one for pasting from Google Docs.

[georgeh]

This isn't really up my alley but I'm eager to go down new allies. I may try to rope @nosolosw into this too, since he worked on some paste-detection in Calypso.

It seems that #1524 went a long way toward improving pasting. In testing Google Docs and Pages, they both keep the structure but lose some formatting. I'm AFK for the next week but when I get back will dig into it more deeply. If there's a more urgent need or someone else wants to pick this up while I'm away, feel free. Otherwise I'll move from tinkering to a more earnest strategy the week of the 17th.

[ellatrix]

Been talking to @georgeh a bit, and this seems like a good flow:

• We'd have general processors and specific processors. Running a specific processor would rule out the others, e.g. we don't run both Google Docs and Word specific processors.
• On the content, we run a test functions that the specific processors have. Here they look for clues to detect the paste source. Ideally this should just be some .test() or .indexOf().
• We run the special processor (no others). They should prepare for the general processor. In other words, the should return a semantic structure from a strange source specific structure.
• We run the general processors which will clean up attributes (strip IDs, classes, styles), and turn the semantic structure into blocks.

[ellatrix]

Unassigning as @georgeh is working on the Google Docs part, and possibly the API part. Afterwards I'd be interested in making a MarkDown processor. I'm also willing to take over at any point.

[georgeh]

Many of the blocks I've tested with Google Docs have worked correctly. The exceptions are:

1. <tbody> tags seems to break TinyMCE - I don't think this is G Docs specific but would be nice to fix
2. Paragraph alignment is not showing up in the copied data
3. Images are appearing in the copied data

So what does work? Paragraphs, headings, and lists create the blocks you would expect.

I have a pipeline system for processing transformations, and they provide a solid hook for future transformations such as markdown, stripping classes, etc. I'll get a PR in to deal with the basics and we can iterate from there.

[mtias]

Closing this one as a first pass. We can create individual issues from now on for remaining pieces and improvements.