The Wiert Corner – irregular stream of stuff

Jeroen W. Pluimers on .NET, C#, Delphi, databases, and personal interests

  • My badges

  • Twitter Updates

  • My Flickr Stream

  • Pages

  • All categories

  • Enter your email address to subscribe to this blog and receive notifications of new posts by email.

    Join 4,225 other subscribers

google chrome devtools – Use JavaScript to set value of textbox when .value and events don’t seem to work – Stack Overflow

Posted by jpluimers on 2022/11/29

For my link archive: [Wayback/Archive] google chrome devtools – Use JavaScript to set value of textbox when .value and events don’t seem to work – Stack Overflow

TL;DR

Sometimes fields are blocked from pasting values.

Normally a trick like this works in the chrome development panel console:

document.getElementById('nonPasteElementID').value = 'myValueFromTheClipboard'

With some web development environments this does not work.

For react, after finding the react render name for the input (in the case of the answer, it was “reactNameForInputElement“) this is a solution:

To make it work you will need this:

const input = document.getElementById('nonPasteElementID');
const event = new Event('reactNameForInputElement', { bubbles: true });
input.value = '1';
input.dispatchEvent(event);

–jeroen

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.

 
%d bloggers like this: