Asynchronous call stacks
Stack traces can now be associated with the asynchronous source of an event. There is support for timers, animation frames, XHRs, event listeners and more. We'll soon be posting a full writeup of asynchronous call stacks to HTML5 Rocks. (Don't forget to check 'Enable support for async stack traces' in DevTools experiments.) [crbug.com/272416]
![Async call stack.](/static/blog/devtools-digest-chrome-33/image/async-call-stack-ca43ca442e8ca.png)
getEventListeners(window)
When viewing the DOM of a page, it's not always obvious what elements have JavaScript event listeners registered on them, if any. All registered event listeners on the window
object (or any DOM node for that matter) can now be retrieved via getEventListeners in the Console panel as part of the Command Line API. [crbug.com/336472]
Navigate through source code editing locations
Sources panel introduces the concept of editing locations which are essentially cursor positions in the code editor. Alt-
takes you to previous editing locations (the piece of code you were previously at) and Alt+
goes forward. [crbug.com/281507]
Box Shadow auto suggest values are updated
Auto suggest values for the CSS property box-shadow
have been updated to include the keyword of none
. [crbug.com/332355]
![Box-shadow none](/static/blog/devtools-digest-chrome-33/image/box-shadow-none-b45dcced73a0c.png)
Go to a specific line number and a specific column
Go to a line number at a specific column using :line:column
in the Sources panel ‘Search by filename’ (Ctrl + O
or Cmd + O
) dialogue box. [crbug.com/337909]
Easier resizing with the toolbar handle
Any empty space on the main DevTools toolbar now acts as a valid resize handle. [crbug.com/304730]
Retina friendly network bars
The network bars which were originally formed from images have now been created in CSS making them resolution independent and retina friendly. [crbug.com/330659]
Reducing noise in the console
Unknown arguments passed to the meta viewport tag are no longer displayed as errors in the console, but rather, warnings meaning less noise for you to sift through. [crbug.com/332794]
Remove color formatting cog
The Styles pane cog to cycle through color formats is now removed, though you can still change this preference in DevTools settings. [crbug.com/333840]
Sticky console tab
The console tab in the drawer now correctly remembers its state correctly after a reload. [crbug.com/328551]
Improved explanation on text autosizing
A link to the mobile emulation documentation has been added into DevTools to help explain more on emulation and Text autosizing, a tooltip also appears for the text autosizing checkbox. [crbug.com/319092]
![Text autosizing tooltip](/static/blog/devtools-digest-chrome-33/image/text-autosizing-tooltip-592ed2fd5e1fd.png)
Remote IP address
You can now view the IP address of a host in the Network panel resource view. [crbug.com/255602]
![Remote IP Address](/static/blog/devtools-digest-chrome-33/image/remote-ip-address-a9ab0f9f4f28a.png)
Thanks for reading. You can try these features out in Canary, alternatively many of the features mentioned in the December edition are now available in Chrome stable!