Postponed

This issue is postponed on 8.1.x being open for development.

Problem/Motivation

Front end devs need a way to be able to see what they are working with, and we all know how much they hate digging through render arrays. Since we still have the ARRAYS OF DOOM in Drupal 8, we need to figure out how we're going to provide debugging features for Twig templates.

Proposed resolution

We have several options:

  • clean up the render array and make a friendly version for inspecting
  • use something like ladybug from symfony/twig-land
  • other?

Remaining tasks

TBD

User interface changes

None

API changes

TBD

#1783134: [META] Make it possible to inspect twig variables and get information about objects and render arrays

Original report by @psynaptic

Twig provides it's own {{ dump(variable) }} function enabled via:

$twig->addExtension(new Twig_Extension_Debug());

Devel module has some very useful debugging functions such as dpm, kpr, etc. which it would be handy to have available.

Devel function registrations should live in devel module but we need to provide a way for core to enable debugging of templates using the Twig {{ dump(variable) }} method.

Comments

Fabianx’s picture

+1 to this: How can we set a site from dev to production mode or vice versa is the general question here?

So that we can set debug => TRUE | FALSE depending of state.

soulston’s picture

While devel module is great there is a lot of stuff in krumo which might put off a themer.

This is just a suggestion but how about adding a simple output of all available twig items in a tab, much like devel does for it's output?

If we add a hook_permission for this you wouldn't need to remember to disable this between dev, staging and production.

Fabianx’s picture

hook_permission is an excellent suggestion.

eojthebrave’s picture

I like the hook_permission() idea but I'm not sure that adding it as a "tab" is the right approach since there are a lot of template files that are not directly associated with something that exists in the menu system and thus there would be no where on the page to render the tab.

steveoliver’s picture

Project: » Drupal core
Version: » 8.x-dev
Component: Twig engine » theme system
Issue tags: +Twig

I'm moving this from the Twig sandbox to the Core queue to get some eyes on it. I don't actually expect we'll do this in core at the moment, but rather likely within Devel or other contrib project.

@bzitzow in irc pointed out https://github.com/raulfraile/LadybugBundle, a Symfony2 bundle for Ladybug library, "the Simple and Extensible PHP Dumper" which looks like it'd be a little more useful than krumo as LadyBug provides references to API docs for known Symfony2 classes.

steveoliver’s picture

Assigned: Unassigned » steveoliver

Assigning to myself.

soulston’s picture

+1 for for LadybugBundle, let me know if you need any help with this.

steveoliver’s picture

Assigned: steveoliver » Unassigned

We don't need the bundle--only the library. However, I'm having an issue with "phpdocumentor/reflection-docblock 2.0.0a3" getting the library installed from either the core composer.json or a core module's own composer.json. Anyone (soulston?) familiar with Composer feel like taking a stab at this? Unassigning myself.

I get the same error in either case:

steve@mba13:modules/ladybug ‹8.x*›$ php ../../composer.phar install
Loading composer repositories with package information
Installing dependencies (including require-dev)
Your requirements could not be resolved to an installable set of packages.

  Problem 1
    - Installation request for raulfraile/ladybug 1.0.0-alpha1 -> satisfiable by raulfraile/ladybug[1.0.0-alpha1].
    - raulfraile/ladybug 1.0.0-alpha1 requires phpdocumentor/reflection-docblock 2.0.0a3 -> no matching package found.

Potential causes:
 - A typo in the package name
 - The package is not available in a stable-enough version according to your minimum-stability setting
   see <https://groups.google.com/d/topic/composer-dev/_g3ASeIFlrc/discussion> for more details.

Read <http://getcomposer.org/doc/articles/troubleshooting.md> for further common problems.
soulston’s picture

I'm not that familiar with composer either but I'll take a look at it and report back.

galactik’s picture

