Getting started with Web Inspector

Web Inspector functionality is made available using a client-server architecture. On the device, the BlackBerry WebWorks app or BlackBerry Browser acts as a web server and serves the webpage over HTTP over a USB or Wi-Fi connection. Using the Google Chrome browser on your desktop, you can navigate to the IP address and port number used by the server app and begin inspecting the code.

Launch Web Inspector to remotely inspect and modify content

  • Verify that your computer is connected to your computer via a USB connection, or is communicating on the same Wi-Fi network as the BlackBerry smartphone or BlackBerry tablet.

    Note that Web Inspector only provides a USB IP address (required if you intend to use Web Inspector over a USB connection) if your device is already connected via a USB connection when Web Inspector is enabled.

  • Verify that your computer has the Google Chrome desktop browser installed.

Once you have enabled Web Inspector in your BlackBerry WebWorks app or in the BlackBerry Browser, you can remotely connect to your BlackBerry smartphone or BlackBerry tablet to inspect and modify the content.

  1. On your computer, open Google Chrome.
  2. In the address bar, type the IP address of the BlackBerry smartphone or BlackBerry tablet, and specify the port number used by the app serving the content. The port number is displayed when you open a BlackBerry WebWorks app that is Web Inspector enabled, or when you first enable Web Inspector in the BlackBerry Browser. For example:
    A list of one or more links is displayed in your browser, representing the webpage currently displayed in each of the tabs open in the BlackBerry Browser.
  3. Click on any of the available links to view the content in Web Inspector.

Finding the IP address used to connect to the BlackBerry device

  • If you are running a BlackBerry WebWorks app, the app displays the IP address when it is launched. To view the IP address, close the app, then restart it.
  • When you enable Web Inspector for the BlackBerry Browser, the browser displays the IP address and port number it is communicating over. To view the IP address, disable Web Inspector and then re-enable it. For more information, see Enable Web Inspector for the BlackBerry Browser .

Web Inspector panels

Web Inspector contains a number of panels, each of which provides different functionality that you can use to help you to improve the appearance and performance of your webpage. You can display a panel by clicking the icons in the toolbar that is located at the top of the Web Inspector window.

Web Inspector includes the following panels:





Elements Icon

The Elements panel allows you to inspect the DOM of the current webpage or your BlackBerry WebWorks app, and adjust settings for attributes and CSS properties. Changes you make are reflected in the content.


Resources Icon

The Resources panel displays information about all the resources that are used by the current webpage or in your BlackBerry WebWorks app.


Network Icon

The Network panel displays information about each HTTP request made as resources are requested, received, and displayed in the BlackBerry Browser or in your BlackBerry WebWorks app.


Sources Icon

The Sources panel allows you to debug JavaScript code. You can set breakpoints and step through your code to locate and correct issues.


Timeline Icon

The Timeline panel allows you to view how much time it takes for the browser to load and render the webpage and its resources.


Profiles Icon

The Profiles panel allows you to examine how your JavaScript code is utilizing memory. With the Profiles panel, you can determine where programmatic inefficiencies exist.


Audits Icon

The Audits panel allows you to examine the network utilization and webpage performance and suggests areas where performance can be improved.


Console Icon

The Console panel provides a command-line driven utility that allows you to debug JavaScript errors or HTML parsing errors.

Last modified: 2013-12-21