Thursday, November 29, 2007

Debugger for IE - The Debug Bar.

Looks good at first impression, I'll update more on this post when I evaluate it.

The DebugBar V4.1.1 is an Internet Explorer plug-in that brings you new powerful features :

  • DOM Inspector: View DOM Tree and modify tags attributes and css attributes on the fly to test your page
  • HTTP Inspector: View HTTP/S request to check cookies, GET and POST parameters, view server info
  • Javascript Inspector and Javascript Console: View javascript functions for easier debugging, see Javascript and AJAX code
  • HTML Validator: Validate HTML code to correct and optimize your code and html size of your page
  • And many more features: See page cookies, get pixel color on a page, make a page screenshot...

For Scripting Debugging, there's a post in IE Blog:


CSS Properties to JavaScript Reference

I love this little page, it helps me alot alot alot in my AJAX development.

The page lists the properties mapping from CSS to Javascript, which is essentially what every javascript developer needs to know! when you deal with DHTML, AJAX, that's what you need.


ASP.NET Controls emiting stylesheet "inline-block"

I'm going (at least hoping) to get perfect codes to feed my little firefox and IE. Thanks for the Error Console in Firefox which let me easily spot out what's wrong that the firefox doesn't handle.

And there it comes, it says cannot parse the "display" value. and I've search up and down in my ASP.NET pages, including the MasterPages for the keyword "display", no luck, I didn't write it!

So, the easiest way is ofcourse, do a search on the source code in Firefox (the source that is after render). and I've found the culprit -- my custom server control is emitting style="display:inline-block", which is automatically being rendered by the ASP.NET base control.

It turns out to be that as long as you set the Width (or Height) of the control and you didn't overrides the Render (instead suppose you are using RenderContents), the ASP.NET Web Control base class will render the IE-friendly but non-standard "display:inline-block" in the control's style (wrapped in SPAN tag).

So the obvious and most easy way out is, to override the render function so that it doesn't emit the buggy stylesheet declaration, but the drawback is that you'll need to write some codes to handle the style sheet in that case.