Score:-1

View plain text field causing rendering issues for translations

cn flag

Our news section has a plain text field for article header. At the time of development this seemed like a good idea, however, having gone live, some languages like French has special characters which is now causing rendering issues as example:

enter image description here

Is rendered as:

enter image description here

I understand why this is happening as text fields are "escaped" for security reasons. The problem here is one of hindsight:

  1. We cannot delete the field or "convert" the field to a formatted text as that would require all languages to redo all of the articles
  2. We cannot add any additional filters in the "view" as there isn't a filter allowing me to say "please allow certain characters" as in this case l' is considered an escaped character in the database.

I assume my only option is to try and override the value in my twig file: (views-view-fields--news.html.twig):

<div class="col-md-4">
    <div class="card newscard"> {{ fields.field_summary_image.content }}
        <div class="card-body">
            <h5 class="card-title">
                <a href="{{ fields.view_node.content|render|striptags|trim }}">{{ fields.field_article_title.content|render|striptags }}</a>
            </h5>
            <p>{{ fields.created.content|render|striptags|trim }}</p>
        </div>
    </div>
</div>

I have however tried to obtain the raw value but cannot get the raw value as this is a rendered "field" (which renders the wrapping HTML along with content).

I have also tried to move this to the unformatted view (views-view-unformatted--news.html.twig):

<div class="card-deck" id="ajaxnewscontainer">
    {% for row in rows %}
        <div class="col-md-4">
            <div class="card newscard"> {{ fields.field_summary_image.content }}
                <div class="card-body">
                    <h5 class="card-title">
                        <a href="{{ fields.view_node.content|render|striptags|trim }}">{{ fields.field_article_title.content|render|striptags }}</a>
                    </h5>
                    <p>{{ fields.created.content|render|striptags|trim }}</p>
                </div>
            </div>
        </div>
    {% endfor %}
</div>

However, in this scenario I am not getting any values as doing a {{ dump(row) }} renders my 32GB of RAM useless so cannot determine how to obtain the "row" array elements so that I can hopefully end up getting the "raw" value of fields.field_article_title.content|render|striptags

Any ideas?

cn flag
I'd recommend against this approach, it never ends well. Instead add a new formatted field, and write an update hook which transfers the content from the old to the new.
sonfd avatar
in flag
Why are you rendering with `|render|striptags|trim`? Afaik, that will always cause you to see encoded html entities.
4uk4 avatar
cn flag
But why use `&#39;` in the first place? Type the apostrophe with you keyboard. There are many plain text fields in Drupal which are translated, most prominently entity labels.
4uk4 avatar
cn flag
@sonfd Yes, this is probably the problem. It's not as I suspected. The translation contains the apostrophe as ASCII character, This is converted to an HTML entity by the default XSS filter applied to all plain text fields and then it is escaped a second time by this Twig filter.
4uk4 avatar
cn flag
So normally translated plain text fields don't cause any issue.
mauzilla avatar
cn flag
Without the |render, the field is blank.
Score:2
in flag

I don't think this has anything to do with translations other than your translation is the version of the node that happens to have an apostrophe in this field.

The issue is because you are rendering your field with |render|striptags|trim like:

{{ fields.created.content|render|striptags|trim }}

This will always cause issues where encoded html entities are displayed.

From @4uk4 in a comment above:

The translation contains the apostrophe as ASCII character, this is converted to an HTML entity by the default XSS filter applied to all plain text fields and then it is escaped a second time by this Twig filter.

To resolve, render your field without using |render|striptags|trim, i.e. just use:

{{ fields.created.content }}
mauzilla avatar
cn flag
Without the |render the result is blank
sonfd avatar
in flag
Are you using `{{ fields.created.content }}` or `{{ fields.created.content|striptags|trim }}`. The latter won't work.
mangohost

Post an answer

Most people don’t grasp that asking a lot of questions unlocks learning and improves interpersonal bonding. In Alison’s studies, for example, though people could accurately recall how many questions had been asked in their conversations, they didn’t intuit the link between questions and liking. Across four studies, in which participants were engaged in conversations themselves or read transcripts of others’ conversations, people tended not to realize that question asking would influence—or had influenced—the level of amity between the conversationalists.