Developer tools · HTML WYSIWYG editor
What Happens When You Paste from Word or Google Docs into a Web Editor
· How it works
html contenteditable text-cleanup
Explains what rich-text pastes carry, from mso- styles to wrapper elements and font stacks, and shows how to read the resulting markup before it reaches your site.
It looked fine in Word — opens with a pasted article whose spacing and fonts fight the site design
A paragraph copied from a word processor can look polished at the source and arrive with fonts, spacing and wrappers that conflict with a site. ToolAcre does not preserve that presentation wholesale. Its paste listener intercepts the operation before original rich markup is inserted and chooses a filtered representation instead.
The important evidence is the source view, not whether the first visual impression resembles the original document. The editor is intentionally narrow: headings, paragraphs, emphasis, lists, quotations, code-like elements and links can survive, while layout containers, class names, ids and inline style attributes do not belong to its output contract.
The clipboard carries more than text — explains that a rich-text copy includes an HTML flavour alongside plain text
A clipboard can expose `text/html` and `text/plain` for one copy operation. The handler asks for both. When an HTML payload exists, it sanitizes that string and inserts the rewritten fragment with `insertHTML`; only when rich HTML is absent does it insert the plain payload with `insertText`.
That precedence is code-proven for this panel, not a universal statement about every application. It explains why a rich paste can keep a list while losing its appearance. The source application wrote the clipboard HTML, but ToolAcre’s allowlist decides which portion is admitted to the editable surface.
What this editor removes from rich paste: unsupported elements, attributes and comments
Unsupported elements are handled in two ways. Unknown ordinary wrappers are unwrapped so their words remain, while script, style, iframe, form, SVG, MathML and other risky or non-editor containers are removed together with their contents. Comments and doctypes are also discarded rather than carried into the draft.
Attributes face a second gate. Class, id, style, data attributes and every event handler are removed because allowed attributes are named per element. This means source-specific class names and inline presentation cannot fight the destination stylesheet after ToolAcre has filtered the paste, although useful source styling may disappear too.
Why source-specific wrappers and styles do not survive the allowlist
The repository does not provide captured Word or Google Docs fixtures, so this article does not invent exact `mso-` classes, internal ids or wrapper sequences for particular releases. It can state the consequence proved by the allowlist: classes and styles are removed regardless of which source application supplied them.
That source-agnostic rule is stronger editorial guidance than a brittle catalog. Inspect the removal notice after pasting. It records unique reasons such as an unsupported wrapper, forbidden attribute or rejected URL. The report tells you what this implementation discarded without pretending to identify the application that originally generated every fragment.
Worked example: paste three paragraphs and read the filtered markup
Copy three short paragraphs, making the middle sentence bold and the last one a list. After pasting, switch to source mode. Paragraph, strong, ul and li elements are within the allowlist, while surrounding divs are unwrapped and style attributes disappear. Legacy b and i tags normalize to strong and em.
Now add an unsafe event attribute in a disposable source sample and return to visual mode. The attribute is removed before that source becomes DOM. This demonstrates an editing boundary, not safe publication of hostile submissions. The project explicitly warns about parser differentials and requires a suitable server-side sanitizer for untrusted content.
Plain-text paste is used only when the clipboard supplies no HTML flavour
Plain-text insertion is a fallback, not a user-selectable “paste without formatting” command in this toolbar. If the clipboard provides HTML, ToolAcre takes that branch. A browser or operating-system shortcut may expose a plain-only paste, but the repository does not define or promise specific shortcut behavior.
When only text is available, `insertText` asks the browser to place those characters at the caret. Any paragraph structure subsequently created remains subject to browser editing behavior. Use the source view to add deliberate headings or lists rather than assuming line breaks from another application automatically become the structure your CMS expects.
What this does not cover — automatic clean-up rules, CMS-specific paste filters or preserving tracked changes
This workflow does not preserve tracked changes, comments, page layout, fonts, colors, tables or images. Images are deliberately absent because an allowed image creates an outbound request and an error-handler surface. The editor also has no source-specific cleanup profile or switch that promises fidelity to one office suite.
Pasting locally does not prove the final destination will accept the same subset. A CMS may strip more tags, rewrite links or enforce its own policy. Compare the editor output with destination documentation, and keep an original copy when losing unsupported formatting would remove information rather than mere presentation.
Takeaway: look before you publish — summarises the inspection habit and how ToolAcre's HTML WYSIWYG editor lets you paste locally and see the markup before it goes anywhere
Look before publishing: paste a representative, non-sensitive fragment, read the removal warning, examine source, and preview the filtered result. ToolAcre gives one explicit allowlist rather than silently carrying foreign presentation into your site. That makes cleanup visible, but it does not certify arbitrary HTML as safe.
If essential structure vanished, rebuild it with supported headings, paragraphs, lists, emphasis and links. If the target accepts less, simplify further there. The correct artifact is not the closest visual imitation of the source document; it is reviewed markup whose meaning and destination policy are both understood.