I'm using ExtJS and I'm actually rendering JS files. I return Content-Type: 'text/javascript' but I don't get my renderd JS in your list of available JS files. What is the problem? This is the response from the server:

HTTP/1.x 200 OK

Transfer-Encoding: chunked

X-Powered-By: PHP/5.2.6

Expires: Thu, 19 Nov 1981 08:52:00 GMT

Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0

Pragma: no-cache

Content-Type: text/javascript;charset=utf-8

Content-Encoding: gzip

Vary: Accept-Encoding

Date: Fri, 30 May 2008 09:43:59 GMT

Server: lighttpd/1.4.19

Please contact me at: nenad.djordjevic@troxo.com

This is a limitation of the tool so far : Only external elements present on the IE cache can be displayed. If not present on the cache, they will not appear. I will work on this problem on future versions.
Thanks for reporting it.

1) The conflict with Firebug Lite (FBL) 2) If you discard FBL (firebugx.js or simply remove) still does not start catching in its console "console .*" calls

It's wonderful.I think the breakpoints is one important ability to add. Hope it become more and more great. Easy

Release early release often ... help us code in the right direction ;)

Love it ! just what i needed !!! Martin

Great workks. This add-on miss an JavaScript Object Inspector such FireBug ("..." is not very helpfull)

Another badly missing feature is the ability to add code breakpoints - Add this (and the object inspector) and you've got a great javascript debugger for IE.

Can we get a keyboard shortcut to open the window? Thanks!

This is really great because it catches the JS errors and actually reports the correct line number (imagine that) and the stack trace! This really has potential to take off. I would suggest you to include a way to see the JS pages and navigate through them, as well as debugging (breakpoints) features that others mentioned above. Other good features would be HTML inspector and being able to view HTTP requests. Thanks.

>> You can already get DOM inspector and HTTP sniffer (including Ajax requests !) with the DebugBar !

I was wondering if you can add a Memory Leak Detection tool... thanks!

>> I already thought about that. I will add it in my todo list ;-)

In IE7 (XPSP3) with Companion.JS v0.4.2 (and in previous versions) I often get the error "Document is not defined" (or similar errors) when opening a link in a new tab. If I refresh the page the page loads without erros

The language files for IETester can be found on the subfolder "Languages" in the IETester installation file, by default "C:\Program Files\Core Services\IETester". Languages included in the version 0.2.2 :

• Afrikaans (Thanks to Adriaan Nel)
• Arabic (Thanks to Ahmed Al Haddad)
• Bulgarian (Thanks to Angel Grablev)
• Catalan (Thanks to Bernat Lleonart)
• Czech (Thanks to Jiri Spacek)
• Danish (Thanks to Daniel Egeberg)
• Dutch (Thanks to Michel)
• English.lang
• Farsi (Thanks to Maysam Shahsavari)
• French.lang
• German (Thanks to Lothar Baier & Jonas Klose)
• Hebrew (Thanks to Neil Osman)
• Hungarian (Thanks to Daniel Nagy)
• Italian (Thanks to Giampaolo Petrosemolo)
• Japanese (Thanks to Toru Yoshimura)
• Korean (Thanks to Heeju)
• Latvian (Thanks to andrisp)
• Lithuanian (Thanks to Rimas Kudelis)
• Polish (Thanks to Rav)
• Portuguese Portuguese.lang (Thanks to Ricardo Baptista)
• Romanian (Thanks to Cristian Laza & Leila Maqtan)
• Russian (Thanks to Pavel Maryanov)
• Simplified Chinese (Thanks to Ma shuwen)
• Slovak (Thanks to empError & GizmoSK)
• Spanish (Thanks to Juan Martinez & Guillermo Galván Gómez)
• Suomi (Thanks to Olli (ollinpostit@gmail.com))
• Swedish (Thanks to Daniel Lindén)
• Traditional Chinese (Thanks to Ma shuwen & Bananasims)
• Turkish (Thanks to Erhan)
• Ukrainian (Thanks to Олесь Романюха)
• Vietnamese (Thanks to cuong thinh nguyen)

Here are translation files that are not yet integrated into the installer. You can download them directly and add them to the "Languages" subfolder to have this new language choice :

