Enabling the developer tools
In Settings | Dashboard, at the bottom right, you can find the Activate the developer mode link. Clicking on it enables the Developer mode features for this browser window.
We also have available an Activate the developer mode (with assets) option. What it does is to prevent web client asset minification. It is useful to debug the web client itself, at the expense of making the navigation a little slower.
For faster load times, the web client minifies the Javascript and CSS assets into compact files. Unfortunately, that makes web client debugging nearly impossible. The Activate the developer mode (with assets) option prevents this minification and loads the web assets in individual, non-minified files.
For example, http://myserver/web#home would be changed to http://myserver/web?debug#home.
Although there is no link to enable it, the frontend framework also supports the debug flag. To disable asset minification in a frontend web page, add ?debug=assets to the corresponding URL. Take note that the option will probably not persist when navigating through links to other frontend pages.
Once the Developer mode is enabled, we will see two additional menus available:
- The Debug menu, the bug icon at the right-hand side of the top menu bar, just before the username and avatar
- The Technical menu item, in the Settings app:
We will be explaining and making use of these Developer mode features in the next sections of this chapter.