Documentation versions (currently viewingVaadin 7)

Testing and Debugging on Mobile Devices

Testing places special challenges for mobile devices. The mobile browsers may not have much debugging features and you may not be able to install third-party debugging add-ons, such as the Chrome Developer Tools.


The debug window, as described in "Debug Mode and Window", works on mobile browsers as well, even if it is a bit harder to use.

The lack of in-browser analysis tools can be helped with simple client-side coding. For example, you can dump the HTML content of the page with the innerHTML property in the HTML DOM. To do so, you need to execute a JavaScript call from the server-side and handle its response with a call-back method, as described in "Handling JavaScript Function Callbacks".

Desktop Debugging

TouchKit supports especially WebKit-based browsers, which are used in iOS and Android devices. You can therefore reach a decent compatibility by using a desktop browser based on WebKit, such as Google Chrome. Features such as geolocation are also supported by desktop browsers. If you make your phone/tablet-detection and orientation detection using screen size, you can easily emulate the modes by resizing the browser. Also, the browsers have special development settings to emulate some features in touch devices.

Remote Debugging

Both Safari and Chrome support remote debugging, which allows you to debug the supported mobile browsers remotely from a desktop browser.