How to debug chrome JS files?

442 views
Skip to first unread message

Matt Blais

unread,
Dec 30, 2007, 3:21:50 PM12/30/07
to Firebug
Hi,

Thanks for this wonderful tool, which I'm using to develop a Firefox
extension (using Firefox v2.0.0.11, Firebug v1.05).

Two questions:

[1] My Firebug will only display XUL files in the "Script" tab, even
when it breaks on code in a JS file. The little Script popup menu
never shows any of my JS files either. How can I get Firebug to
display and debug the JS files in my chrome?

[2] Firebug sometimes breaks in places I don't expect - I have no
breakpoints set, no errors have occurred, nor any other explanation
for the break. For example, FB breaks every time through this
function:

SetField: function(f,v) {
if (this.fields[f] != v) {
this.fields[f] = v;
this.dirty = true;
return true;
}
return false;
},

John J Barton

unread,
Jan 1, 2008, 8:34:02 PM1/1/08
to Firebug


On Dec 30 2007, 12:21 pm, Matt Blais <un...@yummage.com> wrote:
> Hi,
>
> Thanks for this wonderful tool, which I'm using to develop a Firefox
> extension (using Firefox v2.0.0.11, Firebug v1.05).
>
> Two questions:
>
> [1] My Firebug will only display XUL files in the "Script" tab, even
> when it breaks on code in a JS file. The little Script popup menu
> never shows any of my JS files either. How can I get Firebug to
> display and debug the JS files in my chrome?

If Firebug shows JS files from extensions its a bug. I am working on
ChromeBug to debug extensions.
https://fireclipse.svn.sourceforge.net/svnroot/fireclipse/trunk/FireclipseExtensions/chromebug
or use Venkman.

>
> [2] Firebug sometimes breaks in places I don't expect - I have no
> breakpoints set, no errors have occurred, nor any other explanation
> for the break. For example, FB breaks every time through this
> function:
>
> SetField: function(f,v) {
> if (this.fields[f] != v) {
> this.fields[f] = v;
> this.dirty = true;
> return true;
> }
> return false;
> },

Please try fiirebug 1.1, http://fireclipse.xucia.com. If you still
have a problem, please post a complete test case to the issues list.

Matt Blais

unread,
Jan 2, 2008, 1:55:10 AM1/2/08
to Firebug
> Please try fiirebug 1.1

That seems to fix the unexpected breakpoints.

> ChromeBug to debug extensions.

I've checked-out the Chromebug svn repository locally, and I managed
to install it by copying "install.rdf.tpl.xml" to "install.rdf" and
replacing @VERSION@ with a dummy version number.

It seems to be mostly working, but it does not break on any
breakpoints I set (nor does it save them when FF is restarted).

It breaks on a "debugger" statement, BUT using any of the debugging
"step" commands simply makes it Continue (no stepping). Stepping was
working in Firebug 1.05 (though without chrome source view).

