CODEWITHSUNDEEP
firefoxfirebugfirefox-developer-tools
vsync
vsync

Reputation: 130670

Firefox Developer Tools JS editor (like firebug)?

enter image description here

Does anybody knows if there is a way to show a javascript code editor in Firefox Developer Tools which looks like firebug's?

I find it a lot more convenient to work this way on large, complex pieces of code, where I can see the code on the right side and the result on the left.

Upvotes: 3

Views: 888

Answers (2)

Mehdi Dehghani
Mehdi Dehghani

Reputation: 11601

Head over to Toolbox options (hit F12, then click on gear icon), under Default Developer Tools check the Scratchpad (this will add new tab in developer tools, like Console & ... called Scratchpad), click on Scratchpad to activate that.

As @pbrosset said, in Scratchpad you can write JS codes (it's really great) and using Ctrl+R (you need to select the code for that) or using Run button, you can run the code. the result will shown in Console tab, if you want to see Console & Scratchpad without moving to their tabs, simply hit Esc or click on Toggle split console icon.

Hope this help.

Update

Maybe you should try this add-on Console Sidebar

Upvotes: 2

pbrosset
pbrosset

Reputation: 749

Firefox DevTools has something called Scratchpad which resembles the code editor of Firebug.

It's a separate window, but there's a way to have it as a panel inside DevTools too.

Additionally it supports the ability to save/open scripts, has autocompletion based on tern, pretty-printing, and can even let you execute code in Browser context (which might be useful if you're ever working on the Firefox front-end itself).

Upvotes: 4

Related Questions