javascript enter event doesn't work on google

Question

I'm trying to simulate an 'enter' keypress with javascript for automation.

var script = document.createElement('script');
script.src = 'https://code.jquery.com/jquery-1.10.2.min.js';
script.type = 'text/javascript';
document.body.appendChild(script);
var e = jQuery.Event("keypress");
e.which = 13; //choose the one you want
e.keyCode = 13;

This is the code used to setup the key event (I've tried keydown and keyup as well).

This doesn't seem to work when searching Google. If I type some text and trigger the event on the input field $("[name=q]").trigger(e) nothing happens.

I'm using google to test simulating a "proper" enter event. I hope to use js to automate skype web client.

Does anyone know if it is possible to simulate an actual enter keypress using javascript? I've seen that Selenide's pressEnter() works but it uses webdriver so maybe it's not relevant.

I've also tried native js event triggering

var dispatchKeyboardEvent = function(target, initKeyboradEvent_args) {
  var e = document.createEvent("KeyboardEvents");
  e.initKeyboardEvent.apply(e, Array.prototype.slice.call(arguments, 1));
  target.dispatchEvent(e);
};

dispatchKeyboardEvent($("[name=q]"), 'keypress', true, true, null, 'h', 13, '');

sidenote I am aware that query can be submitted by calling .submit() on the element but that's not what I'm after.

Nothing happens? I'd expect the error console to complain that jQuery wasn't defined. (Unless it was already defined before you ran the script, in which case the first four lines are pointless). — Quentin, Jul 20 '15 at 12:17
Not sure what that means. I have not added any eventlisteners using jquery. — Bobbzorzen, Jul 20 '15 at 12:27
@Bobbzorzen I've already worked on this and found nothing, the only thing this can do is fire the listeners that are already bounded, but this will not fire the real keyevent. — Hacketo, Jul 21 '15 at 09:57
@Hacketo Do you know of any way to get a comprehensive list of the bound listeners on a page/element? all the code is minified and the listeners tab on chrome doesn't make any sence at all to me. — Bobbzorzen, Jul 21 '15 at 11:47
@Bobbzorzen To retrieve an array of click listeners you can do `$._data( $("body")[0], "events" )["click"]` . Each listener object has a `handler` property, and you can do `aListener.handler.toString()` to get the string representation of the function — Hacketo, Jul 21 '15 at 13:21
Similar issue solved at: http://stackoverflow.com/questions/832059/definitive-way-to-trigger-keypress-events-with-jquery However, if your issue is explicitly concerned with Google search page/process, consider editing the question. — Sarath Chandra, Jul 21 '15 at 19:47
@SarathChandra As described in my question that method does not work to actually simulate a key press. My question is related to simulate keypresses in a similar way that selenium does using the webdrivers since that actually seems to simulate it in the same way as a real keypress. Hope i explained that ok. — Bobbzorzen, Jul 22 '15 at 06:39
@Bobbzorzen: It depends on the element you want to trigger. You are trying to simulate the behaviour of the webdriver here.. not just that of a key press. So, your listener should be bound like the webdriver. You function should be that keypress event. — Sarath Chandra, Jul 22 '15 at 07:42

score 1 · Answer 1 · edited May 23 '17 at 11:58

1

As you are referencing document in code, the code should execute when dom is ready.

The event trigger code should execute when the jQuery is loaded, thus write the code in script.onload callback.

As mentioned here, attach the callback before appending the script element to document.body, and also before assigning src to script element.

Working demo : jsFiddle

edited May 23 '17 at 11:58

Community

1
1

answered Jul 21 '15 at 06:41

Ashwin Aggarwal

649
8
21

Not sure if i'm missing something but the dispatch of the event is done manually by me after the jquery script is loaded. I also tested your example on google.com and although the event listner applied with your code is triggered the browser did not register the enter key and perform the search. – Bobbzorzen Jul 21 '15 at 09:42
Because of security reasons browsers do not allow elements to fake events. But you can use [sendKeys](http://bililite.com/blog/2015/01/14/rethinking-fn-sendkeys/), its a jQuery plugin to send events. – Ashwin Aggarwal Jul 21 '15 at 11:46
Tried it, doesn't work. Works the same as the default keyevent dispatch described in original post. thanks for the tip though – Bobbzorzen Jul 21 '15 at 11:59

score 1 · Answer 2 · edited May 23 '17 at 11:51

1

If your code sets the search query string in a single shot, listen for the on change event of the field and call the function.

$("#searchBarId").on("change", function(){
    var e = jQuery.Event("keydown");
    e.which = 13; // # Enter key code value
    $("input").trigger(e)
});

Answer from Definitive way to trigger keypress events with jQuery

Does this solve your issue ?

edited May 23 '17 at 11:51

Community

1
1

answered Jul 22 '15 at 15:13

Sarath Chandra

1,850
19
40

Unfortunately no, as described in my question I've already tried this method of sending events and it does not work. – Bobbzorzen Jul 23 '15 at 07:17

score 0 · Answer 3 · answered Jul 22 '15 at 11:12

0

<select id="ss">
    <option value="1">1</option>
    <option value="2">2</option>
 </select>  

$('#ss').keypress(function(e){
     var p = e.keyCode;
    alert(p);
     if(p==13){
         alert('enter was pressed');
     }
 });

answered Jul 22 '15 at 11:12

Hemanth chalamalasetti

89
5

As mentioned before, i'm not looking for a way to listen for events, i'm looking for a way to simulate events in a realistic way like the events triggered by selenide using webdrivers. thanks anyway though – Bobbzorzen Jul 22 '15 at 13:37

javascript enter event doesn't work on google

3 Answers3