Key events not fired inside iframe for Firefox

Question

I have my own little homemade JSFiddle website that I built mostly for fun and so far it's worked pretty well, but I develop exclusively in Chrome. I want to mention this because I think my issue may (hopefully) be able to be fixed by changing my little sandbox, but here is my main issue:

In my sandbox I developed a small Snake implementation which relies on keydown events for controlling the player. Everything works fine in Chrome and I'm pretty happy with it, but in Firefox, I am unable to control the player. You can see my setup here:

http://willseph.com/sandbox/?id=ORWx7miv

The player is supposed to be either controlled with the arrow keys or WASD, but they don't seem to work in Firefox. I saw in another post that the tabindex="0" attribute should be added to the element which should receive focus (although I'm not sure which element that would be, I tried putting it in the element holding the render iframe within the parent document, the iframe element itself, and the container div inside the iframe).

Can anyone shed some light on this? I'd love to figure out why this is happening.

Update:

I just uploaded the same code on JSFiddle and I'm having the same problem. Keyboard controls work for Chrome but not Firefox:

http://jsfiddle.net/Ud876/1/embedded/result/

That's really weird, it works just fine for me. You hit the New Game button in the bottom-right window after it loads, right? — William Thomas, Mar 06 '13 at 05:12
There is no button, the button only appears when I shrink the available space open in my window, by opening the inspector. — Daedalus, Mar 06 '13 at 05:17
Yeah sorry about that, it's because the sidebar div I have is too wide (I sort of threw this together just today without much thought). — William Thomas, Mar 06 '13 at 05:25

score 2 · Accepted Answer · answered Mar 06 '13 at 06:12

2

Your problem, in my testing with firebug, appears to be here:

$(window).keydown(function () {
    //                      ^ --- no event object passed to function
    game.onKeyDown(event, game);
});

See the fixed fiddle in action, here.

answered Mar 06 '13 at 06:12

Daedalus

7,586
5
36
61

I don't know what's more surprising, the fact that I missed that or that somehow it manages to work on my Chrome. In any case, it's totally fixed. Thank you! – William Thomas Mar 06 '13 at 09:42

Key events not fired inside iframe for Firefox

1 Answers1