• Shqip (Thanks to Dren Ukmata)
• Slovenian (Thanks to Filip Komar)

To create a new translation, get one the existing file (your preferred langage), rename it by using one of the following names and translate the strings :

• BASQUE.lang
• BELARUSIAN.lang
• CROATIAN.lang
• ESTONIAN.lang
• FAEROESE.lang
• GREEK.lang
• ICELANDIC.lang
• Indonesian.lang
• Korean.lang
• Norwegian.lang
• SERBIAN.lang
• Swedish.lang
• THAI.lang
• TURKISH.lang
• Ukrainian.lang

When it is done, send the file to contact@debugbar.com so it can be added.

This tab will display all the http requests between IE and the web server. The requests are grouped by page, with special icons for AJAX requests and time/cache information for each request.

The request entry color in the tree has the following meaning :

• Black entries : Normal requests. IE sent a request to the web server and server headers and data from the server were sent
• colored entries : 304 not modified requests. Ie sent a request to the web server which sent back only headers with "Not Modified" info (no data)
• gray entries : Cached requests. No request has been made by IE. The data is retrieved directly from IE cache.

By selecting a request in the requests tree, data corresponding to the selected button will be displayed :

• Headers : Display headers sent and received by IE, as well as POST data if the request is from an HTML form.
• Content : When the data is text, it will display source code (html, javascript, css, xml, etc...)
• Timing : Gives info about request time, connection time, dns resolution time
• Info & Cache : Gives info about request size and cache info

Limitations

• When IE7Pro or Google Gears Helper are installed, the HTTP(S) tab may not work anymore. This is due to a conflict between those add-on. They are using the same API to hook the headers and overwrite each-other.

I'm using ExtJS and I'm actually rendering JS files. I return Content-Type: 'text/javascript' but I don't get my renderd JS in your list of available JS files. What is the problem?

1) The conflict with Firebug Lite (FBL) 2) If you discard FBL (firebugx.js or simply remove) still does not start catching in its console "console .*" calls

It's wonderful.I think the breakpoints is one important ability to add. Hope it become more and more great. Easy

Release early release often ... help us code in the right direction ;)

Love it ! just what i needed !!! Martin

Great workks. This add-on miss an JavaScript Object Inspector such FireBug ("..." is not very helpfull)

Another badly missing feature is the ability to add code breakpoints - Add this (and the object inspector) and you've got a great javascript debugger for IE.

Can we get a keyboard shortcut to open the window? Thanks!

This is really great because it catches the JS errors and actually reports the correct line number (imagine that) and the stack trace! This really has potential to take off. I would suggest you to include a way to see the JS pages and navigate through them, as well as debugging (breakpoints) features that others mentioned above. Other good features would be HTML inspector and being able to view HTTP requests. Thanks.

>> You can already get DOM inspector and HTTP sniffer (including Ajax requests !) with the DebugBar !

I was wondering if you can add a Memory Leak Detection tool... thanks!

>> I already thought about that. I will add it in my todo list ;-)

Thanks it's a brilliant tool and now I can use it at home for personal use as well :-)

Paul Duncan

In the first few days of using the DebugBar I have easily saved several hours of work (and made it possible to get a build into production by a deadline that I would have otherwise missed). It is an EXCELLENT tool.

Brett - Valtech Technologies

This thing rocks my socks. "Hero" is what I have named the developer.

Chris Carpita

The language files for IETester can be found on the subfolder "Languages" in the IETester installation file, by default "C:\Program Files\Core Services\IETester". Languages included in the version 0.2.1 :

• English.lang
• French.lang
• Portuguese.lang (Thanks to Ricardo Baptista)

To create a new translation, get one the existing file (your preferred langage), rename it by using one of the following names and translate the strings :

