Cannot get text out of a paste event in Firefox

Question

I'm trying to develop a function that can manipulate pasted text before it reaches the textbox.

My current issue is that no data is gathered when this code is ran in Firefox.

document.getElementById("myTextBox").addEventListener('paste', (e) => {
    console.log(e.clipboardData.getData('text')) 
  });

From my testing this only works in Chrome and Edge. In Firefox it returns a empty string.

My Firefox version is 115.02 (64bit)

I have also viewed most of the questions on Stack Overflow that pertain to this question.

Ive tried bitwise OR'ing like this (window.clipboardData||e.clipboardData)

This didnt work on Firefox either.

EDIT:

Thanks to all those that answered but none of the solutions work so I will be attaching a codepen to recreate the issue

https://codepen.io/Jimmy-Gore/pen/VwVmzVV?editors=1111

This pen demonstrates the issue, as no text will show up in the console.

https://stackoverflow.com/questions/2176861/javascript-get-clipboard-data-on-paste-event-cross-browser — epascarello, Jul 13 '23 at 16:40

MfyDev · Answer 1 · 2023-07-13T16:15:29.427

0

Try OR again, but with switched values:

document.getElementById("myTextBox").addEventListener('paste', (e) => {
    console.log((e.clipboardData || window.clipboardData).getData('text')) 
});

Hope this helps!

edited Jul 13 '23 at 16:15

answered Jul 13 '23 at 16:14

MfyDev

439
1
12

Could you look at the recent edit in which I attached a Code Pen to demonstrate the issue. – jgore200377 Jul 13 '23 at 17:16

score 0 · Answer 2 · answered Jul 17 '23 at 15:58

0

Try attaching the event listener to window object instead of the actual element:

window.addEventListener('paste', e => {
    console.log((e.clipboardData || window.clipboardData).getData('text')) 
});

answered Jul 17 '23 at 15:58

MfyDev

439
1
12

Cannot get text out of a paste event in Firefox

2 Answers2