Views field mappings to pattern have Twig debug comments if debug is enabled

Created on 17 May 2023, over 1 year ago
Updated 19 July 2024, 3 months ago

Problem/Motivation

When mapping Views fields to a pattern and Twig debug mode is enabled, the HTML comments still show up. While that is not really a bug and one could argue it should do that, there is no way I can find to make sure to just get the clean value of the field without additional code.

The debug output in these cases also doesn't really provide any value in the pattern context.

Here is an example of both a link and an image as part of a card pattern where it would help to be able to suppress it since the clean value is needed, especially the link, which is unusable without switching debug off temporarily locally.

<a href="
<!-- THEME DEBUG -->
<!-- THEME HOOK: 'views_view_field' -->
<!-- BEGIN OUTPUT from 'core/modules/views/templates/views-view-field.html.twig' -->
/some/path/on/site
<!-- END OUTPUT from 'core/modules/views/templates/views-view-field.html.twig' -->
" class="card">
  <div class="card__image">
    <!-- THEME DEBUG -->
    <!-- THEME HOOK: 'views_view_field' -->
    <!-- BEGIN OUTPUT from 'core/modules/views/templates/views-view-field.html.twig' -->
    <!-- THEME DEBUG -->
    <!-- THEME HOOK: 'image_formatter' -->
    <!-- BEGIN OUTPUT from 'core/modules/image/templates/image-formatter.html.twig' -->
    <!-- THEME DEBUG -->
    <!-- THEME HOOK: 'image_style' -->
    <!-- BEGIN OUTPUT from 'core/modules/image/templates/image-style.html.twig' -->
    <!-- THEME DEBUG -->
    <!-- THEME HOOK: 'image' -->
    <!-- BEGIN OUTPUT from 'core/themes/claro/templates/classy/field/image.html.twig' -->

    <img loading="lazy" src="/system/files/styles/manual_crop/private/2023-01/logo.png?h=9d177b75&amp;itok=WsSymWxl" width="128" height="128" alt="" typeof="foaf:Image" class="image-style-manual-crop">

    <!-- END OUTPUT from 'core/themes/claro/templates/classy/field/image.html.twig' -->
    <!-- END OUTPUT from 'core/modules/image/templates/image-style.html.twig' -->
    <!-- END OUTPUT from 'core/modules/image/templates/image-formatter.html.twig' -->
    <!-- END OUTPUT from 'core/modules/views/templates/views-view-field.html.twig' -->
  </div>
  <h3 class="card__title">
    .....

For some instances I can apply Twig filters to strip it, but that doesn't seem ideal and would not always work.

Or am I missing a setting somewhere?

Steps to reproduce

  1. Enable Twig debug mode
  2. Map views fields to pattern where clean value is required
💬 Support request
Status

Postponed: needs info

Version

1.5

Component

UI Patterns Views

Created by

🇦🇺Australia NicolasH

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

Comments & Activities

  • Issue created by @NicolasH
  • 🇫🇷France Grimreaper France 🇫🇷

    Hi,

    For Twig variables meant to be used in HTML tag attributes, use settings ( https://www.drupal.org/project/ui_patterns_settings ) in your pattern instead of fields.

  • 🇦🇺Australia NicolasH

    Thanks, I will use that module anyway eventually, so just tested it for this.

    I chose the attributes type with this definition:

    settings:
        href:
          type: attributes
          label: href
          expose_as_field: true
    

    I need to use the expose_as_field option, as otherwise I can't map it in the view, I don't have a token.

    Unfortunately I end up with the same result.

    Now I think it would be reasonable to strip html comments in something like an attribute setting, so it still might be the best option to follow up in that module. Just posting this here as well in case I've missed something about your suggestion.

  • 🇫🇷France Grimreaper France 🇫🇷

    Hi,

    attribute type is to have a twig variable to print as attributes, not a specific attribute value. use another type like textfield or url, see https://git.drupalcode.org/project/ui_suite_bootstrap/-/blob/5.0.x/templ....

    I don't have opinion about the expose_as_field, as I don't have the views usage yet.

    Hope this help!

  • 🇫🇷France duaelfr Montpellier, France

    Hi @NicolasH
    I suppose that you might need Allow tokens for url of the Link field Needs work to get the token you want but maybe I'm not understanding your issue properly.

  • Status changed to Postponed: needs info over 1 year ago
  • 🇫🇷France Grimreaper France 🇫🇷
  • 🇪🇸Spain idiaz.roncero Madrid

    Same here, I tried to try to pass a plain URL text to a pattern using views but it outputs the twig debug comments when enabled.

    No amount of views processing (removing whitespace, rewrite results, etc) prevents this.

    A solution is to put {{ url | striptags | trim | etc }} on the pattern but this feels like a workaround and ... it should be implemented on all pattern props just in case you use a view? - it does not feel right.

  • 🇦🇺Australia NicolasH

    FWIW, outcome was still as in #7. I ended up with the same twig filter workaround and agree with Idiaz that it doesn't feel like a good solution.

    None of the suggestions solve the issue when needing to map a URL in a view with twig debug on AFAICT. But not sure what further info can be provided.

Production build 0.71.5 2024