• AFRIKAANS.lang
• ALBANIAN.lang
• ARABIC.lang
• BASQUE.lang
• BELARUSIAN.lang
• BULGARIAN.lang
• CATALAN.lang
• Chinese.lang
• CROATIAN.lang
• Czech.lang
• Danish.lang
• Dutch.lang
• ESTONIAN.lang
• FAEROESE.lang
• FARSI.lang
• FINNISH.lang
• German.lang
• GREEK.lang
• Hebrew.lang
• Hungarian.lang
• ICELANDIC.lang
• Indonesian.lang
• Italian.lang
• Japanese.lang
• Korean.lang
• LATVIAN.lang
• LITHUANIAN.lang
• Norwegian.lang
• Polish.lang
• ROMANIAN.lang
• Russian.lang
• SERBIAN.lang
• SLOVAK.lang
• SLOVENIAN.lang
• Spanish.lang
• Swedish.lang
• THAI.lang
• TURKISH.lang
• Ukrainian.lang
• VIETNAMESE.lang

• IETester Screencast :

<object type="application/x-shockwave-flash" data="http://www.vimeo.com/moogaloop.swf?clip_id=830491&amp;server=www.vimeo.com&amp;fullscreen=1&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=DEA71E" width="480" height="360"><param name="allowfullscreen" value="true"/><param name="movie" value="http://www.vimeo.com/moogaloop.swf?clip_id=830491&amp;server=www.vimeo.com&amp;fullscreen=1&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=DEA71E"/></object>

• XP styles working for IE6 and IE7 instances

• Conditional comments are now working

• IETester is now working under Windows XP SP2

• First release of IETester for Vista with IE6 and IE5.5

• Corrected registration bugs at install
• Corrected a bug in the javascript console history
• Added checks if all the components are loaded and running correctly in the "About box".

• Added "console.log" feature under IE compatible with FireBug.
• Added history in the javascript console by using "up" and "down" keys

• First release of the Companion.JS with detailled error info, javascript console and view source features

• Greatly improved DOM tab : for each element, get the applied styles, computed style, layout and attributes
• Fully unicode and handling international characters
• Added Rendering page time in the Info tab
• Numerous code optimizations
• New and updated langages

• Corrected a crash ocurring occasionaly with external files (Reported and analyzed by Glyn, Many thanks for his help).
• Updated Czech langage version for DebugBar 4.1 by Miloš Vysoký

• Greatly improved HTTP(S) tab : get all HTTP(S) requests grouped by page with headers, timing and cache info, as well as AJAX requests
• Improved "Resize IE window menu" with DebugBar left panel handled in the size
• Autoscroll when selecting a dom node to display it
• Vista styles on Microsoft Vista
• Many new langages

• Correct a minor bug in the HTTP display tab

• Correct a conflict with Goodgle Desktop IE plugin (Reported and analyzed by David, Many thanks for his help)

• Connexion with CSE HTML Validator and Tidy validator to validate the html code of the current page.
• Keyword shortcuts : Alt+S opens the source code dialog, Alt+D opens/closes the developer bar, Alt+G puts the cursor on the google search
• Choice between PNG and JPEG format to email IE screenshot
• Fast access menu to source code of the main page and frames/iframes
• Revamped source code window with easy and fast search feature
• Preview of main attributes in the DOM tree for an easier browsing
• Information about the rendering mode : quircks or standard
• A lot of speed improvements
• Major DOM tree corrections and improvements
• Minor bug fixes

• Resize the IE Window using a menu
• CSS style selection in the DOM tree allows you to view the style attributes in the attributes list, to modify them and view the change directly in the current page !
• XP Styles support
• The DebugBar now supports 3 new languages :
  • German (thanks to Martin Specht)
  • Russian (thanks to Paul Colomiets)
  • Ukrainian (thanks to Paul Colomiets)
• Speed improvements
• Minor bug fixes
• Compatibility changes for XP SP2

• Handle Frames/iFrames with the zoom on the web page !
• Make a screenshot of the ENTIRE web page (including hidden scrolling parts) ! (Not available on web pages with framesets)
• Frames/iframes support
  • Frame/iFrame documents shown in the DOM tree
  • Elements inside frames/iframes retrieved with the Finder Tool
  • A tree of the frames/iframes is displayed in the JScript tab with all the JScript functions defined in each frame/iframe
• Activate HTTPS headers by default
• Display HTTP/S redirect, with a different color for an easy view
• Improved POST request data display

• Zoom
• Get script errors notifications with and send screen capture with useful information for debugging syntax coloring for HTML, Javascript, VBScript and CSS
• View HTTPS headers

