Why my dispatchEvent works for mouse events but not key events

Question

I am thinking about making a Firefox add-on of my own and doing some experiments for the functionality I might be adding in it.

As I am just checking the feasibility of things for now, I just got a skeleton created from Mozilla add-on builder and started working in it. What I am trying right now is to send mouse click or key press events.

I have tried the available ways to send event but somehow it's not working for key events

I tried it using dispatchEvent:

onMenuItemCommand: function(e) {  

    netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect');


    var evt1 = document.createEvent("MouseEvents");
    evt1.initMouseEvent("click", true, true, window,
        0, 0, 0, 0, 0, false, false, false, false, 0, null);

    //it's returning me null for document.getElementById... so I changed it.
    var cb1 =  gBrowser.selectedBrowser.contentDocument.getElementById("strict");
    var canceled1 = !cb1.dispatchEvent(evt1);


    var evt = document.createEvent("KeyEvents");
    evt.initKeyEvent("keydown", true, false, window,
                 false, false, false, false, 0x42, 0);
    var cb =  gBrowser.selectedBrowser.contentDocument.getElementById("filter"); 
    var canceled = !cb.dispatchEvent(evt);
    if(canceled) 
    {
        // A handler called preventDefault
        alert("canceled");
    } 
    else 
    {
        // None of the handlers called preventDefault
        alert("not canceled");
    }       
}

When I tried this code in Firefox, it did updated the checkbox which means click event worked, but nothing happened in textbox where I was expecting it to print a character. But it showed alert box with "not Cancelled" proving that event was not cancelled!

As event was not cancelled, I decided to put a keypressed handler on window.document... and it got invoked when add-on send these events! Which means the events are getting generated and are bubbling as well.

Then why only mouse events are working and key events are not? Am I missing something here?

(I have also tried sendKeyEvent with nsIDOMWindowUtils. still had no luck with it.)

btw, I am using Firefox 3.6.15 with Gecko :1.9.2.15

Have you tried using the same document consistently, that is, `gBrowser.selectedBrowser.contentDocument.createEvent` etc.? — Neil, Mar 11 '11 at 23:59
Thanks for the response. I have tried that but it doesn't make any difference. — AmitTheInfinity, Mar 14 '11 at 09:04

Neil · Accepted Answer · 2011-03-15T21:30:47.520

0

You have to focus the element before you can dispatch a key event to it.

EDIT:

This is only true for web pages. Extensions can dispatch keypress events to any text field.

EDIT:

Text entry is done via keypress events, not keydown events.

EDIT:

You won't get any characters inserted if you don't provide a character code. (Sorry for overlooking that, it should have been obvious.) Also although it seems to work with your window you should pass in the browser's contentWindow as the defaultView.

edited Mar 15 '11 at 21:30

answered Mar 12 '11 at 00:31

Neil

54,642
8
60
72

Yes, I tried focusing the element before dispatching the event I also tried gBrowser.selectedBrowser.contentDocument.createEvent but no change in output. It says event is dispatched but the character is not displayed in the text box. surprisingly all these logic's work fine for mouse events and they do get reflected in checkboxes, radio buttons etc. Then why only key events are not reflected even after they get generated? – AmitTheInfinity Mar 14 '11 at 09:03
Yes, I tried that also. Actually I tried sending it like, KeyDown followed by KeyPress followed by KeyUp events but it didn't worked. I also tried to send only KeyPress as you said. But still no luck, I am able to catch the generated event in handler but it does not update the text box. :( – AmitTheInfinity Mar 15 '11 at 11:49
ok. I used "window.document.activeElement.ownerDocument.defaultView" as you suggested. I also sent charcode instead of keycode. But still I am not having any luck. :( I am stuck like anything here, nothing is working for me. And that mouse event dispatch works fine to frustrate me more. :( Can you show me some modification in my code which might have worked for you? – AmitTheInfinity Mar 16 '11 at 12:23
@AmitTheInfinity This way works for me: http://jsfiddle.net/9YHGY/ (note that as this is content it needs to focus the element; you may find that you don't need to do that from an extension). – Neil Mar 16 '11 at 21:37
Thanks! this thing worked (looks like cancelable set to true was the change I needed, and sending character code instead of key code). But this one sends only printable characters as we are using charcode parameter. I need to send keys like Ctrl+C and Ctrl+A (for text editing purpose) as well. Which is still not working for me. But still, it's a major step ahead for me. Thank you very much for this! – AmitTheInfinity Mar 18 '11 at 10:04
Ctrl keys should work from an extension (assuming you set the `ctrlKeyArg` flag in `initKeyEvent`), but they won't work in the jsfiddle. – Neil Mar 18 '11 at 20:55
Hey, sorry for late response. I was offline for last few days. And yes! it worked in extension. It was really stupid to post it by just looking it working in jsfiddle actually. :) sorry for that. But yes now it is sending these keys as well! Thanks a million for helping me out. :) – AmitTheInfinity Mar 22 '11 at 07:26

Why my dispatchEvent works for mouse events but not key events

1 Answers1