Live data from Hacker News

Firefox Developer Tools – Editable box model, Sublime Text keys

hacks.mozilla.org

81–90 of 118 posts

Re: Firefox Developer Tools – Editable box model, Sublime Text keys

#81
post #72

Earlier quoted context omitted.

Firefox is Free software, Chrome is proprietary and made by the company that employs this guy: http://mostlysignssomeportents.tumblr.com/post/84829703425/r... I know what I'd choose.

> Chrome is proprietary Use chromium instead. > the company that employs this guy: http://mostlysignssomeportents.tumblr.com/post/84829703425/r Mozilla employs someone who is (was?) anti-gay marriage.

    > Mozilla employs someone who is (was?) anti-gay marriage.
Funny that Mozilla had employed a stance, but grammar aside, Brendan Eich isn't employed in Mozilla anymore. In fact he quit under pressure for contributing to an anti-gay marriage campaign.

Eric S. is as far as I know still employed by Google.

Re: Firefox Developer Tools – Editable box model, Sublime Text keys

#82
post #80

Earlier quoted context omitted.

Chromium is open source.

I'm tired of hearing that argument. Chromium !== Chrome. Call me back when Chromium, not Chrome, wins a 20% share of the browser market.

It's an essentially identical browser. The main difference is the branding it ships with. The experience is very much the same.

Re: Firefox Developer Tools – Editable box model, Sublime Text keys

#83
post #80

Earlier quoted context omitted.

Chromium is open source.

I'm tired of hearing that argument. Chromium !== Chrome. Call me back when Chromium, not Chrome, wins a 20% share of the browser market.

Chrome is simply a packaging of Chromium with nonfree third-party plugins: https://code.google.com/p/chromium/wiki/ChromiumBrowserVsGoo...

There is no such thing as Chromium browser, just packages of Chromium source built by different distributors like Ubuntu, Red Hat, etc. You might ask to be called back when a particular packaging other than Chrome gets significant share, but if you ask when Chromium (including all packagings) gets significant share, that's already happened.

Re: Firefox Developer Tools – Editable box model, Sublime Text keys

#84

Earlier quoted context omitted.

> multiline console Shift-enter in the Chrome console creates a newline rather than executing. > live highlighting html as it changes In the Rendering tab (bottom panel) there's a toggle for "Show paint rectangles" which sounds like its close (but not quite the same) as what you're looking for.

> Shift-enter in the Chrome console creates a newline rather than executing. this is not only a major pain in the ass, but also much much worse than just having a persistent multiline editor window that keeps your code, cursor position and selection intact between executions. there is simply no comparison here.

Use snippets and just hit the run button for a near-identical experience. There is a keyboard shortcut for it too IIRC

Re: Firefox Developer Tools – Editable box model, Sublime Text keys

#85
post #80

Earlier quoted context omitted.

I'm tired of hearing that argument. Chromium !== Chrome. Call me back when Chromium, not Chrome, wins a 20% share of the browser market.

Chrome is simply a packaging of Chromium with nonfree third-party plugins: https://code.google.com/p/chromium/wiki/ChromiumBrowserVsGoo... There is no such thing as Chromium browser, just packages of Chromium source built by different distributors like Ubuntu, Red Hat, etc. You might ask to be called back when a particular packaging other than Chrome gets significant share, but if you ask when Chromium (including all…

The whole point of the "Chrome is proprietary" argument is that we don't know exactly what Google added to Chromium.

Since the diff between Chrome and Chromium is not open-source, there's no way to verify that Google only added what they claim to have added. For example, we wouldn't know if they slipped in an NSA backdoor along with a bunch of plugins.

"Trust but Verify": https://blog.mozilla.org/privacy/2014/01/14/trust-but-verify...

Re: Firefox Developer Tools – Editable box model, Sublime Text keys

#86
post #55

Earlier quoted context omitted.

Same here. I still feel Firefox devtools are not innovating fast enough. Chrome workspaces and a lot of other useful features are just not present in Firefox. I feel that's one of the major reason I could never migrated to Firefox professionally. I am also quite impressed with IE 10 & 11 devtools. It is really useful and has clean UI and UX. In short I could say that: Chrome Devtools > Firebug > IE devtools > Firefox…

I'll use chrome devtools the day they add multiline console support. Really? In 2014, and you want me to shift-enter 200 lines of code?

