Mozilla has released a preview of its Remote Debugger for Android available in Firefox 15.
The Remote Debugger lets developers connect Firefox Desktop to Firefox Android so that they can use a nice, roomy desktop monitor to troubleshoot JavaScript running on a mobile device, according to Kevin Dangoor, product manager for developer tools at Mozilla.
In July, Mozilla announced the debugger and other new developer tools introduced in Firefox 15. To use the new debugger, developers must be running Firefox 15 at least, which is still in the beta channel stage.
In a recent blog post, Dangoor said 95 percent of Android devices are running a Firefox-compatible version of the operating system-Android 2.2 and higher. “Firefox won’t run on all of these devices, but there are certainly many millions of devices that you can pick up and begin remote debugging on,” he said.
Meanwhile, Mozilla has just created this post and how-to video that provides a step-by-step guide on how to get started remote debugging.
To get going with the remote debugger on Android, Dangoor said:
“On your mobile device, browse to a page that you want to debug. Fire up the Remote Debugger on your desktop Firefox. The Remote Debugger appears as a new window and it will prompt you for the address to connect to. Replace “localhost” with the IP address of your phone. By default, the remote debugging server on your mobile device will be running on port 6000, so leave the “:6000′”there in the connection address.“
Indeed, in an early July blog post, Dangoor wrote of Firefox 15 and its new debugging capabilities:
“This new debugger is not just a new user interface over the functionality that Firefox’s JavaScript engine (SpiderMonkey) has been providing to tools like Firebug for years. The entire debugging interface in SpiderMonkey has been completely redesigned. There are two big things that Web developers get because of the new debugger back-end:1. It’s fast. JavaScript applications running with the debugger open will run nearly as fast as they do without the debugger.2. It’s remotable. You can connect the debugger user interface to a debugger back-end running somewhere else.“
Other new features in Firefox 15 include a new Responsive Design View that makes it easy to resize just the page the developer is viewing. “With the Responsive Design View, you can work on your designs without constantly pulling out your mobile phone to see how it looks,” Dangoor said. “And, you can try out your designs without shrinking your browser’s tools, toolbars and other tabs.”
Firefox 15 also features a new Layout View that enables developers to see how the margins, padding and border are set for a node in one view. The Layout View is collapsed to a single line showing the developer the size of the element. It is available as part of the Style Inspector. Meanwhile, enhancements to the Page Inspector enable developers to turn off highlighting behavior.
In addition, Mozilla has given the Firefox 15 Web Console a major boost in performance, Dangoor said.