Get paid to write Drupal tutorials on WebWash

How to Print Variables using Kint in Drupal 8


While developing a module or modifying a template in Drupal you’ll often print variables, especially if you’re in a preprocess hook.

You learn early on how to use var_dump and print_r function. But these functions can sometimes display too much information and can be hard to filter through the arrays or methods in the variable.

In Drupal 7, with the Devel module, you could use the dpm or dsm function. When used, these functions will print variables at the top of the page or in the message area using Krumo.

Now in Drupal 8, Devel has adopted a new library to print variables and it’s called Kint.

Fig 1.0

Please note, Krumo has been removed from the Drupal 8 version of Devel. The dpm and dsm functions are still there but the variables are printed without formatting.

Fig 1.0

Getting Started

Kint ships as a sub-module in Devel and the library itself is also in the sub-module. So all you need to do is download and install it.

Below are the Drush and Drupal Console commands to download and install:

Drush:

$ drush dl devel
$ drush en kint

Drupal Console:

$ drupal module:download devel --latest
$ drupal module:install kint

Using Kint

As mentioned earlier, Kint comes as a sub-module so it hasn’t replaced the good-old beloved dpm and dsm, these functions are still there.

Instead, you get two new ones: kint and ksm.

kint()

Fig 1.0

The kint function prints everything at the top of the page.

ksm()

Fig 1.0

The ksm function prints the Kint output in the message region of your theme.

Expanding and Collapsing

Once you have a variable printed on the screen you want to drill down and see what’s in it.

Kint allows you to navigate around in two ways. First, if you click anywhere on the row, it’ll expand just the next level.

But if you click on the + icon, it’ll expand all child items below.

Have a look at the GIF below to see how it works.

Fig 1.0

Viewing Stack Trace

When viewing a printed variable, Kint also displays a stack trace just below the output. Click on the + icon below the variable and it’ll expand a stack trace.

Fig 1.0

Using Kint in Twig

Kint can also be used in Twig templates. To print a variable, just add {{ kint() }} into the template and pass a variable in, for example, {{ kint(page) }}.

For this to work, you must turn on Twig debugging. I won’t cover it in this tutorial, but read this documentation page on drupal.org to learn how to do it.

If you’re using the 8.x-1.0-alpha1 version of Devel, then you’ll get a PHP warning when using Kint in a Twig template. This has been fixed in the latest dev version.

Summary

Kint is a good upgrade for the Devel module. The only drawback is you’ll have to retrain your muscle memory to type kint or ksm instead of the old functions.

FAQs

Q: Has dpm() and dsm() been removed?

No, these functions are still there but they won’t print the variable using Krumo as it has been removed from Devel in Drupal 8.

Q: I’m trying to print a variable in a Twig template and nothing is happening.

You must turn on Twig debugging for the {{ kint() }} function to render. Read this page on drupal.org to learn how.

About the Author

Ivan is the founder of Web Wash and spends most of his time consulting and writing about Drupal. He's been working with Drupal for 10 years and has successfully completed several large Drupal projects in Australia.

Leave a Reply 8 comments

Raul Garcia - August 2, 2016 Reply

Hello Ivan,

First of all I thank you for your tutorials, I find them very interesting and very helpful too. It’s a great job!!

IMHO Kint is too slow printing objects. When I have used it I have recived a WSOD or may be the duration of loading becomes eternal. I don’t know exactly why.
Have you had problems with the performance?
Can it be a problem with XDebug?
Have you ever installed and tested XHProf with Drupal 8?

Thank you in advance for your answers.

    Ivan Zugec - August 2, 2016 Reply

    I’ve never had performance problems with it. If you’re getting a WSOD, find out what the error is. You could be running out of memory.

    Yes, XDebug does slows things down, try disabling it and see if it fixes it.

Vishal Nigam - October 15, 2016 Reply

How to access kint array second variable and protected variable and print sum values of the fields on twig template .

i understand how to work kint but need more suggestions to print variable like {{ pagecontent[‘#colossal_menu_link’].contents.field_main_menu_caption.value) }} how to .

    Ivan Zugec - October 15, 2016 Reply

    Hi Vishal,

    Not sure. Never gone that deep sorry.

    Cheers,
    Ivan

Subrata Sarkar - October 19, 2016 Reply

Thanks for the nice tutorial! kint(content) now tells me what are available arrays for user login block. By using {{ content.user_login_form }} I now can display the login form only and not the user_links. But I want to go one step forward by extracting specific fields in user_login_form array element, i.e. if I want to only display the username field what should I do? content.user_login_form.username or something? I could not figure that out from kint data.

JP - March 14, 2017 Reply

Great article! I would also suggest that folks increase PHP memory to 1024M and set kint’s max level to 5. See https://www.drupal.org/node/2277303#comment-11168509 for details.

    Ivan Zugec - March 14, 2017 Reply

    Hi JP,

    Thanks for the tip.

    Cheers,
    Ivan

Leave a Reply: