Suggestion for: (1906780) Discovering and Inspecting Variables in Twig Templates

Created on 18 June 2024, 5 months ago

Problem/Motivation

If I'm a TWIG noob and I'm looking for a value in a TWIG file to render it, there's a lot of documentation on how to get to $_context and how to set up debugging, but there's no real help anywhere for interpreting/understanding $_context. And trial and error is extremely painful with such a large variable to traverse.

Proposed resolution

I've put together 1) a general set of rules for noobs that explains how to more simply look for field text/values in $_context:

************

Looking for a {{ value }} to render in TWIG

This assumes that xdebug is working for you, or that you have {{ dump() }} or {{ kint() }} working in the TWIG file in question.

  • Always start with $_context.
    ## Example: When in a page-level TWIG file, start with $_context->node. At the node-level, it's just $_context.
  • When traversing down into $_context, note the class names listed to the right of elements. They can guide you in the right direction during deep traversal if you know what type of data you're looking for and which class generates it.
    ## Ex. entity (Drupal\file\Entity\File) == a file object
  • Paths to follow:
    • fields->x-default->(yourFieldName)
    • list[N]
    • properties
    • target
  • Path to follow AT THE RIGHT CLASS LEVEL
    • values
      • Only follow a "values" path when you are in the class type you're looking for. If you follow a values array too early, you hit a dead end with related but unusable raw data that Drupal used to generate the actual data you're looking for elsewhere (usually deeper in $_context).
        ## Example: When looking for a user's name, you dig down to $context["node"]->fields["uid"]["x-default"]->list[0]->values["target_id"] and find the uid, but there's no user object with the name property. You'll instead find the user name deeper, under: $context["node"]->fields["uid"]["x-default"]->list[0]->properties["entity"]->target->entity->fields["name"]["x-default"]->list[0]->values["value"] - which will be {{ node.uid.entity.name.value }} in TWIG)
  • Paths to skip (do not contain the values)
    • parent
    • definition
    • typedData[Manager]?
    • fieldDefinition
    • entityKeys (red herring - you want "values" instead)

Converting the $_context...foo->levelN->bar->baz...desiredtext into {{ node.field.foo....desiredtext }} for TWIG

Now that you've found the value in $_context, build your Twig chain by cleaning house:

  1. Copy the complete path from the debugger.
  2. Delete the following strings:
    <ul>
    <li>["x-default"]</li>
    <li>target-></li>
    <li>list[N]-></li>
    <li>entity-></li>
    <li>(Any other property that has no array key attached to it)</li>
    </ul>
    

  3. ## Example: $context["node"]->fields["field_header_image"]->properties["entity"]->fields["field_media_image"]->properties["entity"]->values["uri"]
    becomes...
    node.field_header_image.entity.field_media_image.entity.uri
  4. If the last element in $_context was "values"['<key>'] associative array with a "value" => "" structure, add ".value" to the end:
    node.field_header_image.entity.field_media_image.entity.uri.value

**********************

While this documentation won't work for every scenario, it shoud give noobs that don't get $_context at all a few guardrails to speed up their comprehension. Is there anywhere that this documentation would make sense on drupal.org?

Feature request
Status

Active

Component

Missing documentation

Created by

🇺🇸United States aubjr_drupal

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Production build 0.71.5 2024