Accordion Closed by Default not adding hidden attribute

Created on 20 March 2024, 8 months ago
Updated 3 May 2024, 7 months ago

Problem/Motivation

Thanks for all your hard work on this collection of modules, it's incredible to be able to just add in things rather than hand-code them.

In trying to add an Accordion, I want them all to be closed by default. When I check the box in the popup dialog for starting with them all collapsed, I do see that the aria-expanded="false" gets set, but there is not a corresponding hidden attribute added to the accordion content elements. The result is that all my accordions are open by default, but the icon on the header is a + sign until I click one of them, then they all get corrected and work properly.

Also,
Is there a way to default to a text format on the body field? I have to set it every time I make changes to my accordions.

πŸ› Bug report
Status

Closed: outdated

Version

2.0

Component

Code

Created by

πŸ‡ΊπŸ‡ΈUnited States rex.barkdoll

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

Comments & Activities

  • Issue created by @rex.barkdoll
  • Status changed to Closed: duplicate 8 months ago
  • πŸ‡ΊπŸ‡ΈUnited States smustgrave

    Seems to be the same as ✨ CKEditor overwrites aria-expanded="true" to "false" upon save Active which still don't have fix for

  • Status changed to Active 8 months ago
  • πŸ‡ΊπŸ‡ΈUnited States rex.barkdoll

    No, I think this is a distinct issue. My problem is different from the other ticket because it deals with the hidden attribute on the accordion content, not the aria attribute on the button. I'm also not editing the source code, I'm trying to check the Start collapsed checkbox and have it work properly out of the box.

    I think I found a solution to my problem while messing around:

    In templates/embedded-content/accordion.html.twig
    Update line 26 to the following:
    <div id="{{ key }}" class="usa-accordion__content usa-prose" {% if startcollapsed == 1 %}hidden{% else %}{% endif %}>

  • Status changed to Postponed: needs info 7 months ago
  • πŸ‡ΊπŸ‡ΈUnited States smustgrave

    Tried replicating but it defaults to open, checking startcollapsed closes it. You shouldn't need the code in #3 per the docs in https://designsystem.digital.gov/components/accordion/ adding aria-expanded value sets that.

  • Status changed to Closed: outdated 7 months ago
  • πŸ‡ΊπŸ‡ΈUnited States smustgrave
Production build 0.71.5 2024