Debugging JavaScript with Tabris.js

Tabris.js was designed to help developers build native cross-platform apps using a single JavaScript codebase. We offer many tools to boost efficiency - like the Tabris.js developer app and the cloud build service. With Tabris.js 1.8 we’ve introduced a new enhancement that will make a major difference when it comes to getting things done - an interactive debugger.

Setup

Tabris.js 1.8 apps on Android can now be debugged using Chrome Developer Tools. This can be achieved by attaching your phone directly to your machine (or by using the Android emulator), and connecting to it via the JavaScript debugger in Chrome Developer Tools. Start by running the Tabris.js developer app and launching your favourite script.

Chrome Developer Tools

Chrome Developer Tools (DevTools) are a set of web authoring and debug tools built into chrome. While they are mainly used for Web development, the JavaScript debugger can be used with any DevTools compatible JavaScript runtime. Earlier this year a Debug API was added to J2V8. We integrated Stetho, a debug bridge for Android application with this API. With this integration in place, developers can now connect DevTools directly to their running Tabris.js application.

Once your app is running, start Chrome and connect to chrome://inspect/#devices.

You will see all the available Devices you can connect to. Choose Tabris.js (the one powered by Stetho). This starts DevTools.

With DevTools you can set breakpoints, step through functions, navigate the call stack, inspect variables and more.

You can set breakpoints by double clicking in the margin. Breakpoints can then be managed in the Breakpoint view on the right. You can step over, step into and step out of functions:

Using the Scope Variable View, you can browse the variables in all the available scopes:

And the Call Stack View provides you with the ability to navigate the current call stack.

With Tabris.js, not only can you develop kick-ass, cross-platform, mobile apps, but you can develop them – and debug them – at breakneck speed.

Good luck, and happy debugging.