Debug tampermonkey script

thestral picture thestral · Apr 12, 2015 · Viewed 24k times · Source

I would like to debug a tampermonkey script with the chrome's console, but I can't find my script in the list..

enter image description here

Am I doing something wrong, or just the tampermonkey scripts doesnt appear there? And in that case, how can I debug it?

Answer

lossleader picture lossleader · Apr 12, 2015

Tampermonkey is simply an extension that injects boilerplate scripts to evaluate your custom scripts, so you can debug any of these scripts if you can find them..

The trouble is that it is evaluating userscripts as if someone called eval() on them, so you will see VM### instead of something nice like myscript.js and you can't normally navigate to them like permanent scripts.

Instead, add debugger lines:

  • Settings Checkmark:

TamperMonkey Dashboard -> Settings -> General (Config mode: Advanced) -> Debug scripts Tampermonkey general settings w/debug checked

  • Or, in your userscript add the line:

    debugger;

like so: debugger line in userscript

(Doing this at the top of a userscript is equivalent to the Tampermonkey setting)

When you have a console open on a page using the script it will pause when the debugger lines are hit and show you your source file (surrounded with some tampermonkey boilerplate).

Which should look like this: chrome paused on tampermonkey script

You can then instrument any other lines you need to from within the debugger.

If you run into trouble, you can also debug the main logic of tampermonkey itself by opening the background page inspection in chrome://extensions. It prints nice messages to let you know what it is up to which you can use to jump around in its code.