Contrib.social

Provide an "Address formatter" text format that supports Twig without Wysiwyg

Open on Drupal.org →
Created on 10 July 2024, 5 months ago

Problem/Motivation

When you add certain DOM structures to CKEditor in source mode, switch out of source mode, and back into source mode, Twig adds extra paragraph tags around the Twig.

Steps to reproduce

1. Add the following code Full HTML input format with CKEditor 5 in Source mode:

<div class="address" translate="no">
    {% if given_name or family_name %}
        <div class="address--name">
            {{ given_name }} {{ family_name }}
        </div>
    {% endif %}
</div>

2. Switch out of Source mode, and then back into Source mode, you see this:

<div class="address" translate="no">
    <p>
        {% if given_name or family_name %}
    </p>
    <div class="address--name">
        {{ given_name }} {{ family_name }}
    </div>
    <p>
        {% endif %}
    </p>
</div>

Proposed resolution

The module should provide a custom (hidden) text format called "Address Formatter (with Twig support)" address_formatter for the module UI that should be used by default, and should not use a Wysiwyg editor, just a plain textarea with monospace font, and the ability to enter any HTML or Twig syntax without reformatting the DOM structure.

Remaining tasks

User interface changes

API changes

Data model changes

🐛 Bug report
Status

Active

Version

2.0

Component

Code

Created by

🇪🇨Ecuador jwilson3

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

Comments & Activities

  • Issue created by @jwilson3
  • Comment 5 months ago →
    🇪🇨Ecuador jwilson3
  • Comment 4 months ago →
    codebymikey

    That's a good shout.

    I think given the way it currently works, we should move away from using a text editor for this, and just have a plain text area with the required markup similar to how Drupal core handles user registration email templates.

  • Comment 4 months ago →
    🇪🇨Ecuador jwilson3

    Completely agree with @codebymikey in #3. There is little benefit to using a wysiwyg formatter here, especially since CKEditor 5 is known to modify HTML it believes to be "incorrect" (even when it is not technically incorrect). CKEditor 5 won't check validity of Twig, only HTML validity and structure, so at best CKE is a partial solution to the equation anyway. The onus should be on a developer to ensure proper HTML structure (eg properly nested and closed tags, etc) just like everywhere else.

    Updated issue summary with Proposed Solution.

  • Comment about 2 months ago →
    🇮🇹Italy kopeboy Milan

    When I try to save an Address format from the manage display page, I get redirected to a weird blank page.
    When I edit it from /admin/config/address-formatter is fine though..

    So it could be that this is caused by CKEditor, but I'm not sure.

    For sure adding a plain text option wouldn't hurt.

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024