Welcome to my corner of the web!
My name is Mihai and I work on the Firefox developer tools.
When it comes to web development, I like both server-side and
client-side work. I am mainly interested in web browsers, web
standards and related technologies.
24 March 2014, 10:01
This is just a quick note to the blog readers about a new page on
How to customize the Firefox Web Console output. The API
presented is fully available in the Aurora channel,
and partially available in the beta release
I hope add-on authors interested to extend the developer tools will
find the documentation useful.
12 March 2014, 04:12
We are really close to the next Firefox release, which will happen
next week. This is a rundown of Web
Console changes in current Firefox release channels.
Here is a really nice introduction video for the Web Console, made
by Will Bamberg:
You can learn more
about the Web Console on Mozilla's Developer Network web site.
Stable release (Firefox 27)
Added page reflow logging. Enable this in the "CSS > Log" menu
You can use the
-jsconsole command line option when
you start Firefox to automatically start the Browser
Added split console: you can press Escape in any tool to
quickly open the console (bug
Added support for
console.exception() as an alias for the
console.error() method (bug
currently selected stackframe in the JS Debugger
Added option to toggle the display of message timestamps in the
console output (bug
Added a dark theme for the console output.
CSS warnings disabled by default (bug
Added the console
API to Web Workers (bug
620935). Now you can log messages to the Web Console from Web
Pretty output for objects in the console output. You can now see
previews of object properties, array elements, DOM elements, node
lists, and more (bug
Compact object previews are also used in the object inspector,
which is also used by the JS Debugger.
The changes made in bug 843004 also include new APIs that allow
custom message output to the Web Console. You can customize output
for different object types as well.
Nicer output for
console.trace() - inline display of
stack frames with syntax highlighting (bug
Now the input line is focused when you click anywhere in the
console output (bug
cd() support. Now you can execute code in
cd(someWindowObject) switch the JS evaluation scope to
the given global window object - you can get it from iframes using
cd('.selector iframe') - for ease of use you can
specify a CSS selector that matches the iframe you want to use as
cd(iframeDOMElement) - you can also point to the
<iframe> DOM element.
cd() with no arguments to reset eval scope to
the top window.
cd() is also available in Scratchpad.
Rich previews for objects (bug
584733): syntax highlighting, you can click on property
values/array elements to inspect those objects directly, DOM node
lists and more.
DOM elements are now highlighted in the page when you hover the DOM
element in the console output (bug
757866). An inspector icon is also included - click it to jump
to see the DOM element in the markup view.
Added support for pretty output of objects in the Browser Console
as well (bug
Network requests are now logged when you connect to Firefox OS (bug
917227). This affects both the Web Console and Network
Autocomplete for array members, so now you can type
myArray.foo to get suggestions (bug
Ctrl/Cmd-Shift-K no longer toggles the Web Console. To
close the developer tools use Ctrl/Cmd-Shift-I or
F12. Ctrl/Cmd-Shift-K is now used to focus
the Web Console JS input if it is not already focused. See
Rob's blog post for details and bug
612253 for the development notes.
922161). Set devtools.chrome.enabled to
true in about:config to get
back the input.
Big thanks to all of the contributors who made patches to fix and
improve the Web Console.
Next week we will start work for Firefox 31. If you are a developer
I recommend you to use aurora or nightly builds to get the best of
3 August 2013, 10:11
In early 2010 when I applied for an internship at Mozilla I was
anxious. It was a kind of test for what I learned and for the value
of the projects I did up until that point. That is when I met my
first manager. When I was invited to join the new developer tools
team, I was thrilled, excited and really happy that somehow "I did
it!". I did it in the sense that "yes! now I can do real work!",
and yes, since 2010 I work on things that make a difference. This
was, and still is, the job I really wanted to have. Back then, the
team was preparing the initial versions of the Web Console and of
the Inspector. We released the Web Console in Firefox 4.
In July 2010, when I started to work with the team, I was new to
then I learned a lot more about technologies, about what it takes
to work in a big project, what it takes to work in a team and I
also learned about how managers work. I had no clue about a lot of
things, and learning never ends - which is what I really enjoy
about the work I am doing.
I had the opportunity to meet the whole team and other colleagues
from Mozilla on several occasions - in London, Sunnyvale, Mountain
View, San Francisco and soon in Paris. The people I met, the
Mozilla offices and places I have seen, have, in some ways, humbled
me about what the future can hold. They were all really great
experiences that I did not dream of.
A bit of stats: in three years I fixed approximately 300 bugs and
reported ~320 bugs (~210 are fixed already). I worked on the Web
Console (I still do), the Inspector, the Computed Style view (in
the really early days, in 2010), the Source Editor, the network
monitor (the backend for network logging which is shared with the
console), the about:home page introduced
in Firefox 4 and a bit on Panorama (the tab grouping feature
introduced in Firefox 4).
I look forward to continue to work on more cool projects and to
work with really great people! The people make Mozilla what it is
and they have been really great with me. For everything, big thanks
to my colleagues, managers and, actually, friends who work on tools
for the open web platform.
29 May 2013, 09:21
Today's Firefox Nightly
(May 29, 2013) no longer has the Error Console enabled by default.
It has been replaced by the Browser Console which shows all of the
same errors, warnings and messages as the Error Console and more:
network logging and
window.console API logging from
all content and chrome windows - including extensions! It also has
a better UI, you can filter messages, evaluate JS with chrome
privileges and inspect objects.
If you find missing messages, please file bugs as soon as possible in
the "Developer Tools: Console" component. Thank you!
The Browser Console shares the same code with the Web Console. This
means you will get all of the improvements we are working on - we
are gearing up for a console output UI
If you want to enable the Error Console you can change the
devtools.errorconsole.enabled option to
true from about:config.
Pro tip: in your Firefox chrome code (including
extensions) you can do:
The above code will output to the Browser Console if you have it
open - you can inspect objects, print stack traces
console.trace()) and do a bit of timing
Update: these changes should have no impact in
Thunderbird, XULRunner or any other applications. Currently the
changes are limited to hiding the Error Console menu item from
Firefox by default, and the Ctrl/Cmd-Shift-J keyboard
shortcut now opens the Browser Console instead of the Error
9 April 2013, 14:12
Today we just landed three new Web Console features you can play
with in tomorrow's Firefox
On a related note, Victor Porof also landed the new network monitor
which gives you a very nice UI for working with the log of network
requests and responses. The new tool uses the
Web Console actors we worked on for making the Web Console
remotable - both tools share the same network logging mechanism.
Whenever you are debugging a script in the page you can now
sure you select in which stackframe you want to evaluate your code
- just switch to the desired frame in the Debugger view. Until
today the Web Console locked up while debugging pages. For
technical details, see bug
This feature required a number of important changes. The Web
Console now uses only the
debugger API to access the content JS objects. With these
changes we are fixing a number of bugs reports by users.
New object inspector
The old object inspector popup has been replaced with the same
variables view from the debugger, allowing us to fix long standing
issues with the old inspector. This is not just pretty UI: you can
now filter/search through the properties by name and value, edit
property name and value, delete properties, and more. You can also
variables view: when you edit a value you can just write
$("foo") or whatever you wish.
With this change object inspection works slightly different: you
will notice that many of the methods and properties of DOM objects
show in the prototype of the objects you inspect. The switch to the
The new Browser Console
To enable the Browser Console make sure you set
true in about:config (Firefox restart is needed). Open
the Browser Console from the Web Developer > Browser
Console menu item.
The new Console is meant for browser and addon developers: you can
see all of window.console API calls, from all windows,
all script and style errors/warnings, and all network requests from
all over the browser and from addons.
We plan to replace the Error Console with the Browser Console as
soon as possible: the Error Console provides users with less
capabilities than the Browser Console, and it is not remotable. You
can currently connect to any Firefox Mobile, Firefox OS and Firefox
for desktop instance and see all of the logs in the Browser Console
from the remote instance.
Given the amount of logging happening we plan to support better
ways of filtering output. For example, we would like to allow
developers to filter messages by addon.
The screenshot shows the Browser Console with the new object
What is next
All of the three features are the outcome of a lot of work from the
entire team. Still, I want to thank Panagiotis Astithas and Jim Blandy for the
debugger-related work and reviews, and Victor for the variables
Download a Firefox nightly
build, play with the new features until you break them. :)
Please let us know if you have any comments and report any bugs you find!