How to debug Greasemonkey script with the Firebug extension? - debugging

Question

I didn't find a way to debug Greasemonkey scripts with the Firebug extension.
Does anyone know how to do this ?
Thanks.

Answer 1

Updatier: The Mene+Shuman fix now is busted with Firefox 30 and Firebug 2. Firefox 31 may provide workarounds (will investigate). In the meantime, use the "General workaround strategies" listed below.
Update: This answer is now obsolete.
If you open about:config and
set extensions.firebug.filterSystemURLs to false
then you can use Firebug to debug the Greasemonkey script just like any other.
This works irregardless of the #grant mode.
See Mene's answer -- with an assist from Shuman.
Old answer:
Because Greasemonkey operates in a sandbox, Firebug cannot see it. There is no easy way around this.
General workaround strategies:
Test all parts of a GM script that don't use GM_ functions, in Firebug's JavaScript console first. Minimize use of GM_ functions and don't use GM_log() at all.
All of Firebug's console functions work great from within a GM script.

Answer 2

Note: this answer refers to old versions of Firefox. Firebug is no longer available, but lives on in the Developer Edition of Firefox.
Current Firefox and Firebug can now debug current Greasemonkey scripts just like any other javascript. Just find your *.user.js script in the dropdown menu. The console also works.
This works at least on Firefox 28.0 and Firebug 1.12.7; I haven't tried earlier versions.
Note: In order to get it to work, you probably have to set extensions.firebug.filterSystemURLs to false. See "Profiling Greasemonkey scripts" in the Firebug, bug tracker. (Thanks to Shuman)

Answer 3

var e = document.createElement("script");
e.src = 'http://www.xxxxxxxx.com/yyyyyyyy.js';
e.type="text/javascript";
document.getElementsByTagName("head")[0].appendChild(e);
you can add this to your xxx.user.js, and install it in greasemonkey.
Then, you can debug your js as you wish.

Answer 4

None of the other solutions here worked for me, but Jan Odvarko's answer on how to debug Firefox extensions worked perfectly for GreaseMonkey scripts as well:
On Firefox 19 or later, it's possible to use the built-in JS debugger
on the browser itself. Go to about:config and set the following two
prefs:
devtools.chrome.enabled: true
devtools.debugger.remote-enabled: true
After you restart the browser, you can access the Browser Debugger
through Tools > Web Developer > Browser Toolbox.
(note that you must accept the incoming connection)
See more at:
https://developer.mozilla.org/en-US/docs/Mozilla/Debugging/Debugging_JavaScript#JavaScript_Debugger
Then just search for the name of your userscript and start debugging.

Answer 5

It can be done using native Firefox debugger as it was mentioned before. Below is the instruction for modern versions of Firefox.
Set the following preferences in about:config:
devtools.chrome.enabled: true
devtools.debugger.remote-enabled: true
devtools.debugger.prompt-connection: false
Open the global script debugger window via
Tools → Web Developer → Browser Toolbox → Debugger (or Ctrl+Shift+Alt+I) .
Search for the name of your userscript and start debugging.

Answer 6

-- This answer is obsolete, please use #Brock Adams solution above --
Load your main script externally, instead of running it via GM. So you're just using GM to inject the script.
This is a bit of a hybrid between #bigml and #Yuval's solution and it uses jquery. It also works in frames.
// ==UserScript==
// #name My GM script
// #include The website I want this to run on
// #require http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// ==/UserScript==
$(document).ready(function() {
// fetch jquery dependent scripts using $.getScript()
});

Answer 7

Note: ChromeBug no longer exists. The Developer Edition of Firefox is an alternative.
Chromebug can see sandboxed scripts, http://getfirebug.com/wiki/index.php/Chromebug_User_Guide, but I've not tried it on Greasemonkey.

Answer 8

Similar to #bigml's suggestion, you can run it unprivileged if you setup a local webserver (apache) to serve the userscript file, then in your userscript add something along the lines:
if (typeof GM_addStyle == "undefined") {
loadScript("http://localhost/path/to/script.user.js");
}
else {
runScript();
}
function loadScript(url) {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = url;
document.getElementsByTagName('head')[0].appendChild(res);
}
function runScript() {
// ... whatever your userscript does ...
}
Of course you wouldn't be running in a privileged context. But this way you can easily continuously debug the script as any other script.

Answer 9

Note: this answer refers to old versions of Firefox. Firebug is no longer available, but lives on in the Developer Edition of Firefox.
I've tried ChromeBug, it doesn't seem to work.
With FireBug I have had the starting point of success by adding "debugger" to my GM code. This causes a breakpoint and I can inspect variables on the stack, but the right file is not shown so I can't step or anything.
I have had the best success with FirebugMonkey (https://
addons.mozilla.org/en-US/firefox/addon/13623/), which I just got working to do basic
debugging of GreaseMonkey scripts thanks to some explanation in a
recent comment on the extension page by f0rsvinn. Here are the instructions I just posted at http://groups.google.com/group/greasemonkey-users/browse_thread/thread/994cfa58c79d222:
It never occurred to me that the way it works is by creating its own
sandbox around the script rather than using Greasemonkey's, you
actually have to turn GM off. There are some GM aspect things that
will not work though because the script really isn't in GreaseMonkey.
As an example, GM_getValue returns undefined.
Still, it works for basic debugging - and is way better than nothing.
Usage steps are as follows:
Install FireBug 1.5.4 (later versions do not seem to work)
Install FireBugMonkey
Use the Script Manager in FireBugMonkey to select the files you want to debug
Disable GreaseMonkey (scripts will run inside FireBugMonkey, not
GreaseMonkey)
Enable FireBugMonkey
Enable scripts in FireBug
The scripts you added in the ScriptManager should be visible in the
FireBug scripts list.

Answer 10

As the others have said, you can setup a simple HTTP server and serve it to your page using Greasemonkey like so:
function loadScript(url) {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = url;
document.getElementsByTagName('head')[0].appendChild(script);
}
WEBrick and Python -m SimpleHTTPServer are good for this. We can also expose the GM_... functions to the script by adding a custom event handler to the document within GreaseMonkey:
function gMHandler(e){
GM_log(e.detail.message);
e.detail.response = "Hi!"
}
document.addEventListener("gM", gMHandler, false);
and then in the served script, raising this event on an arbitrary DOM element will run the handler and modify the element's response parameter:
$(document).ready(function() {
var event = new CustomEvent(
"gM",
{
detail: { message: "Hello World!" }
bubbles: true,
cancelable: true,
}
);
document.getElementById("AnyElement").dispatchEvent(event);
alert("Response was: " + event.detail.response);
});