Chrome web inspector

I use Chrome web inspector to inspect a开发者_开发百科ll variables.

When I hover my mouse over a variable a yellow popup box appears and I can see what that variable is referencing to.

Sometimes it's an object that has a lot of keys. Is there a way to make this yellow box larger?

You can run chrome with your own custom dev tools http://code.google.com/chrome/devtools/docs/contributing.html

In short,

1. Download devtools_frontend.zip
2. Extract the files (possibly to C:\src\chrome\devtools_frontend)
3. Open Popover.js

4. Find the line where it says:

   preferredWidth = Math.max(preferredWidth, 50);
   

   and replace it with

   preferredWidth = Math.max(preferredWidth, 500);
   preferredHeight = Math.max(preferredHeight, 500);
   

   this will make the minimum size of the popover 500px X 500px

5. Run chrome with your custome devtools:

   chrome.exe --debug-devtools-frontend=C:\src\chrome\devtools_frontend