I was impressed by their question, and now even more so by incredibly quick results! I switched back to Firefox a few days ago (from Chrome) and this really solidifies my decision.
What a stellar response to feedback. Thank you Mozilla. I'm currently a big Chrome Dev Tools fan, but I, er, am currently thinking of that beautiful girl I ditched again, if you know what I mean...
Wow. I haven't had a chance to read the article yet, but the video where they are editing live in sublime text is awesome. Does this have to open in a new file or can it override an existing file?
It'd be really cool to be able to do the latter. I usually make changes in chrome dev tools and then copy the results into the relevant CSS file.
You might be interested in checking out Brackets (http://brackets.io/) which has some live development capabilities for CSS at least right now. I believe it only works with Chrome though, currently.
So that's why every time I start typing a reddit url, Chrome suggests I visit http://www.reddit.com/r/gone wild (sic, with the space in there).
There are a number of reasons why they really need to rethink this, default it off, or do some better filtering. Didn't impact me personally beyond the confusion but I could imagine that URL and maybe some others coming up in what appears to be someone's unique search or browsing history raising some interesting questions at work and/or at home for some users.
I am surprised not a lot of people at HN do this. Disabling predictive service is one of the first things I do after installing chrome on a new machine. Something about sending every keystroke made on the omnibar to Google makes me feel uneasy, it could also be the paranoid in me talking.
I appreciate this feature on mobile as it can help save me some more time-consuming taps, but I don't use it on Chrome since I can type faster than I can browse through the results it's guessing at.
I've personally internalized the downdown for going to things I've gone to before.
However, I do brand new searches constantly. Often 20+ a day, that often look similar to older searches, but aren't quite.
Now, whether I've developed that behavior because of Chrome, or because it works well for me, is a question for itself.
Also, since I'm here- anyone get frequent fuckups lately in the Chrome omnibar, not searching what you put in, to instead search something you HAVE searched before?
For example, before, I've searched "javascript array"
But this time, I am wanting to search "javascript string concatenation". I type that into Chrome, hit enter...
...up pops the search results for "javascript array". It started about a month ago, and is really annoying.
I've noticed frequently Google Instant will fail half way through searching, and it will ignore everything I typed and just go with what Instant guessed before it crapped out.
If Instant is prioritizing your previous search, it may be linked.
In Firefox, the hotkey "cmd-K" will put focus into the search bar at the top.
In Chrome they don't have a keybind set to this by default (though on Windows they seem to). But if you open mac System Preferences, go to Keyboard, then Keyboard Shortcuts, and add an Application Shortcut for Chrome, you set the menu item name to "Search the Web..." and the keybind to whatever you want (I used "cmd-K").
So that way regardless if I'm in Firefox or chrome, pressing cmd-K will put me in a place I can search.
> It started about a month ago, and is really annoying.
Yes, I have been encountering the same behavior. It is infuriating because it's impossible to tell when this is going to happen. This is separate from pulling up different searches I've used before, this bug seems to be something like "ignore what you type completely".
Aurelio's used to have amazing pizza before the original owners sold it and it became a franchise. Don't waste your money, there's plenty of better options.
Also, I agree with you regarding Chrome's Google search priorities.
Also, putting "* " in the awesomebar before typing searches your search string limits the results to bookmarks. Here is a list of these prefixes:
Add ^ to search for matches in your browsing history.
Add * to search for matches in your bookmarks.
Add + to search for matches in pages you've tagged.
Add % to search for matches in your currently open tabs.
Add ~ to search for matches in pages you've typed.
Add # to search for matches in page titles.
Add @ to search for matches in web addresses (URLs).
Perhaps so, but it still seems unscientific. I even left out that an even better test would be if you had identical history in both browsers (which I know would be inconvenient to set up). I honestly do not understand why I am being downvoted.
yeah and you can get chrome behavior in ff in the search bar, too. well except for the bug of course. The ff search bar does search for what you typed, not what you typed last. (and does shows instant results, too) best of both worlds.
I prefer Firefox Awesomebar as I find that when I type something in to search my browsing history it usually returns what I was looking for.. Chrome not so much. EDIT: what sergiotapia said ^^^
Like sergiotapia, I'm very close to switching back to FireFox /because/ of the Awesomebar. However, for me, it's because it matches my search history better. Let's say I'm working on a page call /editor/?id=1234, in FireFox, typing 1234 will show that page as the first match, whereas Chrome doesn't even match it unless I start typing /editor/, and sometimes even the root domain. It's very frustrating.
HackerNews is the best example for me. In firefox, I can type in y, and it will know that I want news.ycombinator.com. In Chrome, the only way to have it autocomplete (at least the last time I tried it) was to start with n.
There's a Firefox addon called Instantfox [1] which makes the Awesomebar behave somewhat more like the Omnibar. Possibly too much so, depending on your preferences.
I removed search box from Firefox few months ago and never looked back. I use search engine keywords instead[1]. My current keywords include goog, bing, amzn, crate, and wiki. Guess what search engine they refer to. :)
I really, really prefer the search box. For me, searching the web and searching my history are very different intents; so activating them with different keystrokes doesn't seem like much of a burden.
I did too, but Google instant changed things. Try this:
1) Set your search engine to Google (if it isn't currently)
2) Remove the search bar.
3) Press ctrl+k (cmd+k) and start typing. You'll be searching on Google's site, by far the best search experience with Google Instant on.
The only downside is that you need a reasonably fast, low-latency connection for it to work well[1].
[1] Fine with decent Internet service, but what a downside it is on a lesser connection. The ~0.5-1 sec delay was unbearable on a 3Mbps DSL connection with average latency.
I preferred Chrome's Omnibar to Firefox's AwesomeBar as well, but then I found this FF add-on https://addons.mozilla.org/en-US/firefox/addon/omnibar/. One advantage I have always preferred with FireFox is that it's add-ons can have tighter integration with the browser than Chrome's extensions. In example, one such add-on that Chrome can't do is FireFox's Last-Tab add-on. It lets you switch between tabs in the order they were used. After getting used to that work flow, I have a hard time using any browser other than FF. To me, Firefox seems more extensible than Chrome.
I like how Firefox completes the site I want with only typing 1 or 2 characters in the address bar.
Also Firefox has a separate search bar that supports plugins (dictionaries, CPAN and stuff like that)
Chrome's Omnibar constantly auto-completes searches I did earlier in the day and week, so that I often have to press delete before enter. And there is no settings toggle to turn this off.
(I'm not talking about the completion dropdown or what it contains, I'm talking about how the typed text in the input area has selected text appended to it when it happens to be a prefix for an earlier search.)
Between this, the lack of tree style tabs, and the weird text selection algorithm, I'm generally sticking with Firefox.
On re-reading, I've now realized polskibus was referring to sublime as a tool which IS available cross platform.
Like the downvoted comment I too initially read it as that he thought it WAS NOT cross platform based on thee here he postitioned his example near his Apple comment and hence why the 'sublime is available cross platform' comment made good sense to me.
Really nice you are listening and responding to the community this well, that said the progress made during hack week is impressive but we'll have to see how fast and stable these suggestions leak through to nightlies and stable release.
Keep up the stellar work, firefox is gaining momentum again, make good use of it :)
Excellent, the network timeline is one of the features that has kept me on Firebug. The editor integration looks quite intriguing as well. Wonderfully rapid response, Paul! I may no longer have an excuse not to use the built-in dev tools. :)
I have another bit of feedback. The web console has three positions available: Above, Below, and Window. With Firebug, I like to have the console open in another monitor and give the browser viewport maximum screen real estate in front of me. Firefox's web console doesn't let me do this because in "Window" mode it doesn't quite act the same as a fully-fledged window. For example, I can't maximise it and it doesn't have the full complement of normal controls in its window bar. http://i.imgur.com/V7eWC1m.png
My apologies, I remember in the original post you asked us to hold off on providing feedback unless the issues were present in recent Firefox versions. On the plus side, this motivated me to switch to Firefox Aurora just now and I must say, I'm extremely impressed!
I've been using Aurora for the past few weeks, and really enjoy it quite a bit. I'd been using Chrome for the past few years, but the recent shenanigans by Google was enough to motivate me to take a few more steps away...
I've been using Aurora for the past year or so, and haven't look back much. Occasionally I'll switch back to Chrome, but that's only when something in Aurora or nightly is broken.
Thanks... just realized that thanks to you.. have to long-click on the dock/window icon to switch modes to side/bottom dock. Not quite intuitive, but wouldn't have tried if not for your comment.
While right-side docking is great, especially for widescreen monitors, separate window for devtools would be much better improvement. In this case anyone can 'dock' them any way they like it. More important, you can have dev tools on one screen and page view on another.
Thank you for opening up to this community. For better or worse, I feel the HN crowd has it's head together and will always give good feedback on products.
It proves that they are developing functionality that I've been looking for and some I didn't even know I wanted.
It is evidence that they want to be a great tool for developers and that they recognize their tool needs work.
It proves that I made the right decision (completely subjective which is the nature of a comment like the one I made) in moving away from Google for a more user centered and open-source browser.
And yes it proves that they listen to their users.
All of that is assuming they weren't lying or creating fake mockups (which I feel is a safe bet). Sure that's not a lot of proof for a scientific theory, but for a decision on which browser I want to use and which company I want to support I think it's proof enough :-)
I still don't get it way mozilla made it's own devtools, instead of integrating and extending on firebug. Had the devs of mozilla and the one of firebug diffs, which couldn't be solved?
One small thing that I haven't seen yet (in FF or Chrome) is a feature where I could get the IP address that was used to retrieve a given resource in the network tab. This would be hugely helpful when dealing with sites that are backed by more than one server. Also, ability to reset DNS cache (BTW, DNS cache seems to be shared between private and regular browsing modes).
<edit>The ability to lock onto a specific IP for a given domain would be pretty kick-ass too. Not a replacement for /etc/hosts, but just choosing one of the 2 IP's for example.com, etc.</edit>
Another nice feature would be to get the network tab to ignore resources loaded from external domains, only show external resources, or show both. Maybe even more fine grained with/without subdomains.
I find the responses here really strange, has anyone here actually used the devtools in pratice? The firefox devtools seem to me just a awful waste of time from the beginning, they are years behind the competition and the development progress is so slow that I've given up on them. I'm using firefox as my main browser but for web development (dom/css inspection, javascript debugging) there is currently nothing that beats the chrome devtools.
> there is currently nothing that beats the chrome devtools.
That's the point of this post. It's that pretty soon, Firefox is going to have much improved devtools. They include some features that interest us greatly.
It's hard to pinpoint one thing. They're just much more usable and don't make you fight against it. It just gets out of your way. That's great UX design right there. Just measure the amount of key strokes, clicks, time and overall actions needed to do one thing in Chrome and the same in Firefox. You'll be amazed.
I would hope or presume that Firefox's tools eventually do get this level of polish, though. Chrome (and even Safari) has had quite a bit of a head-start, and neither of those were shining examples of great UX at the beginning.
Sure, let me try by comparing it to the competition: the firefox devtools, firebug and opera inspector (I haven't used anything else). I'm using the chrome devtools for DOM inspection (HTML and SVG), CSS development and debugging, javascript repl and debugging (and via node-inspector also for server-side debugging) and HTTP profiling and protocol debugging. So I'm using it primarily for web development but its also an invaluable tool for web scraping where you can just copy&paste xpath expressions from the dom inspector for instance.
The Opera Developer Tools (Opera Dragonfly): The UX is done well, the markup editor works even better than in chrome and I like the screenshot utility and color picker. The css inspection is inconvenient when you want to change properties or add new rules. The network log is done well but the UX can become confusing, the make request feature is exceptional I don't know any other devtool that has that integrated. No xpath in the dom inspector.
Firebug: This was the first browser devtool afaik so it has a long history and years of development behind it, I always considered it to be "the firefox developer tools" and I was really surprised when mozilla announced they would recreate it on their own instead of just integrating firebug. But I guess they have their reasons.
Firebug has a great UX, everything is fast and polished although it has become a little old, it still integrates nicely in the current firefox UI. The dom and css inspector is great, it allows to quickly change anything you ever want, with the exception maybe that you cannot add new css rules (only element styles). The network inspector is exceptional, best of all 4. I don't like the console/REPL but its alright. Overall still my second favorite.
Chrome Developer Tools: Provides by far the best UX and is clearly the most powerful devtool around. Its also the only reason why I have chrome installed, my main browser is and was always firefox. The css inspector is just great, you can update or add new rules and properties and it has great auto completion. I don't like the dom editor through, the edit as html feature lacks a bit. Javascript debugging and the console work exceptionally well and you can even edit and save your code within the devtools. It has HTML5 builtin features for web workers, indexedDB, local storage, etc. You also can use it to debug nodejs applications through node-inspector.
Firefox Developer Tools: I must admit, I don't even know where to begin. The UX is just awful: From the alien dark-blue that doesn't integrate at all with the rest of firefox and the font sizes that you can't change to the strange dropdown menu/button combinations in the latest version. The DOM inspector doesn't allow you to edit html directly, has no xpath and the css inspector is confusing and doesn't has autocompletion. There is no resources overview, no networking debugging and profiling.
I do however acknowledge there is some progress in the latest snapshots, I like the scratchpad, style editor and the UI overhaul made it a bit more usable. There are still no settings, still no way to change the dark theme. I don't say it isn't making some progress, but its so slow (they say they need a few months for the python api alone), that chrome will have progressed well beyond and I don't see them catching up.
How many devs actually use Firefox's dev tools? I see all of that praise "looks awesome, looks amazing, etc" But do people really use those amazing things? I just find the Chrome dev tools orders of magnitude more usable than Firefox's. It's mostly a large amount of what you could call details but it makes all the difference. It all flows better, reduces the amount of thinking you have to do as well as the number of clicks and keypresses. I think Mozilla should start by fixing all of these little problems before jumping into huge stuff like they seem to like to do with the cli, python library etc.
I'm not sure. On topic, could you enumerate some of the specific areas where the Chrome tools "flow" better? I've pretty exclusively been a Fx dev. tool user for the past few months, so I'm personally not sure how things are on that side these days.
Are there any plans to implement an instrumenting profiler in addition to the existing one? Not having call count is a huge minus for me. Devtools has a sampling profiler like Chrome (which also doesnt provide call counts). So the only instrumenting profilers remaining for JS on Windows are Firebug and an outdated, abandoned version of Safari :(
The timeline needs to show protocol. Btw this already exists in Firebug. Why duplicate effort? I'm sure this hass been asked before. But why have devtools instead of improving firebug? (Performance?) What will happen to firebug in the long run ?
Edit:
* In inspect view, can we have a search HTML function like firebug?
* Also in inspect view, a way to disable the display of PATH.
The jsfiddle style looks good, but how does that work with multiple files on the page? Do you select the files you want to work with?
Not sure if it's possible, but I think it'd be cool to highlight which lines have been live edited.
One bit of feedback about editing CSS: it'd be great if, when editing a property, using the arrow keys cycled through the default properties. I.e. border-style goes through solid, dotted, none, etc.
In order to get to that modal message, you first have to go and enable remote debugging, which is not something normal people would do. And in general, even though we can (and already have) come up with even more mitigations for the potential threat, the sad truth is that security and usability are fundamentally a tradeoff, so you have to strike a balance at some point.
And, I understand that. But, the drawbacks of the security implications of your development/developer browsers being thus weakened is, IMO, a decision heavily weighted in favour _against_ this feature.
Personally, I would love it. It would make my life easier to have a full IDE within a browser. However, I would never be comfortable with the security tradeoff and would never enable it.
169 comments
[ 3.7 ms ] story [ 198 ms ] threadIt'd be really cool to be able to do the latter. I usually make changes in chrome dev tools and then copy the results into the relevant CSS file.
(ps - awesome work and communication!)
But hot damn, you're making me question loyalties on my dev machine.
Here, let me show you a clear example.
http://i.imgur.com/uNsh7Yv.png
Firefox clearly has the superior bar.
Maybe that one.
There are a number of reasons why they really need to rethink this, default it off, or do some better filtering. Didn't impact me personally beyond the confusion but I could imagine that URL and maybe some others coming up in what appears to be someone's unique search or browsing history raising some interesting questions at work and/or at home for some users.
However, I do brand new searches constantly. Often 20+ a day, that often look similar to older searches, but aren't quite.
Now, whether I've developed that behavior because of Chrome, or because it works well for me, is a question for itself.
Also, since I'm here- anyone get frequent fuckups lately in the Chrome omnibar, not searching what you put in, to instead search something you HAVE searched before?
For example, before, I've searched "javascript array"
But this time, I am wanting to search "javascript string concatenation". I type that into Chrome, hit enter...
...up pops the search results for "javascript array". It started about a month ago, and is really annoying.
I've noticed frequently Google Instant will fail half way through searching, and it will ignore everything I typed and just go with what Instant guessed before it crapped out.
If Instant is prioritizing your previous search, it may be linked.
In Firefox, the hotkey "cmd-K" will put focus into the search bar at the top.
In Chrome they don't have a keybind set to this by default (though on Windows they seem to). But if you open mac System Preferences, go to Keyboard, then Keyboard Shortcuts, and add an Application Shortcut for Chrome, you set the menu item name to "Search the Web..." and the keybind to whatever you want (I used "cmd-K").
So that way regardless if I'm in Firefox or chrome, pressing cmd-K will put me in a place I can search.
you can also have different engines
will search your default engine for cati have one for ddg so
searches duck duck go for cat etc. its fantasticYes, I have been encountering the same behavior. It is infuriating because it's impossible to tell when this is going to happen. This is separate from pulling up different searches I've used before, this bug seems to be something like "ignore what you type completely".
I have a new dev laptop in the mail, perhaps Firefox will get installed before chrome...
Also, I agree with you regarding Chrome's Google search priorities.
Hit space and you get recent searches.
Start typing and you get suggestions.
It searches your history and bookmarks too, which is what the awesome bar does.
That said, Omnibar in Incognito Mode works well, because it only searches my history (which is what I want).
Edit: chrome://history is pretty cool, too.
[1]: http://www.instantfox.net/
[1] http://kb.mozillazine.org/Using_keyword_searches
1) Set your search engine to Google (if it isn't currently)
2) Remove the search bar.
3) Press ctrl+k (cmd+k) and start typing. You'll be searching on Google's site, by far the best search experience with Google Instant on.
The only downside is that you need a reasonably fast, low-latency connection for it to work well[1].
[1] Fine with decent Internet service, but what a downside it is on a lesser connection. The ~0.5-1 sec delay was unbearable on a 3Mbps DSL connection with average latency.
(I'm not talking about the completion dropdown or what it contains, I'm talking about how the typed text in the input area has selected text appended to it when it happens to be a prefix for an earlier search.)
Between this, the lack of tree style tabs, and the weird text selection algorithm, I'm generally sticking with Firefox.
Like the downvoted comment I too initially read it as that he thought it WAS NOT cross platform based on thee here he postitioned his example near his Apple comment and hence why the 'sublime is available cross platform' comment made good sense to me.
Keep up the stellar work, firefox is gaining momentum again, make good use of it :)
I have another bit of feedback. The web console has three positions available: Above, Below, and Window. With Firebug, I like to have the console open in another monitor and give the browser viewport maximum screen real estate in front of me. Firefox's web console doesn't let me do this because in "Window" mode it doesn't quite act the same as a fully-fledged window. For example, I can't maximise it and it doesn't have the full complement of normal controls in its window bar. http://i.imgur.com/V7eWC1m.png
Fixed in Firefox 20
I am looking forward to ditching firebug and use the native tools.
It proves that they are developing functionality that I've been looking for and some I didn't even know I wanted.
It is evidence that they want to be a great tool for developers and that they recognize their tool needs work.
It proves that I made the right decision (completely subjective which is the nature of a comment like the one I made) in moving away from Google for a more user centered and open-source browser.
And yes it proves that they listen to their users.
All of that is assuming they weren't lying or creating fake mockups (which I feel is a safe bet). Sure that's not a lot of proof for a scientific theory, but for a decision on which browser I want to use and which company I want to support I think it's proof enough :-)
In particular, there were somewhat irreconcilable differences in goals and priorities...
1: http://en.wikipedia.org/wiki/We_will_bury_you
<edit>The ability to lock onto a specific IP for a given domain would be pretty kick-ass too. Not a replacement for /etc/hosts, but just choosing one of the 2 IP's for example.com, etc.</edit>
Another nice feature would be to get the network tab to ignore resources loaded from external domains, only show external resources, or show both. Maybe even more fine grained with/without subdomains.
That's the point of this post. It's that pretty soon, Firefox is going to have much improved devtools. They include some features that interest us greatly.
The Opera Developer Tools (Opera Dragonfly): The UX is done well, the markup editor works even better than in chrome and I like the screenshot utility and color picker. The css inspection is inconvenient when you want to change properties or add new rules. The network log is done well but the UX can become confusing, the make request feature is exceptional I don't know any other devtool that has that integrated. No xpath in the dom inspector.
Firebug: This was the first browser devtool afaik so it has a long history and years of development behind it, I always considered it to be "the firefox developer tools" and I was really surprised when mozilla announced they would recreate it on their own instead of just integrating firebug. But I guess they have their reasons.
Firebug has a great UX, everything is fast and polished although it has become a little old, it still integrates nicely in the current firefox UI. The dom and css inspector is great, it allows to quickly change anything you ever want, with the exception maybe that you cannot add new css rules (only element styles). The network inspector is exceptional, best of all 4. I don't like the console/REPL but its alright. Overall still my second favorite.
Chrome Developer Tools: Provides by far the best UX and is clearly the most powerful devtool around. Its also the only reason why I have chrome installed, my main browser is and was always firefox. The css inspector is just great, you can update or add new rules and properties and it has great auto completion. I don't like the dom editor through, the edit as html feature lacks a bit. Javascript debugging and the console work exceptionally well and you can even edit and save your code within the devtools. It has HTML5 builtin features for web workers, indexedDB, local storage, etc. You also can use it to debug nodejs applications through node-inspector.
Firefox Developer Tools: I must admit, I don't even know where to begin. The UX is just awful: From the alien dark-blue that doesn't integrate at all with the rest of firefox and the font sizes that you can't change to the strange dropdown menu/button combinations in the latest version. The DOM inspector doesn't allow you to edit html directly, has no xpath and the css inspector is confusing and doesn't has autocompletion. There is no resources overview, no networking debugging and profiling. I do however acknowledge there is some progress in the latest snapshots, I like the scratchpad, style editor and the UI overhaul made it a bit more usable. There are still no settings, still no way to change the dark theme. I don't say it isn't making some progress, but its so slow (they say they need a few months for the python api alone), that chrome will have progressed well beyond and I don't see them catching up.
Humblebrag: Psyched to see two out of three of my main points addressed. I'm impressed. Meat Loaf* would be, too.
* - http://en.wikipedia.org/wiki/Two_Out_of_Three_Aint_Bad
https://developer.mozilla.org/en-US/docs/Performance/Profili...
You would need to use a nightly release to get that though, and only on the platforms that are currently supported.
Edit:
* In inspect view, can we have a search HTML function like firebug?
* Also in inspect view, a way to disable the display of PATH.
* Increase the font size of html/css rules etc
Not sure if it's possible, but I think it'd be cool to highlight which lines have been live edited.
One bit of feedback about editing CSS: it'd be great if, when editing a property, using the arrow keys cycled through the default properties. I.e. border-style goes through solid, dotted, none, etc.
Looking great!
The ability for the browser to modify files directly on my workstation outside of caching folders sounds like a recipe for disaster.
Personally, I would love it. It would make my life easier to have a full IDE within a browser. However, I would never be comfortable with the security tradeoff and would never enable it.
2) to enable this feature, you first need to go to a "start connection" screen (not showed in the video)
3) you need to click on a dialog to accept any incoming connection