2.0.2 • Published 9 years ago

dom-paste v2.0.2

Weekly downloads
2
License
MIT
Repository
github
Last release
9 years ago

dom-paste

Retrieve the clipboard content as an HTMLElement on a paste event.

Usage

domPaste(event, callback)

var domPaste = require('dom-paste');

// ...

el.addEventListener('paste', function(e) {
  domPaste(e, function(content) {
    // do something with content
  });
}, false)

Where el is a content-editable HTMLElement, and content is the returned HTMLElement containing the pasted content. The callback function is called asynchronously.

Implementation Details

A temporary contenteditable element is created, and the input focus is shifted to it. A MutationObserver is used to detect changes on the temporary element's DOM. This temporary element is then passed to the callback. Due to the async nature of the MutationObserver API, the callback is always fired asynchronously. The temporary element is kept in the document until the callback returns, so that .getComputedStyle() calls can be made on its contents. After the callback returns, it's removed from the document automatically.

Compability

OS XLinuxWindowsAndroidiOS
SafariOK---Untested
ChromeOKUntestedUntestedUntestedUntested
FirefoxPartialUntestedUntestedUntested-
OperaOKUntestedUntestedUntested-
IE 11--Untested--
IE 10--Untested--
IE 9--Untested--

More extensive compability info will be available soon

Remarks

  • On Firefox for OS X pasting works but only results in plain text. This is actually a browser limitation/bug, and happens on all contenteditable text fields.
  • The DOM structure produced by different browsers on paste varies wildly. This module does not attempt to do any sort of normalization.