Printing the `event` object inside a greasemonkey script silently terminates execution, how can I view the `event`?

Question

Here is my script (intentionally simplified):

// ==UserScript==
// @name            StackOverflowExample
// @include     https://stackoverflow.com/*
// @version     1
// @grant       none
// ==/UserScript==


document.addEventListener('keydown', (e) => {
  console.log('I print before the "e"')
  conosel.log({e})
  console.log('I print after the "e"')
})

When this script is loaded into my page (Stack Overflow), I see the 'I print before the "e"' get printed to console, but I don't see the 'e' or the 'I print after the "e"' get logged. Why is this?

I have tried adding things like e.preventDefault() and that made no difference.

The puzzling thing is that this kind of thing inside the event listener still works:

document.addEventListener('keydown', (e) => {
if(e.keyCode !== 40)){
console.log('you pressed some random key')
} else {
console.log('you pressed the "UP" arrow key')
}
})

So the e object is defined (just press any key and then 'up'). Any ideas?

Edit: seems I was wrong with the second part, (although I was so sure I saw it work on another website...)

Browser = firefox 63.0.3 (64-bit)

OS = Ubuntu 18.04

GreaseMonkey = 4.7

Answer 1

Greasemonkey 4+ is crud and the GM team itself recommends not to use it.

If you had installed the script using Tampermonkey (probably Violentmonkey too), you would have seen the syntax errors on the console. (And also in Tampermonkey's editor window if you used it.)

Note that Greasemonkey 4+ did not actually silently fail. It just hid the error messages away in Firefox's "Browser Console" (Ctrl+Shift+J), where most people would not know/think to look for them.

Obviously, conosel is an error (line 11 of the original code block).

Likewise, if(e.keyCode !== 40)) is a syntax error in the second code block.

Also:

1. console.log({e}) is poor because it needlessly obscures e within a dummy object.
2. The parentheses in (e) are superfluous.
3. Code formatting, spacing and indenting can help you spot errors faster, and eases trying to read/maintain your code in general.
4. keyCode 40 is the down arrow key, not the up arrow.
5. Get into the habit of using semicolons; it will save needless errors and head scratching.

So, the first code block should be:

// ==UserScript==
// @name        StackOverflowExample
// @match       https://stackoverflow.com/*
// @version     1
// @grant       none
// ==/UserScript==

document.addEventListener ('keydown', e => {
    console.log ('I print before the "e"');
    console.log ("e: ", e);
    console.log ('I print after the "e"');
} );

And the second:

document.addEventListener ('keydown', e => {
    if (e.keyCode !== 38) {
        console.log ('you pressed some random key');
    }
    else {
        console.log ('you pressed the "UP" arrow key');
    }
} );

---

And use Tampermonkey and/or Violentmonkey, not Greasemonkey. You'll save hours of frustration, and your scripts will be both more reliable and more portable.