Friday May 16, 2008

DOM Inspector in Firefox Sidebar

In this entry I talked about how to show Google Talk in Firefox Sidebar. Using the same technique you can show the DOM Inspector in the Firefox Sidebar. That way you can get the DOM Inspector in the same window as the page you are inspecting.

UPDATE: You can simply install this add-on in the Firefox browser. It will add a new menu item Tools:DOM Inspector in sidebar .

SidebarDomInspector Menu Item 

Selecting this menu item will show the DOM Inspector in the Firefox sidebar. It also makes the sidebar resizable.

Here is the NetBeans 6.1 project to build the extension.

Here is how. Just create a bookmark like this:

DOMInspectorInSideBar Bookmark

and then invoke the bookmark. Then use the File:Inspect Window > menu item to select the window you are browsing in. You will see something like this

DOMInspectorInSidebar

Unfortunately the Sidebar is not resizable. However this could be tweaked using the property overlay incantation overrding the flex attribute of the sidebar box. Also the popup dialogs to search for  nodes does not work. Once again some XUL overlay gimmickry could come handy here.

Useful? You decide.

About

sandipchitale

Search

Archives
« April 2014
SunMonTueWedThuFriSat
  
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
   
       
Today