Debug developer console inserted javascript

Question

Is there some way to debug code that you have inserted from the firefox developer console terminal? I.e I inserted

document.onkeydown = function(event) { 
  // check keys pressed and perform some logic 
}

If I knew where the javascript entered from the developer console goes(which .js file it was in) I could debug it but I haven't been able to figure that out.

cam't you just add it in code? I'm not sure you _can_ break on inserted code. would be awesome if you could — DMcCallum83, Jun 09 '18 at 22:46
Put a `debugger` statement inside, this way you’ll be able to get to see your code in VM and place a breakpoint — Akxe, Jun 09 '18 at 22:56
Akxe, that was the answer I gave to my own question before it got deleted while my power was out. Oh well problem solved. — user2117229, Jun 10 '18 at 06:43

score 0 · Answer 1 · answered Jun 09 '18 at 22:55

In the chrome debug console, type this:

document.onkeydown = function(event) { 
  console.log(event)
}

The return value will be a function, like this:

Double click on the function and a VM.js tab will open. This contains the code generated by the VM for this function. You can set a breakpoint there.

score 0 · Answer 2 · answered Jun 10 '18 at 07:06

0

The debugger; statement is exactly what I needed.

document.onkeydown= function(event){
    debugger;
    //function logic here
}

Then from the image below you can see that you can set your breakpoints in the debugger where you need them.

answered Jun 10 '18 at 07:06

user2117229

135
3
8

Debug developer console inserted javascript

2 Answers2