Test Tab

After your HTML5 app looks appropriate in the Intel® XDK emulator, the next step is to test your app on an actual mobile device. The Intel App Preview app provides a bridge that allows you to run your code on a test device without having to install your app on that device. Furthermore, the Test tab provides access to an on-device remote debugger so you can see JavaScript* messages generated by the app running on device.

Other parts of the Intel XDK provide preview and debugging features similar to the Test tab:

  • For USB-connected Android* and Apple iOS* devices, the Debug tab provides excellent remote debugging features for Android (based on the Crosswalk* runtime) and Apple iOS* devices.
  • The Develop tab's Code view provides Live Layout Editing features, including live preview either on a device or in a browser window. To use these features on a mobile device, install Intel App Preview.
  • The Emulate tab simulates some typical mobile devices in a Chrome desktop environment and provides a debugger based on the standard Chrome Developer Tools* (DevTools) debugger.

For a description of when to use the various Intel XDK and related debug and test options, see Debug and Test Overview.

Install the Intel App Preview App

To begin, download and install the Intel App Preview mobile app on your testing device(s). You can find the Intel App Preview mobile app in app stores such as the Apple App Store*, Google Play* Store, and both Microsoft Windows* stores. Search using the term "Intel App Preview".

To run App Preview, launch it like any other app.

Decide Whether to Test Using a Server or a WiFi Network Connection

You can test your app using a server or directly test your app running on a device. Locate the MOBILE and WIFI buttons in the upper left corner:
  • Use the MOBILE button to test using a test server in the cloud. Advantages: Requires minimal setup, avoids potential firewall and network topography issue, and you can pull your files down to your mobile device anytime from anywhere in the cloud.
  • Use the WIFI button to test using a local Wi-Fi network to which both your development machine and test mobile device are connected (same WiFi subnet). Advantages: Usually faster once set up, does not consume mobile data, and pulls files directly from your development computer.

In either case, follow the displayed instructions in the left part of the Test tab.

To run your app using WIFI, consider enabling the checkbox Run Intel XDK local server to enable test over WiFi. Be aware that checking this option may cause firewall issues in certain environments, so consider unchecking it unless you are actively using the Test tab.

Push App to Test Server

Once you have App Preview installed, select your project in the Intel XDK and click the Intel XDK Test tab. A dialog appears to push (upload) a copy of your app's project files up to the test server.

You can check the date-time when your app's files were pushed to the test server. If you modified your source files after the displayed date-time, click the green button next to Push Files to update your app on the test server.

The App Preview app will look on the test server(s) for the most recent copy of your app to run on this device.

Launch your App on Test Device

  1. On your mobile device, launch the Intel App Preview app.
  2. Make sure you are logged into your Intel XDK account (same account you use on your development system).
  3. Locate the App Preview toolbar on the bottom and tap Server Apps.
  4. Locate and tap the camera button in the upper-right corner.
  5. Aim the camera view at the QR code in the Intel XDK Test tab to scan the QR code. After it recognizes the QR code, it will ask whether you want to launch App Preview to preview this app. If accepted, it will access the Internet, grab the latest copy of your app you uploaded to the test server, and run it in test mode on your mobile device.

You can follow the device testing guide on the left side of the Test tab to run your app from a list of your available apps on test servers.

If you don't see your app or it is out of date compared to viewing it with the emulator, make sure you have uploaded it to the test server using the Test tab.

Debug on Device

For the best debugging results, when possible use the Debug tab to remotely debug a USB-connected mobile Android device or iOS device (see Debug and Test Overview).

Debugging your app with the Test tab on your test device requires that you add a few lines of code to your app. This script tag will include a JavaScript library from the Internet that will transmit your JavaScript debug state to your desktop computer. Follow these steps to get on-device debugging to work:

  1. Add the script tag to the HTML files of your project.
  2. Push your app to the testing server to update it.
  3. Click Begin Debugging on Device to start the local debug window.
  4. Later, after you complete debugging, remove the script tag in your project's HTML files.

Be aware that Internet firewalls can limit the functionality of this tool.

Resources


For more complete information about compiler optimizations, see our Optimization Notice.