Description toggle: CKEditor field description is not displayed for text format

Created on 19 October 2022, about 2 years ago
Updated 19 August 2024, 3 months ago

Problem/Motivation

Field description is not displayed for text format (i.e. body)

Steps to reproduce

On a standard installation Drupal

  • Enable the Gin admin theme. (/admin/appearance/)
  • Make sure 'Enable form description toggle' is checked. (/admin/appearance/settings/gin)
  • Add a description to the Article body field. (/admin/structure/types/manage/article/fields/node.article.body)
  • Confirm the description is NOT displayed (/node/add/article)
  • Uncheck 'Enable form description toggle' is enabled. (/admin/appearance/settings/gin)
  • Confirm the description is displayed (/node/add/article)

Proposed resolution

Adjust 'Enable form description toggle' functionality

Remaining tasks

Create PR
Review PR
Merge PR

User interface changes

N/A

API changes

N/A

Data model changes

N/A

🐛 Bug report
Status

Needs review

Version

3.0

Component

Code

Created by

🇺🇸United States jrockowitz Brooklyn, NY

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

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • 🇺🇸United States paul121 Spokane, WA

    I'm not sure I understand the reported use-case "text format (i.e. body)" but believe I'm experiencing this same issue in this context: for a text_long field using the text_textarea field widget, the description field is hidden when the show_description_toggle setting is turned on.

    Interestingly, the description text is rendered in HTML, but it has the visually-hidden class so it is hidden. But the field's label does not get the "help" icon to toggle the description.

    I'm also noticing that the description is hidden in forms that are "gin content form routes" as well as "non gin content form routes". Again, this only happens when the show_description_toggle setting is turned on.

    I think I've found a fix.. there are a few parts:

    1. Do not apply description toggle variables when not on a gin content form route. I believe this always happens for the text format wrapper here: https://git.drupalcode.org/project/gin/-/blob/8.x-3.0-rc1/includes/form....
    2. Render the "help" icon/toggle button with the field label. I wonder if this broke with the changes from #3281381: Description toggle (help icon) does not adhere to description display settings correctly . There a show_description_toggle twig variable was added: {% set show_description_toggle = description_toggle and description.content %} https://git.drupalcode.org/project/gin/-/blob/8.x-3.0-rc1/templates/form.... The problem is that for the textarea, the description gets moved to the text format wrapper, and description.content is never populated. Thus, in form-element.html.twic the "help" button is never rendered in the template: https://git.drupalcode.org/project/gin/-/blob/8.x-3.0-rc1/templates/form...
    3. Correct the description_toggle.js to work with this textarea/text format field. As it is currently implemented I don't see how this would have ever worked for textarea fields... the js looks for the nearest parent .help-icon__description-container, but because the textarea description gets moved to the text format wrapper, we actually need to move up to the second parent .help-icon__description-container.... relevant code: https://git.drupalcode.org/project/gin/-/blob/8.x-3.0-rc1/js/description...
  • 🇺🇸United States paul121 Spokane, WA

    There a show_description_toggle twig variable was added: {% set show_description_toggle = description_toggle and description.content %}

    If I'm following the logic correctly I don't believe that this intermediary variable is necessary in any of the twig templates. The variable seems to just do an additional check to only render if the description is not empty. However, I believe the descritpion_toggle is only ever set to TRUE if a description is provided...

    Following this preprocess logic:
    https://git.drupalcode.org/project/gin/-/blob/8.x-3.0-rc1/includes/form....
    https://git.drupalcode.org/project/gin/-/blob/8.x-3.0-rc1/src/GinDescrip...

  • @paul121 opened merge request.
  • Status changed to Needs review almost 2 years ago
  • 🇺🇸United States paul121 Spokane, WA

    I've opened a MR that addresses these points. I'm not familiar with CKEditor but hope this might solve that issue too, if someone can please test!!

  • 🇮🇳India Nupur Badola

    Front page is not created yet.

  • 🇺🇸United States jrockowitz Brooklyn, NY

    Here is the latest diff as a patch.

  • Status changed to Needs work over 1 year ago
  • 🇮🇳India djsagar

    Adding one more point which related to this issue.

    When Enable form description toggle.
    Show a help icon to show/hide form descriptions on content forms.

    When i Enable the description toggle this show/hide not visible.

  • 🇪🇸Spain idiaz.roncero Madrid

    The patch in #14 fixes the issue for me.

  • 🇺🇸United States jrockowitz Brooklyn, NY

    I found a regression that seems to be related to the patch from #14

    Clicking the description help toggle (?) for the Revision log message reloads the entire page.

    • Install Drupal 10.2.x, Gin Admin Theme, and the patch.
    • Set the Gin as the 'Administration theme' (/admin/appearance)
    • Enable 'Enable form description toggle' (/admin/appearance/settings/gin)
    • Go to the 'Add page' node form (/node/add/page)
    • Enter the 'Title'
    • Click the (?) next to 'Revision log message'
    • Confirm that the page is being submitted and loading the preview.

    Note that the below error is being logged in the JS console with the patch. Withoug the patch, there are no JS errors and the (?) next to 'Revision log message' works as expected.

    Uncaught TypeError: Cannot read properties of null (reading 'querySelectorAll')

  • Status changed to Needs review 3 months ago
  • 🇺🇸United States callinmullaney

    We applied patch #14 to a recent project and ran into the same error that jrockowitz reported. We also noticed it occurs when a mix of plain text and formatted text fields are loaded in the same form. We opted to use a general `parentNode` to select the format wrapper for all fields instead. This might not be the preferred approach but it does seem to resolve the error and continue working for all previous field types.

Production build 0.71.5 2024