For an amateur developer, writing outstanding code is still immensely difficult to achieve and making it more perfect in your first time is nearly impossible. It is easy to debug the code and you can protect your project from most potential issues if you work independently. But if you are working in a large software company composed by many developers over the years, you need to be an expert in debugging the code.

According to Anyforsoft.com, there is no one-size-fits-all bug-proofing plugin for Drupal. Similar to working with other development tools, you need to think and work hard to fix your bugs. Sooner or later, even the most experienced software engineers must detect bugs and fix them promptly.

Kint is a tool designed to present your debugging data in the absolutely best way possible. It is one of the submodules of the Devel Module - Devel Module is a fast and convenient way to start debugging.It injects its library to your project. It allows you to print the variables in special Twig templates which have a user-friendly formatting for the information about objects and arrays provided.

Kint function is an alternative to dump() function. Twig’s dump() function will often print a lot of text to the web page making it difficult to find the needle you want amidst the haystack of text. Whereas, kint() function works exactly the same functionality as the dump() function, yet kint() provides an expandable and collapsible interface to the variables that it prints out and makes it easier to understand and debug. 

As mentioned above, Kint comes as a sub-module so it hasn’t replaced the old function dpm and dsm, these functions are still there. You can still use the dpm and dsm function in your debugging. Instead, you get two new ones: kint and ksm which are more convenient in debugging your page.

Here’s on how to enable or install kint() function: 

  1. Download the devel module and install it.
  2. Install the kint-php library (using composer: composer require kint-php/kint --dev).
  3. Like the dump function, kint() will not display any output unless debugging is enabled.
  4. In your .twig files, use kint() to inspect the variables just like dump() is described above while in php code, use ksm() instead. Ksm has a similar function with kint(). Ksm() function prints kint() output in the message region.
  5. Optionally, download and install the Devel Kint Extras module to search the nested variable list.

To print a variable, just add {{ kint(variable name) }} into the template and pass a variable in, for example, {{ kint(fields) }}. And flush all caches and reload your page, image below will appear in your page. 

Kint

REFERENCE:

https://anyforsoft.com/blog/6-ways-debug-drupal-8/

https://www.drupal.org/docs/theming-drupal/twig-in-drupal/discovering-and-inspecting-variables-in-twig-templates