Search code examples
javascriptjquerygoogle-chrome-extensionopenai-api

Writing a character by keyPress in the textarea by JavaScript or jQuery (permission to send a message on chat.openai.com via Google Chrome extension)


I'm creating a Google Chrome extension that writes a message to a textarea on https://chat.openai.com/

I can put text in the textarea, but I don't have the option to send this text.

It looks like it might help if the character was inserted into the textarea via KeyPress (I can also use jQuery).

For some reasons I need to use this via Google Chrome extension and I can't use the OpenAI API.


This JavaScript can put the text to the textarea:

document.getElementById('prompt-textarea').value = 'test';

text is inserted into the textarea, but I don't see any option to send this message with JavaScript - the send button is disabled.

If I have this textarea focused and type any character on the real keyboard, the button will stop being disabled and the message can be sent by JavaScript

document.getElementById('__next').getElementsByClassName('md:bottom-3')[0].click();

This is working well, but I need to not have to press any key on real keyboard.

It is not enough if I remove the disabled attribute with JavaScript

document.getElementById('__next').getElementsByClassName('md:bottom-3')[0].removeAttribute('disabled');

The button now appears to be clickable, but the message is not sent when clicked, still needs to be pressed key on keyboard.


As a possible solution I am looking for, is to trigger an event as if some key on a real keyboard was pressed, which would really add a character to the textarea.

I tried e.g. JavaScript

document.getElementById('prompt-textarea').dispatchEvent(new KeyboardEvent('keypress',{'key':'a'}));

or jQuery

jQuery('#prompt-textarea').trigger({ type: 'keydown', which: 77 });

but it didn't work - the character is not added to the textarea. Can someone please advise?


Solution

  • Thanks to user wOxxOm, he found a solution, using document.execCommand - I can just use this JavaScript and it works well:

    document.getElementById('prompt-textarea').focus();
    document.execCommand('insertText', false, 'test');
    

    Instead of 'test', can using a variable containing the entire text for the textarea (prompt for OpenAI).