In chrome dev tools if you have multiple lines of javascript you should take a look at 'Snippets' under the 'Sources'. It's quite a nice editor to run blocks code on the DOM when you need.

Re: Firefox Developer Tools – Editable box model, Sublime Text keys

#87
post #66

Just installed it from Aurora channel. I have not used firefox for couple years now (moved to Chrome) but I think I will jump back now. The only thing in dev tools missing so far for me compared to Chrome is :before and :after pseudo elements, I love how Chrome dev tools shows it as a separate entity in the inspector tree. I hope FF team implements it as well.

Do you see the live editing of JS and on save they getting executed in a VM? I think it is pretty rad and not present in FF devtools at all. Please correct me if I am wrong.

Re: Firefox Developer Tools – Editable box model, Sublime Text keys

#88
post #66

Just installed it from Aurora channel. I have not used firefox for couple years now (moved to Chrome) but I think I will jump back now. The only thing in dev tools missing so far for me compared to Chrome is :before and :after pseudo elements, I love how Chrome dev tools shows it as a separate entity in the inspector tree. I hope FF team implements it as well.

That's good to hear. I have been using Firefox Nightly since quite a few months now. It's impressive. :)

Re: Firefox Developer Tools – Editable box model, Sublime Text keys

#89
post #11

Earlier quoted context omitted.

Long time ago I used Firebug. What do you see is better in Firebug than Chrome Devtools?

my peeves (in order of annoyance, desc): - inspecting ajax responses in console without flipping to net panel, then hunting for the correct request. - keeping an inspected/selected html element highlighted on page, not just on mouseover so you can see element bounds. this is useful for tweaking sizing, padding, margins and position. - as-i-type updating of html rather than on blur - live highlighting html as it chang…

I rarely need the console tab in the chrome devtools because hitting Esc is normally way faster. Also having the tabs in a defined order allows you to use Cmd+n to switch between them (and the number stays the same).

Re: Firefox Developer Tools – Editable box model, Sublime Text keys

#90
post #79
post #55

Earlier quoted context omitted.

I'll use chrome devtools the day they add multiline console support. Really? In 2014, and you want me to shift-enter 200 lines of code?

Why are you putting 200 lines of code into the console?

I have to say, I stared at this question for a while. I have such a large reliance on using the console as a scratchpad, before ever even opening a script file, that I don't think I've even considered the possibility that one could do front end development work without it.

The best answer for you question, would be that throughout my career, the number of situations where I could directly edit a source javascript file, write-run-test-iterate in a typical software development cycle is in the far far minority of the amount of time I've spent writing javascript.

The vast majority of my time, iterating changes to javascript files is non trivial. Some examples include

Major CMS / CRM systems I've worked on where, even if I have all relevant source code, even finding the location where the page's javascript is generated or stored is non-trivial.

Major CMS / CRM solutions where making a change to a single javascript file can result in a 20 minute process before you can see those changes reflected in the browser.

Situations where I simply do not have access to the source code, but am none the less manipulating javascript on the page (for example, custom WPF applications that inject js into every page visited in the wpf web browser)

Or my current situation, where my company hosts some ~30 different web applications, and fully understanding the processes involved to get to the final page state where I will be doing my work is non-trivial.

---

But perhaps the best reason, is when debugging. With javascript, I can simply navigate to the problematic page and say module.function = myNewFunction();

If I start by copy pasting the source for the problematic code into myNewFunction in the console, then I can iterate my changes with 0 regard to how the javascript is served to the page. All my changes are instantaneous, and don't even require a refresh to see take effect. As such, my development time is usually much faster than constantly editing a source file, particularly if that backend framework doesn't update its js when noticing file changes, and is massively faster in any of the situations listed above.

But the real key is that once you get used to working in this fashion, it starts to make sense to use the console as your scratchpad to flesh out ideas before ever actually writing real production code whatsoever, in any situation. It just becomes so nice to be able to flesh out your js ideas on the fly, with 0 regard to framework, and against your target environment.

But this workflow is entirely impossible in chrome, because every time you want to run your script, you have to hit ente, and every time you need a new line you're shifting, and then you're up arrowing over versions, etc, etc. With firebug, I can just continually edit the text in the console until I'm happy with the results, and then I can keep that on the screen and use it as a reference while I write my (hopefully much nicer) real production code in a source file somewhere.

Post reply on HN