Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
log paste and copy event payloads

image

I have this saved as a snippet in DevTools. I then run it on about:blank

document.body.innerHTML = 'Paste or drop items onto this page. View results in console.';
function getPayload(item) {
const kind = item.kind;
switch (kind) {
case 'string': return new Promise(res => item.getAsString(res));
case 'file': return Promise.resolve(item.getAsFile());
default: throw new Error('unknown item kind! ' + kind);
}
}
function logObj(type, obj){
console.log(`%c ${type} event`, 'font-weight: bold', new Date().toLocaleTimeString());
const getPayloadAndType = item => {
const type = item.type;
return getPayload(item).then(payload => ({type, payload}));
};
Array.from(obj.items)
.sort((a,b) => a.type.localeCompare(b.type))
.forEach(item => Promise.resolve().then(_ => getPayloadAndType(item)).then(console.log));
}
document.onpaste = e => { logObj(e.type, e.clipboardData)};
document.ondrop = e => { e.preventDefault(); logObj(e.type, e.dataTransfer)};
document.ondragover = e => { e.preventDefault(); };
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment