Debug Web content

You can access tools to inspect and debug layout and performance issues of any web content, specifically WebComponents.

Debugging a Web Component with the GDC front-end

To enable web component debugging with GDC, define the TCP port where a Chrome browser can connect to, in order to use the QT WebEngine Developer Tools.

With GDC, the web component debug port can be defined with the --webengine-remote-debugging command line option, or by setting the QTWEBENGINE_REMOTE_DEBUGGING environment variable, before starting the GDC.

Note: The command line option takes precedence over the environment variable.

For both the --webengine-remote-debugging command line option and the QTWEBENGINE_REMOTE_DEBUGGING environment variable, the syntax is:

[address:]port

Tip: The same debugging features of the QT WebEngine Developer Tools are available when using the --webengine-remote-debugging command line option, or when using the QTWEBENGINE_REMOTE_DEBUGGING environment variable. See QT documentation for more details about debugging features when QTWEBENGINE_REMOTE_DEBUGGING is set.

Define a simple port number, or a network interface address and port with address:port. The address:port syntax can be used to control which network interface to export the interface on, to access the developer tools from a remote computer. If no address is specified, it defaults to localhost.

After starting the Genero program displaying on GDC, the QT WebEngine Developer Tools can be accessed by launching a Chrome browser at the following URL:

http://localhost:port (when the GDC executes on the current host)
http://hostname_or_IP:port (when the GDC executes on a remote machine)

For example, to restrict the access to the debugging tools to the local machine on port 9000, use the value "127.0.0.1:9000". To (theoretically) access from any computer in your network on port 9000, use "0.0.0.0:9000".