Craft 3: how to show the Yii Debug Toolbar?

Question

I'm using Craft 3 RC and I am logged as an admin. How can I display the Yii debug toolbar on front-end and Control Panel requests? By default, I don't see this toolbar.

Answer 1

There are two checkboxes in your user settings, go to your admin account -> preferences index.php?p=admin/myaccount and check the boxes

This is covered in detail in the Profiling your Website with Craft CMS 3’s Debug Toolbar article

Answer 2

Craft 3

If you enabled the debug toolbar in the user profile, but it still does not show on the frontend, AND you are running Craft not locally but on a different host (different IP), try adding this to your config/app.php:

'local'  => [
    'bootstrap' => ['debug'],
    'modules' => [
        'debug' => [
            'class' => 'yii\debug\Module',
            // uncomment and adjust the following to add your IP if you are not connecting from localhost.
            'allowedIPs' => ['127.0.0.1', '::1', '*.*.*.*'],
        ]
    ]
],

(I added this to the "local" block since I do my development on a remote server - be sure to only enable this for non-public development / staging servers, as it may cause security issues). If you have a static IP use that instead of the wildcards.

Sources: https://www.yiiframework.com/extension/yiisoft/yii2-debug and https://github.com/yiisoft/yii2-debug/blob/15526e95239fcd53316866f9f32cd5daf3a087e5/src/Module.php#L30

Answer 3

For anyone finding it annoying having to be authenticated to enable the debug bar, particularly when testing in multiple browsers, it’s easy to override this behaviour with a custom module.

Just add the following to your init() code:

// In dev envs override user debug toolbar prefs based on devMode setting
if (getenv('ENVIRONMENT') === 'dev' && ! Craft::$app->getRequest()->getIsConsoleRequest()) {
    $session = Craft::$app->getSession();
    $session->set('enableDebugToolbarForSite', Craft::$app->config->general->devMode);
}

The above code toggles the debug bar based on the devMode setting, and only in your dev environment. This is handy as you can quickly set devMode to false to test a production-like response.

Bear in mind that because this calls $session->set, even if you delete the code, your current session will retain whatever preference you last had set.

2022 Edit: I’m not sure when the above code was broken, but as @drifteaur pointed out in the comments, it is possible to set an X-Debug header to toggle the toolbar and this can be manipulated via module code too. For instance:

if (getenv('ENVIRONMENT') === 'development' && ! Craft::$app->getRequest()->getIsConsoleRequest()) {
  $request = Craft::$app->getRequest();
  $request->headers->set('X-Debug', 'enable');
}

This works fine with the current Craft 3.7 release but is untested for Craft 4.