10

What I am trying to do

I am currently writing a little chat bot for Web-Whatsapp. I decided to use a chrome extension because of the easy js-injection. There is a voice-message button which switches to a button for sending text as you start typing something. React deletes the voice-message element and renders the send button.

The Problem

This whole process is event driven. I am setting the Text through DOM which does not trigger the react event. I tried to simulate a keypress but it seems like chrome´s v8 disabled all ways to simulate keypresses for security reasons. I also tried to manipulate the HTML a bit but react stopped working after i made changes to the Elements. I also tried the jQuery function for that but that didn't work either.

References to things that didn't help:

Keydown Simulation in Chrome fires normally but not the correct key

https://api.jquery.com/keypress/

The Question

Is there any way to force React firing the event? Or any kind of workaround for this?

Community
  • 1
  • 1
mstorm
  • 245
  • 2
  • 13
  • Yes, you can't _really_ simulate a keypress because it wouldn't be a DOM trusted event (user initiated). I think one possible avenue would be to hook on bluebird promises themselves in the system and intercept calls - I'm not sure react lets you do this. (Of course, you can also modify react itself - but I'm not sure I'd walk that avenue). – Benjamin Gruenbaum May 11 '15 at 09:16
  • I assume you already tried things like `TestUtils.Simulate.change` right? – Benjamin Gruenbaum May 11 '15 at 09:17
  • Hey, which Plugin do you use? have you thought about manually firing the event? – Anders Anderson May 12 '15 at 08:20
  • None, I am writing the Plugin myself. The bot IS the plugin. Thats what i meant by I use a Chrome extension. Its pretty easy to inject JS over a chrome extension, like a 2 minute job. – mstorm May 12 '15 at 09:46
  • Ok, so i maybe asked in the wrong form, what extension do you use? – Anders Anderson May 12 '15 at 11:26
  • You asked in the right form. I am writing the extension myself. Bot = Extension. – mstorm May 12 '15 at 11:31
  • https://developer.chrome.com/extensions/content_scripts i used a content script in a extension to write the bot. – mstorm May 12 '15 at 11:34
  • if you would know what happens in the background, you could possibly set the right parameters... – Anders Anderson May 12 '15 at 12:09

5 Answers5

3

"Solution" After two days of research I have to admit that this is obviously not possible on the way I tried it for security reasons. If you ever get into the same situation like me you shouldn´t waste time on trying to fix this, rather than just looking for a good workaround. I will update mine for the WebWhatsapp-bot here if i figured it out.

mstorm
  • 245
  • 2
  • 13
1

use the following library

1.https://github.com/dwachss/bililiteRange/blob/master/bililiteRange.js 2.https://github.com/dwachss/bililiteRange/blob/master/jquery.sendkeys.js

load (paste in console) this js script in chrome console in following sequence

1.load jquery.js

2.load bililiteRange.js

3.load jquery.sendkeys.js

Now you can send the text to the Whatsapp input box like this example: 

var input_op=jQuery("#main div.pluggable-input-body.copyable-text.selectable-text");
input_op.sendkeys("hello");

for stimulating the Click event on send button do this :

function triggerMouseEvent(node, eventType) {

    var clickEvent = document.createEvent('MouseEvents');
    clickEvent.initEvent(eventType, true, true);
    node.dispatchEvent(clickEvent);
}

var d = document.querySelector("#main span[data-icon="send"]");
triggerMouseEvent(d, "click"); //stimulate mouse event in chrome

Done

MAhipal Singh
  • 4,745
  • 1
  • 42
  • 57
Renati
  • 56
  • 8
0

Chrome won't allow any page to simulate keypress but you can do it with external application. Java is the best for such stuff. From your page request the server to request the Java application to do the keypress for you. chrome doesn't block keypress from the robot class in Java. Here is a video showing Robot class typing text into a webpage. I can help you with the Java(Processing) if you want.

  • Java is the evil, imho.. I would prefer writing it in vbscript rather than java, but your solution is just a workaround anyways. Doesn´t "solve" the problem itself. But thanks for your suggestion. – mstorm May 12 '15 at 09:50
  • I dont think any browser would allow that! If that would be possible all ads would be click on themselves automatically... :p –  May 12 '15 at 12:27
  • I could easily do it with a workaround but that wouldn´t be as clean and as beautiful as a pure javascript injected bot, if you know what i mean. – mstorm May 12 '15 at 12:51
  • U could test in a really old version of IE or netscape navigator... That MAYNOT filter bot clicks but idk if whatsapp comes with protection from bots –  May 12 '15 at 13:53
0

In the past when I've needed to attempt to simulate keypresses from as high a level as I'm allowed to in Javascript, I've taken inspiration from the brilliant gremlins.js. The way they get their typer gremlins to type is the following (taken from src/species/typer.js):

// Create a generic event
var myEvent = document.createEventObject ?
    document.createEventObject() :
    document.createEvent("Events");

// 'init' the event as a keypress
myEvent.initEvent('keypress', true, true);

// Fill in details
myEvent.keyCode = key;
myEvent.which = key;
myEvent.keyCodeVal = key;

// Fire it on your target
targetElement.dispatchEvent ?
    targetElement.dispatchEvent(myEvent) :
    targetElement.fireEvent('on' + eventType, myEvent);

It's quite sneaky, and in the past has got past a few restrictions for me, you might give it a try.

Jack Preston
  • 3,824
  • 1
  • 11
  • 8
0

Try these two things right after you inject the text:

  1. create a Range around the text you entered, and then:

range.startContainer.dispatchEvent(new Event('input', { bubbles: true, cancelable: false }));

  1. document.dispatchEvent(new MouseEvent('mouseup', { bubbles: true, cancelable: true }));
Nathan B
  • 1,625
  • 1
  • 17
  • 15