Any help? (please don't tell me I need Eclipse installed...)

John J Barton

unread,
Jan 2, 2008, 12:21:49 PM1/2/08
to Firebug


On Jan 1, 10:55 pm, Matt Blais <un...@yummage.com> wrote:
> > Please try fiirebug 1.1
>
> That seems to fix the unexpected breakpoints.

Good, thanks for confirming.

>
> > ChromeBug to debug extensions.
>
> I've checked-out the Chromebug svn repository locally, and I managed
> to install it by copying "install.rdf.tpl.xml" to "install.rdf" and
> replacing @VERSION@ with a dummy version number.

That is almost enough if you know how extensions go together. Well
except...

>
> It seems to be mostly working, but it does not break on any
> breakpoints I set (nor does it save them when FF is restarted).

...ChromeBug relies on firebug 1.2, sorry I guess that was not at all
clear.

>
> It breaks on a "debugger" statement, BUT using any of the debugging
> "step" commands simply makes it Continue (no stepping). Stepping was
> working in Firebug 1.05 (though without chrome source view).

If you're willing to try chromebug/firebug 1.2, I'm willing to fix
bugs. But a major problem with debugging bugs in extensions is
communicating: its not as easy to share extensions as web pages as
test cases. The good news is that the differences between firebug and
chromebug for stepping should be small.

>
> Any help? (please don't tell me I need Eclipse installed...)

No eclipse, but would you consider 'ant'? That is what I use. I could
set up the svn tree so that one svn checkout and one ant build would
create the committed version.

Matt Blais

unread,
Jan 2, 2008, 8:07:55 PM1/2/08
to Firebug
On Jan 2, 12:21 pm, John J Barton <johnjbar...@johnjbarton.com> wrote:
> That is almost enough if you know how extensions go together.

I'm no expert, but I know the basics, i.e. create a file named for the
extension's id, containing just the path to the extension's source
dir, and putting said file in the FF profile's extensions folder,
deleting compreg.dat (and supplying dummy version values in template
files where needed ;-). Anything else I need to know?


> ...ChromeBug relies on firebug 1.2 [...]
> If you're willing to try chromebug/firebug 1.2, I'm willing to fix
> bugs.

Best offer I've had in a long time - does that include my bugs? ;-)


> No eclipse, but would you consider 'ant'? That is what I use. I could
> set up the svn tree so that one svn checkout and one ant build would
> create the committed version.

I'm not familiar with ant - is that http://ant.netbeans.org ?
How does it fit into the bigger picture (debugging a FF extension
using chomebug)? Does ant require any additional tools (i.e. MSVC,
etc)?

Asrail

unread,
Jan 2, 2008, 8:22:24 PM1/2/08
to fir...@googlegroups.com
Matt Blais, 02-01-2008 22:07:

Creating the missing files based on the templates and may even already
put the files on the profile's extensions folder... in other words
substitute what you're doing by hand to install it.

No, you won't need anything else.

There is a build.xml, you may create a plain text file called
local.properties to set some preferences and you run the ant command on
the folder.


Julien Wajsberg

unread,
Jan 3, 2008, 2:11:13 AM1/3/08
to fir...@googlegroups.com
On 03/01/2008, Matt Blais <un...@yummage.com> wrote:


I'm not familiar with ant - is that http://ant.netbeans.org ?

It's from Apache
http://ant.apache.org/


Ant plays the same role than make: it executes sequences of commands, and can resolve dependencies between sequences.

John J Barton

unread,
Jan 3, 2008, 11:38:09 AM1/3/08
to Firebug
I reorganized the chromebug source tree and wrote a new readme.txt:
https://fireclipse.svn.sourceforge.net/svnroot/fireclipse/trunk/FireclipseExtensions/chromebug/Readme.txt

That together with the posts by others maybe enough...

Matt Blais

unread,
Jan 3, 2008, 8:53:15 PM1/3/08
to Firebug
Thanks to everyone for all the help - I have it all set up locally as
John described in the readme (no ant required).

Current issues:

1. I see this error everywhere: "FBTrace is not defined".
Is there a way to prevent the error console from popping up with every
error?

2. I can't figure out how to get the debugger to interact with
additional windows (dialogs actually) that are opened by the main
window via document.open("chrome://....");
In the dialog's s code, "debugger" statements are ignored, and the JS
source files are not showing up in the Script-tab source dropdown.
chromebug doesn't seem to know the dialog exists.

John J Barton

unread,
Jan 4, 2008, 12:56:33 AM1/4/08
to Firebug


On Jan 3, 5:53 pm, Matt Blais <un...@yummage.com> wrote:
> Thanks to everyone for all the help - I have it all set up locally as
> John described in the readme (no ant required).
>
> Current issues:
>
> 1. I see this error everywhere: "FBTrace is not defined".
> Is there a way to prevent the error console from popping up with every
> error?

Hmm.. that's not good. Can you get the os-console output? And are
there errors in the jsconsole before the first FBTrace error?

FBTrace is defined in trace.js which is loaded very early in
chromebug.xul. Finding where these things go bad is frustrating.


> 2. I can't figure out how to get the debugger to interact with
> additional windows (dialogs actually) that are opened by the main
> window via document.open("chrome://....");
> In the dialog's s code, "debugger" statements are ignored, and the JS
> source files are not showing up in the Script-tab source dropdown.
> chromebug doesn't seem to know the dialog exists.

This is one of the many issues I am struggling with in chromebug: how
to scope the UI so users get what they want and not a lot of other
stuff.

One of the menus across the top is the windows: try selecting you
dialog then looking at the Script panel list. In principle I want all
of the panels to focus on the window you select, something similar to
how firebug focuses on a page.

If the dialog comes up before the debugger engages, then try Firefox-
>Tools->Open Chromebug Always and restart.

John J Barton

unread,
Jan 4, 2008, 12:26:41 PM1/4/08
to Firebug


On Jan 3, 5:53 pm, Matt Blais <un...@yummage.com> wrote:

> ... and the JS
> source files are not showing up in the Script-tab source dropdown.
> chromebug doesn't seem to know the dialog exists.

Ok this is broken. I ran with "-jsconsole" on the command line so
that the error console window comes up. When I select the console.xul
document and/or the error console window, the HTML panel shows
console.xul has script tags. But the Script panel does not show the
scripts from console.xul. I'll work on that.

John.

John J Barton

unread,
Jan 5, 2008, 12:45:32 PM1/5/08
to Firebug
I made some progress (update from svn):
-- cleaned up the list of scripts for a document
-- added "JSContext" menu
-- print errors to OS console from command-line-handler to ChromeBug-
is-up. This means syntax errors in chrome javascript now show up (Re:
the FBTrace is not defined problem).

A new way to run chromebug:
firefox.exe -chrome chrome://chromebug/content/chromebug.xul -p
chromebug -chromebug not
The -chrome <url> causes firefox.exe to run chromebug not firefox.
The -p <profile> loads the extensions the profile (where I have links
to the source)
The -chromebug not prevents my commandline handler from launching
chromebug a second time.
ChromeBug first gets set up then opens firefox.

More important I understand the issues better. All "scripts" (JS
functions) are compiled inside of a JSContext which contains the
global scope. So the natural units for grouping scripts is first
JSContext and second the compilation unit (eg file).

Typically every nsIDOMWindow (window with document) has a JSContext
for its scripts. So, (typically) we can ignore the JSContext and just
use the window/document as the grouping object. However Chromebug
aspires to deal with components and extensions as well as windows so
I'm not jumping directly to that model yet.

Once I sort this out I hope to eliminate the window/document/jscontext
menus in favor of a "focus on window", document menu solution.

One of the problems with ChromeBug has been that the JSContext is
created, filled with some scripts, then ChromeBug comes along and
starts tracking scripts by window. I previously gathered up all
homeless scripts and put them in all windows. Now I don't do that.

I'm still confused about components: they seem not to come thru jsd
all of the time.

John J Barton

unread,
Jan 8, 2008, 12:26:19 AM1/8/08
to Firebug
Fixed Reload (the blue circle thing). Select a window, reload will
kill it and restore. If you use the link-from-extensions-dir to
source, you will pick up new code.

Renamed Files to Tools
Moved ChromeList to Tools
Added XUL Explorer to Tools.

Update,
John.

pd

unread,
Jan 9, 2008, 8:45:12 AM1/9/08
to Firebug
Hi John

Whilst I'm sure you working very hard on a whole variety of tasks, the
compiling required for ChromeBug atm seems a little bit of a cliff-
face more than a learning curve, at least to me. Would it take much
work to package it all in an XPI ?

Secondly the focus seems to be Firefox atm. Do you have any
indications of whether ChromeBug would work in other applications,
such as Thunderbird?

Thanks for the great work. Firebug is a lifesaver and it's fantastic
that you've taken it on since Joe left it behind. I hope you;re
getting paid for it.

pd

John J Barton

unread,
Jan 9, 2008, 12:43:49 PM1/9/08
to Firebug


On Jan 9, 5:45 am, pd <an0n1m...@gmail.com> wrote:
> Hi John
>
> Whilst I'm sure you working very hard on a whole variety of tasks, the
> compiling required for ChromeBug atm seems a little bit of a cliff-
> face more than a learning curve, at least to me. Would it take much
> work to package it all in an XPI ?

The ant build.xml script at the top of the chromebug source will build
a directory with chromebug, firebug1.2, and their update files. If you
have ant, svn, and a command line it should work or I'll fix it.

I won't be distributing the XPI.

>
> Secondly the focus seems to be Firefox atm. Do you have any
> indications of whether ChromeBug would work in other applications,
> such as Thunderbird?

I'm not sure what an "atm" is. In principle it will work with any XUL
application, in practice someone needs teach it to open another app.

>
> Thanks for the great work. Firebug is a lifesaver and it's fantastic
> that you've taken it on since Joe left it behind. I hope you;re
> getting paid for it.

Me too.

>
> pd
>
> On Jan 8, 4:26 pm, John J Barton <johnjbar...@johnjbarton.com> wrote:
>
>
>
> > Fixed Reload (the blue circle thing).  Select a window, reload will
> > kill it and restore. If you use the link-from-extensions-dir to
> > source, you will pick up new code.
>
> > Renamed Files to Tools
> > Moved ChromeList to Tools
> > Added XUL Explorer to Tools.
>
> > Update,
> > John.- Hide quoted text -
>
> - Show quoted text -

Tom Hughes-Croucher

unread,
Jan 9, 2008, 5:49:42 PM1/9/08
to Firebug
> > Whilst I'm sure you working very hard on a whole variety of tasks, the
> > compiling required for ChromeBug atm seems a little bit of a cliff-
> > face more than a learning curve, at least to me. Would it take much
> > work to package it all in an XPI ?
>
> The ant build.xml script at the top of the chromebug source will build
> a directory with chromebug, firebug1.2, and their update files. If you
> have ant, svn, and a command line it should work or I'll fix it.
>
> I won't be distributing the XPI.
>

I found the ant build easy to run on my Mac with one exception. When I
created a new profile for Chromebug there wasn't an 'extensions'
directory in the profile directory. This caused the ant build to fail.

One of the other guys at Yahoo told me about a tool Steve Souders
built called Live Coder which does have an XPI

http://stevesouders.com/livecoder/

It's not quite the same as Chromebug but it does allow you to do a
more passive kind of integration within Firebug which some people
might find useful. Not for other XUL projects though.

John J Barton

unread,
Jan 9, 2008, 11:56:42 PM1/9/08
to Firebug


On Jan 9, 2:49 pm, Tom Hughes-Croucher <tom.crouc...@gmail.com> wrote:
> > > Whilst I'm sure you working very hard on a whole variety of tasks, the
> > > compiling required for ChromeBug atm seems a little bit of a cliff-
> > > face more than a learning curve, at least to me. Would it take much
> > > work to package it all in an XPI ?
>
> > The ant build.xml script at the top of the chromebug source will build
> > a directory with chromebug, firebug1.2, and their update files. If you
> > have ant, svn, and a command line it should work or I'll fix it.
>
> > I won't be distributing the XPI.
>
> I found the ant build easy to run on my Mac with one exception. When I
> created a new profile for Chromebug there wasn't an 'extensions'
> directory in the profile directory. This caused the ant build to fail.

Thanks, I added a mkdir. Maybe its a Mac thing?

>
> One of the other guys at Yahoo told me about a tool Steve Souders
> built called Live Coder which does have an XPI
>
> http://stevesouders.com/livecoder/
>

Steve and I are both keen to get more dynamic function modification
capabilities in to firebug, so this is probably on the short list for
1.3.

Tom Hughes-Croucher

unread,
Jan 10, 2008, 4:55:43 AM1/10/08
to Firebug
On Jan 10, 4:56 am, John J Barton <johnjbar...@johnjbarton.com> wrote:
> On Jan 9, 2:49 pm, Tom Hughes-Croucher <tom.crouc...@gmail.com> wrote:
>
> > I found the ant build easy to run on my Mac with one exception. When I
> > created a new profile for Chromebug there wasn't an 'extensions'
> > directory in the profile directory. This caused the ant build to fail.
>
> Thanks, I added a mkdir. Maybe its a Mac thing?
>

I think it's because I hadn't run Firefox with the profile so it
didn't create the extensions directory.

John J Barton

unread,
Jan 10, 2008, 11:01:47 AM1/10/08
to Firebug


On Jan 10, 1:55 am, Tom Hughes-Croucher <tom.crouc...@gmail.com>
wrote:
Thanks, I updated the readme.

John

unread,
Jan 20, 2008, 5:46:09 PM1/20/08
to Firebug
Like Firebug, I'm enamored with ChromeBug. It's an amazing tool and
your efforts are certainly appreciated.

You mentioned the feedback cycle so here's a few notes on my
experience installing and using ChromeBug. As an XUL and Extensions
novice, step 5 was quite hard to follow. I didn't understand what
"create the dev-links" meant, so getting a grasp on the task at hand
and using google to help me troubleshoot was tough. In hindsight I
guess a dev setup is a manifest that points to a chrome directory and
source rather than a package. Since I didn't have ant installed, I
read and reread the OR instructions. It might help others to
explicitly state which three files in the Extensions folder need to be
created, which file they use as a template and show their relative
paths. I messed around with install.rdf, build.xml and creating email
address file names in the extensions folder but never got it right.

In the end I went through the effort to setup ant since the
installation is scripted. The only ant related issue I had was not
noticing the use of forward slashes for install.dir in
local.properties. After many iterations of running ant and finding no
deployed files in the profile directory I finally identified and fixed
the issue.

Using ChromeBug is fantastic. I've spent time in the past reading XUL
articles and tutorials but nothing compares to inspecting XUL elements
in the browser. I have a few issues unrelated to setup - such as being
unable to hit breakpoints set in Firebug .js files (like html.js,
dom.js, etc) and FBTrace remains empty no matter how many options I
check off. I've confirmed that browser.dom.window.dump.enabled is set
to true and I'm running FF 2.0.0.11. I'd love to be able to evaluate
and debug FireBug but for now can live with simply viewing into what's
there and how it works.

Thanks again,

John

On Jan 10, 8:01 am, John J Barton <johnjbar...@johnjbarton.com> wrote:
> On Jan 10, 1:55 am, Tom Hughes-Croucher <tom.crouc...@gmail.com>
> wrote:
>
> > On Jan 10, 4:56 am, John J Barton <johnjbar...@johnjbarton.com> wrote:
>
> > > On Jan 9, 2:49 pm, Tom Hughes-Croucher <tom.crouc...@gmail.com> wrote:
>
> > > > I found the ant build easy to run on my Mac with one exception. When I
> > > > created a new profile forChromebugthere wasn't an 'extensions'

John J Barton

unread,
Jan 21, 2008, 11:25:32 AM1/21/08
to Firebug


On Jan 20, 2:46 pm, John <lewi...@gmail.com> wrote:
> Like Firebug, I'm enamored with ChromeBug. It's an amazing tool and
> your efforts are certainly appreciated.
>
Thanks!

> You mentioned the feedback cycle so here's a few notes on my
> experience installing and using ChromeBug. As an XUL and Extensions
> novice, step 5 was quite hard to follow. I didn't understand what
> "create the dev-links" meant, so getting a grasp on the task at hand
> and using google to help me troubleshoot was tough. In hindsight I
> guess a dev setup is a manifest that points to a chrome directory and
> source rather than a package. Since I didn't have ant installed, I
> read and reread the OR instructions. It might help others to
> explicitly state which three files in the Extensions folder need to be
> created, which file they use as a template and show their relative
> paths. I messed around with install.rdf, build.xml and creating email
> address file names in the extensions folder but never got it right.

I updated the readme
>
> In the end I went through the effort to setup ant since the
> installation is scripted. The only ant related issue I had was not
> noticing the use of forward slashes for install.dir in
> local.properties. After many iterations of running ant and finding no
> deployed files in the profile directory I finally identified and fixed
> the issue.

I updated the readme

>
> Using ChromeBug is fantastic. I've spent time in the past reading XUL
> articles and tutorials but nothing compares to inspecting XUL elements
> in the browser. I have a few issues unrelated to setup - such as being
> unable to hit breakpoints set in Firebug .js files (like html.js,

breakpoints are half broken now, its on the top of my list

> dom.js, etc) and FBTrace remains empty no matter how many options I
> check off. I've confirmed that browser.dom.window.dump.enabled is set

I just fixed the options (I think), should be in later today.

John

unread,
Jan 25, 2008, 2:30:34 PM1/25/08
to Firebug
The Chromebug source hasn't been accessible for about 24 hours. Not
that I absolutely need the latest revision, but it seems like the
problem isn't going away. Is the correct url still:

https://fireclipse.svn.sourceforge.net/svnroot/fireclipse/trunk/FireclipseExtensions/chromebug

-John

On Jan 21, 8:25 am, John J Barton <johnjbar...@johnjbarton.com> wrote:
> On Jan 20, 2:46 pm, John <lewi...@gmail.com> wrote:> Like Firebug, I'm enamored withChromeBug. It's an amazing tool and
> > your efforts are certainly appreciated.
>
> Thanks!
>
> > You mentioned the feedback cycle so here's a few notes on my
> > experience installing and usingChromeBug. As an XUL and Extensions
> > novice, step 5 was quite hard to follow. I didn't understand what
> > "create the dev-links" meant, so getting a grasp on the task at hand
> > and using google to help me troubleshoot was tough. In hindsight I
> > guess a dev setup is a manifest that points to a chrome directory and
> > source rather than a package. Since I didn't have ant installed, I
> > read and reread the OR instructions. It might help others to
> > explicitly state which three files in the Extensions folder need to be
> > created, which file they use as a template and show their relative
> > paths. I messed around with install.rdf, build.xml and creating email
> > address file names in the extensions folder but never got it right.
>
> I updated the readme
>
>
>
> > In the end I went through the effort to setup ant since the
> > installation is scripted. The only ant related issue I had was not
> > noticing the use of forward slashes for install.dir in
> > local.properties. After many iterations of running ant and finding no
> > deployed files in the profile directory I finally identified and fixed
> > the issue.
>
> I updated the readme
>
>
>
> > UsingChromeBugis fantastic. I've spent time in the past reading XUL

John J Barton

unread,
Jan 25, 2008, 5:18:05 PM1/25/08
to Firebug
From: http://sourceforge.net/docs/A04/
( 2008-01-25 05:22:06 - Project Subversion (SVN) Service ) Due to
a hardware fault, Subversion service for projects beginning with the
letters a, f, l, m, t, y, and z is currently unavailable. Site status
will be updated with further information as it becomes available.


On Jan 25, 11:30 am, John <lewi...@gmail.com> wrote:
> The Chromebug source hasn't been accessible for about 24 hours. Not
> that I absolutely need the latest revision, but it seems like the
> problem isn't going away. Is the correct url still:
>
> https://fireclipse.svn.sourceforge.net/svnroot/fireclipse/trunk/Firec...
> > > > Thanks, I updated the readme.Fro
Reply all
Reply to author
Forward
0 new messages