search

layerssss / paste.js

read image/text data from clipboard (cross-browser)
http://layerssss.github.io/paste.js/
MIT License
463 stars 94 forks source link

pasting image on firefox not working with editable content that is not contenteditable #28

Closed chessychev closed 7 years ago

chessychev commented 8 years ago

i want to be able to paste to a big container div. the container is not editable itself, but has both editable and non editable sub elements. i'm using the pastableContenteditable(). on chrome it works perfectly, but on firefox pasting images to this div only works if i add 'contenteditable' to the container div (which i don't want to add, since it modifies the container's look and behaviour). example in the attached fiddle. using pastableNonInputable() enables pasting perfectly on both browsers, but of course makes the inputables unusable because the focus is always applied back to the container.

https://jsfiddle.net/yaruok/r34rfgaj/

chessychev commented 8 years ago

perhaps related https://bugzilla.mozilla.org/show_bug.cgi?id=891247

layerssss commented 8 years ago

@chessychev Hmm, that's a user-case I haven't thought about. Will do some work on it next week.

layerssss commented 8 years ago

@chessychev Thanks for forwarding me the bugzilla link, it looks like they're going to ship something to make it much easier. That'll be good, because currently, paste.js is using some seriously tangled and unstable hack for FF.

layerssss commented 8 years ago

Hi @chessychev now I made it possible for you to call pasteNonInputable on the parent container without destroying any inner elements' functionality. You can preview it here: ✨

https://jsfiddle.net/layerssss/yo05ugn4/

As noted in this example, if you want the pasting working on any inner textarea, you have to call pastableTextarea on it again.

chessychev commented 8 years ago

@layerssss hi, first of all thanks. in my app and in your fiddle it seems to work, except for selecting text. now when you mark text, it get deselected on mouse up (onmouseup). it possible to copy the text for example if you ctrl+c before onmouseup, but i can't assume the average user of my app will do it. should i open a new issue for that?

btw, pastableTextarea doesn't make the textarea pastable (though it does in your jsfiddle), but that's less of an issue.

layerssss commented 8 years ago

Ah first, good catch! I'm reopening the issue...

But I think we can't avoid that, since we have to steal the focus / selection and put into a [cententeditable] element to make image pasting work, even on Chrome!

Can I suggest that you disable the selection on all static text using user-select: none;? to make it consistent.

I havn't pushed a release yesterday, I'll push one now.

layerssss commented 8 years ago

We can leave this issue open until you have you stuff working, before that just let me know I'll help.

chessychev commented 8 years ago

it's alright, we just don't support firefox at the moment.