• First release of the DebugBar with Dom Inspector, Javascript inspector, Javascript console, Http header viewer, etc...

• Current Version : 5.0
• Next Version :
  • We are working on which new features we will introduce in the new version.

There is no Beta version so far.

The next DebugBar version is under development... stay tuned !

IETester is a free WebBrowser that allows you to have the rendering and javascript engines of IE 6 and IE5.5 on Vista and XP, as well as the installed IE in the same process.

This is an alpha release, so feel free to post comments/bugs on the IETester forum or contact me directly.
Minimum requirement : Windows Vista or Windows XP with IE7

Download IETester

• When resizing, the content may disappear. I am working to correct it on the next version.
• The Previous/Next buttons are not working properly
• Context menu is not working
• Focus is not working properly
• This version may crash... (yes this is version 0.1.1) : It will not impact your OS.

Companion.JS (pronounced Companion dot JS or CJS) is a Javascript debugger for IE. The current version is 0.3.
Companion.JS adds the following features to IE :

• Detailled javascript error reporting (call stack and real file name where the error occured).
• "Firebug"-like Console API feature.
• Javascript console feature useful to inspect javascript objects at runtime.
• A toolbar icon to open the Companion.JS panel.

Download the installer, guaranteed spyware/malware free and packaged with a straightforward and complete un-installer.

The version 0.3 corrects some bugs and have an "install" check on the "About box" to check if all the components are loaded and running correctly.

Here are some screenshots :

In the top-left corner the notifying panel which pops-up when an error occurs in the current page if the Companion.JS panel is not open. At the bottom of the page...

Here is a sample video by John Hrvatin presented at Microsoft TechEd 2007 in Orlando showing some DebugBar usage :

DebugBar-Intro_Rendering.flv Δ

You can download the original video here.

Wiki Home

DebugBar Doc

• DebugBar Features
• DebugBar Install
• The Toolbar
• The Dev. Bar
• ChangeLog
• DebugBar Uninstall

Companion.JS

• Home
• Install
• Console API
• Options

What's next ?

• Beta version
• RoadMap

Tutorials

• DebugBar Demo

Public

• Testimonials
• Suggestions
• Bugs
• Discuss

edit SideBar

Here is the DebugBar version 5.0 beta 1

This new version introduces a new DOM tab with greatly improved features on the css side and is fully unicode !

Those new features have been added on the DOM tab. When an element is selected on the DOM tree, the following information can be displayed :