My experience (I don't familiar with the Symfony and Composer):
1. I installed LadybugBundle. Debugging (ladybug_dump) still not working.
2. Ok. I tried to install Ladybug (https://github.com/raulfraile/Ladybug).
Fisrt time I got the same message ("The package is not available in a stable-enough version according..."),
than I added "minimum-stability": "dev" in the composer.json.
3. In this way process has started, but after some time:

Updating dependencies (including require-dev)
Killed

I think, this means that I don't have enough memory in the server.

Because, for the first time I had the same problem for LadybugBundle, and after I changed server memory from 256 to 512Mb, the problem was solved. Now I have no way to increase memory a little more.

Fabianx’s picture

Title: Figure out what to do about debugging functions » Add LadyBug from Symphony to Core to allow debugging variables within templates
Issue tags: +Needs issue summary update
galactik’s picture

I've increased memory to 1Gb (https://drupal.org/node/1804998#comment-7686117) and now I get:

Your requirements could not be resolved to an installable set of packages.

  Problem 1
    - raulfraile/ladybug-bundle v0.61 requires raulfraile/ladybug v0.6 -> satisfiable by raulfraile/ladybug[v0.6].
    - raulfraile/ladybug-bundle v0.61 requires raulfraile/ladybug v0.6 -> satisfiable by raulfraile/ladybug[v0.6].
    - Can only install one of: raulfraile/ladybug[1.0.0-alpha1, v0.6].
    - Can only install one of: raulfraile/ladybug[v0.6, 1.0.0-alpha1].
    - Installation request for raulfraile/ladybug 1.0.0-alpha1 -> satisfiable by raulfraile/ladybug[1.0.0-alpha1].
    - Installation request for raulfraile/ladybug-bundle v0.61 -> satisfiable by raulfraile/ladybug-bundle[v0.61].


Installation failed, reverting composer.json to its original content.

This is a dead-end.

soulston’s picture

thanks @galactik

Moving this on, what options do we have here:

  • Develop a custom twig extension/solution to see available variables i.e. a contrib module or devel add on
  • Investigate why there are these problems with ladybug
  • Use another established dumper

What does symfony do for this - as suggested it looks like they just use "dump" (http://symfony.com/doc/current/book/templating.html#debugging), but obviously this is not drillable. Do any symfony people out there have any suggestions?

Also while "LadyBug provides references to API docs for known Symfony2 classes", is this really going to be of help to themers?

I agree it would be much better to have one tool that we all use but not the detriment of failing to achieve the goal here - let themers know what is available to use.

Cottser’s picture

Title: Add LadyBug from Symphony to Core to allow debugging variables within templates » Add LadyBug from Symfony to Core to allow debugging variables within templates
Issue tags: -Twig
Cottser’s picture

Issue tags: +Twig

Didn't mean to remove that tag.

jenlampton’s picture

summary update

raulfraile’s picture

Hi, I am Raul Fraile, I created the ladybug library and the Symfony2 bundle.

Both the library and the bundle are now stable after a huge refactoring, sorry for all the troubles while installing alpha versions. I would be really happy to help as much as possible to integrate the library/bundle in Drupal, let me know what I can do. The library allows customized themes, so a Drupal theme could be created using Twig.

Some examples of the new version of the lib: https://github.com/raulfraile/ladybug/blob/master/doc/examples.md

Cheers!

markcarver’s picture

Assigned: Unassigned » markcarver

Hi @raulfraile! I am very, very excited to hear this! I'd love to chat with you about this in #drupal-twig in IRC when you can get a chance! Thanks for such awesome work!

raulfraile’s picture

Great! What time works for you?

raulfraile’s picture

Issue summary: View changes

summary update

donquixote’s picture

Wondering: If we use either KrumoNG or Ladybug or Kint in D7, and also the nice DPQ, then we will need
- autoload capabilities for PSR-0 or equivalent.
- PHP 5.3 upwards for namespaces support.
- Maybe pull in the respective library via composer_manager?

So, would it make sense to start a new branch of D7 devel with added requirements and composer_manager?

markcarver’s picture

Assigned: markcarver » Unassigned
Issue summary: View changes

Not really sure why I apparently assigned this to myself... :-/ Maybe @fubhy can tackle this ;) He seems interested.

Cottser’s picture

@donquixote - not sure how that is related to debugging in the D8 theme layer to be honest.

donquixote’s picture

@Cottser: Sorry I just realize I posted this in the wrong issue. I think I wanted to post this somewhere in the Devel queue.

Cottser’s picture

Version: 8.0.x-dev » 8.1.x-dev
Issue summary: View changes
Status: Active » Postponed

Postponed until at least 8.1.x, this can be added in contrib as well - see the Kint submodule in Devel.

joelpittet’s picture

Version: 8.1.x-dev » 9.x-dev

Let's move this to 9.x. There is a ladybug module for people who want to try it out and kint is in devel.

See which one people tend to prefer.

catch’s picture

Version: 9.x-dev » 8.1.x-dev

I think it's OK to have this against 8.1.x for now since it could go into a minor release (if not 8.1.x itself - agreed on seeing how this goes in contrib for a whle longer, so leaving postponed).

hass’s picture

Status: Postponed » Active

Version: 8.1.x-dev » 8.2.x-dev

Drupal 8.1.0-beta1 was released on March 2, 2016, which means new developments and disruptive changes should now be targeted against the 8.2.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

moshe weitzman’s picture

FYI these modules are a bit challenging to integrate when BigPipe is enabled. Ideally this works together if this issue ever gets re-enabled. See #2678662-13: Ensure BigPipe does not break when HTML document contains CDATA sections or inline scripts matching certain patterns

nicrodgers’s picture

joelpittet’s picture

Priority: Major » Normal

Bring down to normal as this is nice to have but I can't see the significant benefit over what devel provides with kint. Just a nice alternative.

Please let me know if I've missed something in that regard.

Jacine’s picture

I'm finding it impossible to get debug info from inside Twig templates. From my experience so far, most of the time {{ kint() }} is impossible to use. There are either too many instances, and it times out, and/or its location inline is unreadable or gets in the way of what I'm working with directly. When it does work, it's painfully slow and awkward. I need access to these variables either in the message area (preferably) or written to an external file/location.

I'd love to try Ladybug, because I'm told it resolves some of these issues, but I cannot even get it installed. It requires Composer Manager, and I cannot complete the installation ("Your requirements could not be resolved to an installable set of packages."). This is not something I have control over ATM (likely due to contrib patches we have pending). It also sucks to have to install Composer Manager just to use it. From a theming perspective, I could care less about Composer, this is not a project dependency, but a debugging tool, and just want to get my front end work done, without having to understand and resolve a web of Composer and Drupal dependencies. I'm guessing having it in core would help with this part at the very least.

Bottom line for me: I currently depend 100% on the preprocess layer for variable discovery using ksm(), and have given up even attempting to use debugging functions from templates almost entirely.

jibran’s picture

Jacine’s picture

I did manage to get help installing (contrib) Ladybug. However, ldpm() and friends do NOT work within Twig templates. For anyone that comes across this, looking to install the Ladybug contrib module to get this functionality in Twig templates, you might not want to bother wasting your time.

willzyx’s picture

@Jacine I'm working on #2725395: Dumper system Part II: Add basic Twig debug support in the devel issue queue. Once committed every dumper plugin can be used for debug twig templates. Also opened #2707967: Add support for Devel dumper system for adding devel support in ladybug module

Jacine’s picture

Oh, that's fantastic! Thank you @willzyx.

Version: 8.2.x-dev » 8.3.x-dev

Drupal 8.2.0-beta1 was released on August 3, 2016, which means new developments and disruptive changes should now be targeted against the 8.3.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.3.x-dev » 8.4.x-dev

Drupal 8.3.0-alpha1 will be released the week of January 30, 2017, which means new developments and disruptive changes should now be targeted against the 8.4.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

ahmad.h.khalil’s picture

I'm having the same problem as Jacine. I'm getting an out of memory error when using kint in a twig template.

The workaround I have used is:

1) Enable Twig Debugging

2) Use {{ dump() }}

It will give the same output as kint, but without the fancy UI