Open
Bug 1395951
Opened 7 years ago
Updated 2 years ago
Pasting from clipboard into text-areas is broken for multi-line strings
Categories
(Core :: DOM: Editor, enhancement, P3)
Core
DOM: Editor
Tracking
()
NEW
People
(Reporter: TheOne, Unassigned)
References
()
Details
Having a 'contenteditable' textarea and invoking `document.execCommand("paste")` causes a multi-line text in the clipboard to get pasted without any newlines.
Looking at the DOM, it seems like we're replacing newlines by '<br>' and then inject it as a DOMElement, which doesn't work for textareas.
See URL for an example you can play around with. Just load it as a temporary extension.
Reporter | ||
Comment 1•7 years ago
|
||
I should note that the add-on linked in the URL only works as expected because of https://github.com/wagnerand/open-multiple-addresses/blob/read/popup.js#L34: 'textArea.value = textArea.innerHTML.replace(/<br>/g, "\n");'
Comment 3•7 years ago
|
||
Looks like the ever-growing list of bugs with clipboard.
The unique situation with WebExtensions is that document.execCommand("paste") can be called by extensions that have the clipboardRead permission.
A way to show the buggy behavior on the web is:
data:text/html;charset=utf8,
<input type=button onclick="out.focus();document.execCommand('insertText',false,'multi\nline\ntext');console.log(out.innerHTML)" value="Add multi-line string to contentEditable textarea">
<textarea contenteditable id=out></textarea>
To read the text without \n -> <br> conversion within an extension with the "clipboardRead" permission, use the "paste" event, e.g. as done in https://bugzilla.mozilla.org/show_bug.cgi?id=1344410#c12
Component: WebExtensions: Untriaged → Editor
Flags: needinfo?(rob)
Product: Toolkit → Core
Comment 4•7 years ago
|
||
use \r\n instead of \n for workaround
Updated•7 years ago
|
Priority: P2 → P3
Comment 5•7 years ago
|
||
Also, we need to check each browser compatibility for this for <br> or \n
Comment 6•7 years ago
|
||
(In reply to Andreas Wagner [:TheOne] [use NI] from comment #1)
> I should note that the add-on linked in the URL only works as expected
> because of
> https://github.com/wagnerand/open-multiple-addresses/blob/read/popup.js#L34:
> 'textArea.value = textArea.innerHTML.replace(/<br>/g, "\n");'
text.innerHTML shouldn't return currnet value data although I ask to WHATWG about textarea.innerHTML's behavior. See https://github.com/whatwg/html/issues/3034. Why do you use textarea.innerHTML for current value?
Flags: needinfo?(awagner)
Reporter | ||
Comment 7•7 years ago
|
||
Hm, I am not sure I follow all of this. I believe the reason I used textarea.innerHTML was so I could actually see where the newlines are and then replace <br> by \n.
> To read the text without \n -> <br> conversion within an extension with the "clipboardRead" permission, use the "paste" event, e.g. as done in https://bugzilla.mozilla.org/show_bug.cgi?id=1344410#c12
I am not sure this solves my problem. I don't want to capture the paste event, I want to trigger the paste.
Flags: needinfo?(awagner)
Comment 8•7 years ago
|
||
(In reply to Andreas Wagner [:TheOne] [use NI] from comment #7)
> > To read the text without \n -> <br> conversion within an extension with the "clipboardRead" permission, use the "paste" event, e.g. as done in https://bugzilla.mozilla.org/show_bug.cgi?id=1344410#c12
>
> I am not sure this solves my problem. I don't want to capture the paste
> event, I want to trigger the paste.
You want to read from the clipboard, and to do so you used execCommand("paste") + reading from a contentEditable textarea.
That has bugs, so to access untransformed clipboard data, you can use execCommand("paste") + "paste" event (and read the paste data from event.clipboardData.getData).
Reporter | ||
Comment 9•7 years ago
|
||
(In reply to Rob Wu [:robwu] from comment #8)
> You want to read from the clipboard, and to do so you used
> execCommand("paste") + reading from a contentEditable textarea.
> That has bugs, so to access untransformed clipboard data, you can use
> execCommand("paste") + "paste" event (and read the paste data from
> event.clipboardData.getData).
I am not sure how this is any better than my current workaround (comment 1), since your suggestion also pastes the clipboard into the (visible) textarea and cleans it up afterwards.
Comment 10•7 years ago
|
||
(In reply to Andreas Wagner [:TheOne] [use NI] from comment #9)
> (In reply to Rob Wu [:robwu] from comment #8)
> > You want to read from the clipboard, and to do so you used
> > execCommand("paste") + reading from a contentEditable textarea.
> > That has bugs, so to access untransformed clipboard data, you can use
> > execCommand("paste") + "paste" event (and read the paste data from
> > event.clipboardData.getData).
>
> I am not sure how this is any better than my current workaround (comment 1),
> since your suggestion also pastes the clipboard into the (visible) textarea
> and cleans it up afterwards.
With onpaste you can surely read unmodified data, and with event.preventDefault() you won't even have to "clean up" anything since the document is not modified. And currently you and I know that newlines are broken, but maybe there are even other characters that are unknowingly modified.
Comment 11•6 years ago
|
||
Would this exploit take advantage of this? https://github.com/Aaronmsv/PastejackingProtection
PoC https://security.love/Pastejacking/
Updated•2 years ago
|
Severity: normal → S3
You need to log in
before you can comment on or make changes to this bug.
Description
•