• Source : The tag source code will be displayed.
• Style : The tag style will be calculated and displayed
• Comp. Style : The tag computed style (that is the resulting style after all the css rules and inline rules are applied) will be displayed.
• Layout : The tag layout will be displayed.
• Attrs (existing feature): You can see the list of attributes defined for this tag, modify then and see DIRECTLY results under Internet Explorer !''' : Moreover, when this attribute is a "class" attribute, the list of all the defined attributes in the styleSheets are displayed in a combo box for the selection !

And the existing features are still there with HTTP/AJAX requests viewer, javascript functions viewer, javascript console, etc...

New : You can now use the Forum to discuss about DebugBar and Companion.JS features with the community.

S. Stock:

• Is there a release date for version 5?

Not yet.

New : You can now use the Forum to post bugs.

1. Google Maps API example

On Win XP Prof, Polish edition, IE 7.0

"Wystąpił błąd w czasie wykonywania. Czy chcesz debugować?

Wiersz: 687 Błąd: Arg: Fraction out of range (0 to 1 allowed)"

==> More details: http://nhw.pl/wp/2007/03/27/ie-errors-with-gpolyline-one-more-word/

We couldn't reproduce the bug on our side. If somebody else is having the same problem, please let us know !

2. Compatibility Issue with IE7Pro (AdBlocker part)

When I'm installing the DebugBar, the AdBlocker stop working... I wonder whether it is not the observation of the requests HTTP which makes doubled bloom (indeed, IE7Pro makes it possible to block some url download)

We will check this problem soon...

3. This code break the code highlight String.escape=function(string) {return string.replace(/('|\\)/g,"\\$1");}}

This is a known bug/limitation of our current code highlighter. We will try to fix it in a future release, but this is not a priority task so far. Thank you for the feedback anyway.

4. I installed the Beta version, i dont see anything popultaed in the HTTP(S) tab at all. Rest of the tabs work fine. IS there anything in the IE that i have to set to see the http/https information?

Sometimes, IE is disabling the DBB BHO used to get the HTTP info. Check on the IE "Manage add-ons" dialog box if it is enable, and if not, enable it. This should solve the problem.

5. I have the same problem that #4: I don't see anything populated in the HTTP(S) tab. I can't use your advice, because I'm using IE 6.0 and I don't have any "Manage add-ons" stuff. Any other suggestion of what can be wrong in my IE configuration?

I tested on win2000 and it is working ok. If you have some time for debugging, you can contact me directly at contact@debugbar.com so we can try to find the problem.

By the way.. I should (will) set up a forum which is more suitable for bug reports and discussions than a wiki !

6. When Companion.JS is actived, a Network Service (SVCHOST.EXE) use 100% of my CPU when it's possible (I've configured my computer to privilege programs and not system) and it make my computer slower

This is a bug on the version 0.1 : The Companion.JS is trying to connect to IE as a debugger every 0.5 seconds. When the script debugging is disabled on IE, this loop is using a lot of CPU :-( We will correct this on the next version.

To avoid the problem (and activate Companion.JS as well!) you can activate script debugging under IE by unchecking the 2 "disable" checkboxes in the IE internet options :

7. DebugBar icons are messed up after changing Windows theme. Tested on Win XP SP2, IE 7.

--Ricardo

Good point. This is a minor bug... but I will try to correct on a future version.

8.

When trying to use Companion.JS, I always see the script debugger window popping up, letting me choose if I want to debug with "Microsoft Script Editor" or "Microsoft Script Debugger". Regardless whether I say yes or no, Companion.JS doesn't receive the errors, the console stays empty. Even worse, when trying to type something into the console, the input area freezes (greyed out).

Is this somehow related to Microsoft Script Editor? I have disabled all three options in the preferences, even the "Show script errors".

Thanks!

--Paul (paul.bakaus at gmail)

Strange, It may depends on the system (I corrected a bug for this under Vista). I will contact you directly to try to correct the bug.

9.

Compagnon.JS

I install everything, follow all instruction but "console.xxx()" doesn't seem to be analysed !? May have someone experiment the same problem ?

Here is a image :

Hoppe you will found a solution !

--Frederic (frederic.klee at bluewin dot ch)

-- Mark Armendariz (enobrev at gmail dot com)

10.

I have the same problem as Paul in section 8 above. I've installed CJS, unchecked the debug options, but JS errors still insist on popping up the Microsoft choices (debug or script editor). And typing anything in the console freezes up the input box.

Interestingly enough, some errors do get handled by CJS, for instance on Microsoft's own Windows Update page there's a trivial error which does cause CJS to open instead of the strandard MS dialog. But 90% of errors still trigger that dialog instead of CJS.

I'd love to use this product ... so any update on this issue?

I'm running XP (2002), SP2, with IE7, all fully up to date.

edit - PROBLEM SOLVED! It's a .NET v2 Thing. Disable "Just in Time" Debugging by firing up MS Word, go to Tools->Macro->Microsoft Script Editor. In Script Editor, go to Tools->Options->Debugging. Click "JIT Settings". Clear the checkbox for "JIT Debugging". OK the dialogs. Close Word. Restart IE.

Thank you very much for the feedback ! I was trying to understand this problem for a few days so far and couldn't find any solution. I will try to setup a faq for Companion.JS for easier installation.

New : You can now use the Forum to send suggestions and discuss them with the community.

You can add here all the features you would like to have on future versions :

DebugBar

• let me view the content of text/xml, text/xsl, too in the http/https tab under the content button (maybe evan all content-types with an alternative hex view...)

Good point ! I will try to add the "text/xml" and "text/xsl" content display. For the hex viewer, I will keep it for a future version.

• ability to use console.log() from javascript (not only from console)

Already done : Using Companion.JS you can have console.log() feature from javascript !

• Add Unicode support

DebugBar will be unicode in the next release

• Allow DebugBar to unpin from IE and to make it floating, or to pin it at the bottom instead of the left.
• Improve CSS handling

S. Stock (I'm using DebugBar v4.1b2)

• I would like to have a filter on tab http(s) : somthing like show all requests | show xhtml-requests only

We will try to add it in a future release

• pin DebugBar on bottom of the page (yes, I like the firebug design ... )

Already in the todo (second suggestion at the top of the page)

• Is it possible to get much better javascript error messages?

You can try Companion.JS which gives more detailled info about JS errors under IE

• I would like to have the logging of http traffic always enabled even if Debugbar is not visible. Very often I wanted to see which files were loaded, but had debugbar closed... So I had to open it and then to reload the complete page.

Hmm... You are right, but I don't know if I will be able to add it on a future release (not technically difficult, but a lot of work). I will keep you informed through the wiki.

Ricardo

• Add W3C validators
• In Web Browser Spy windows, use "enter" key to search the next word instead of closing the window

This will be changed in the next release (v5.0 beta 1).

• In Language selection, remove the "English (default)" entry (duplicate with "English")

This will be changed on the next DebugBar release

• Implement the ability to select what buttons to show in the DebugToolbar

Scheduled for some day, but not priority so far...

S. Bilodeau

• I would like to have the ability to filter out some warning/error types in the HTML Checker (right-click - don't show warnings/errors of this type) because sometimes I have like 2000 warnings that say "missing alt attribute" and I have to scroll through this to find the 2 or 3 other problems I want to fix. Thanks!

Compagnon.JS

FremyCompany say:

• JavaScript Object Inspector (like FireBug)
• Possibility of executing a multi-line code in the console
• Remove the "A new version of...." advertice remplacing all operation on the console
• Add support for BreakPoint + BREAK-ON-ERROR option (true/false)
• Detect all variables of the function when a break is active
• Navigate different step of the call-stack (F1(a,z) ==> F2(a,k) ==> F3(k))

This is already done in Companion.JS : The error on the right can be expanded as a tree to view the call stack.

Mark Roeling:

It would be nice to have some documentation like http://www.getfirebug.com/docs.html. What are the available console / code commands?

You are right. We know we need to do it (!).

Nazir Khan:

I am unable to modify the text, for ex: I have the following code in my web page, i could not able to modify "This is text"

<SPAN title="This is title">This is text</SPAN>

This feature is scheduled in future versions. Stay tuned !

S. Stock :

• It would be nice to have a little icon to clear the error message console. Also, after reloading the page the error message console should be empty again.

Are you talking about the "console" tab on the Companion.JS tool ? If so, yes, adding a button to clear the log is a good idea. I will try to add it as an entry in the context menu.

No, I'm talking about the "source" tab and the error messages on the right side. After a while of debugging I have a lot of old error messages in there...

But I guess it would also be good to have a clear button on the console tab.

Really strange, this should be cleared at each new page. Maybe you are using ajax requests to update your page. In this case, there is no "page" reload so it is not cleared. I will add a "clear" feature on the next release ;-)

• integrate Compagnon.JS into debugbar

Right... I could add this to debugbar installer to install Companion.JS as an option. I will try to integrate that on the next release.

Goto line of code

If you have an error it could show a button to go to directly to the line of the code that generated that error.

This will save a lot time! Tks, Gian - gian.peduto at gmail.com

It already exists : You can use Companion.JS which gives detailled info (with line numer and source code) as well as stack trace of the error !. This is an alpha version and will improve soon.

Welcome to the DebugBar Wiki

For anti-spam security a captcha has been added to the page edit form.

New : DebugBar v5.0 beta 1 is here : Try it Now !

New : Companion.JS v0.2 released with console.log feature : See what's new and download NOW !

This web site is for DebugBar community to get news about next releases, tutorials and samples on how to faster your developments with DebugBar, share experience, improve DebugBar usage, give suggestions, report feedback, bugs, etc.

The Public section is opened to everybody so you can give testimonials, suggestions and report bugs.
You can also help us by translating DebugBar in a new langage and get a free professional licence.

The existing DebugBar web site will stay to download the latest stable release as well as buy corporate licences.