I am trying to debug a problem, and I am using the View Page Source in Chrome.
A large portion of javascript and html is presented scrabled i.e. in a format with no identation and like:
gt&blabla&gtetc
Is there a tool/way to always get a good format of the generated source?

I am trying to debug a problem, and I am using the View Page Source in Chrome.
A large portion of javascript and html is presented scrabled i.e. in a format with no identation and like:
gt&blabla&gtetc
Is there a tool/way to always get a good format of the generated source?

• javascript
• html
• debugging
• browser

Share Improve this question Follow asked Aug 5, 2013 at 16:53 JimJim 19.6k4141 gold badges146146 silver badges266266 bronze badges 4

• superuser./questions/315260/… – HttpNinja Commented Aug 5, 2013 at 16:55
• opera dragonfly formats the code well and is a nice debugger for javascript – bansi Commented Aug 5, 2013 at 16:55
• Maybe you want the DOM view instead. See developers.google./chrome-developer-tools/docs/elements. – Felix Kling Commented Aug 5, 2013 at 16:55
• 1 use this site to beautify your code ctrlq/beautifier – Vinod Louis Commented Aug 5, 2013 at 16:56

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3

Open the developer tools: Ctrl+Shift+I or simply F12

You can see a nicely formatted and indented tree view of the source code under the Elements tab.

If you hit F12 it will pull up the developer tools which gives you real good access to the source and scripts.

You can install chrome extension Quick source viewer

• Once installed, click on the Extension icon (top right of chrome which looks like puzzle), and pin the Quick source viewer you just installed
  • This would make the icon appear on the top right
• Now, open any page you want to view the source of and click on the Quick source viewer icon
• You will see the page source opened that shows all the details in a better way

Note: If the icon doesn't work, restart chrome after installation