/dev tips

🎊   The Modern DevTools course has now started! Visit ModernDevTools.com to find out more   🎊

(39) Try out JavaScript ES6 Preview JS values inline while debugging (41)

Chrome DevTools: Quickly view/edit CSS or JavaScript resources from the Elements panel.

21 May 2015
Quickly view/edit CSS or JavaScript resources from the Elements panel.

If you see resources in the Elements Panel DOM tree, e.g.

<script src="app.js"></script>
<link rel="stylesheet" href="styles.css">

You can right click on them and select Open. The file opens in the Sources Panel where you can view the full source, or start editing it!

Sign up to receive a developer tip, in the form of a gif, in your inbox each week.