Qt WebEngine Debugging and Profiling | Qt WebEngine (original) (raw)

Console Logging

JavaScript executed inside Qt WebEngine can use the Chrome console API to log information to a console. The logging messages are forwarded to Qt's logging facilities inside a js logging category. However, only warning and fatal messages are printed by default. To change this, you either have to set custom rules for the js category, or provide custom message handlers by reimplementing QWebEnginePage::javaScriptConsoleMessage(), or connecting to WebEngineView::javaScriptConsoleMessage().

All messages can also be accessed through the Qt WebEngine developer tools.

The Qt WebEngine module provides web developer tools that make it easy to inspect and debug layout and performance issues of any web content.

The developer tools are accessed as a local web page using a Chromium or Qt WebEngine based browser, such as the Chrome browser.

To activate the developer tools, start an application that uses Qt WebEngine with the command-line argument --remote-debugging-port=<portnumber>.

Note: Any WebEngine command line options should be specified after the --webEngineArgs option, which is used to separate the user's application specific options from the WebEngine's ones.

--webEngineArgs --remote-debugging-port=

Where <port_number> refers to a local network port. The web developer tools can then be accessed by launching a browser at the address http://localhost:<port_number>.

Alternatively, the environment variable QTWEBENGINE_REMOTE_DEBUGGING can be set. It can be set as either just a port working similarly to --remote-debugging-port or given both a host address and a port. The latter can be used to control which network interface to export the interface on, so that you can access the developer tools from a remote device.

To avoid WebSocket errors during remote debugging, add an additional command-line argument --remote-allow-origins=<origin>[,<origin>, ...], where <origin> refers to the request origin. Use --remote-allow-origins=* to allow connections from all origins. If nothing is specified, Qt WebEngine will add --remote-allow-origins=* to command-line arguments when remote-debugging is enabled, thereby allowing requests from all origins.

For a detailed explanation of the capabilities of developer tools, see the Chrome DevTools page.

Using Command-Line Arguments

You can use the following command-line arguments while debugging to provide input for bug reports:

Any WebEngine command line options should be specified after the --webEngineArgs option, which is used to separate the user's application specific options from the WebEngine's ones.

--webEngineArgs [WebEngine specific options]

Alternatively, the environment variable QTWEBENGINE_CHROMIUM_FLAGS can be set. For example, the following value could be set to disable logging while debugging an application called mybrowser:

QTWEBENGINE_CHROMIUM_FLAGS="--disable-logging" mybrowser

QTWEBENGINE_CHROMIUM_FLAGS can also be set using qputenv from within the application if called before QtWebEngineQuick::initialize().

Dump WebEngineContext Information

For dumping the WebEngineContext information, you can set the QT_LOGGING_RULES environment variable to "qt.webenginecontext.debug=true".

The output contains information about the graphical backend, and the way how Qt WebEngine is initialized for the application. This is particularly useful for reproducing issues.