Tabbed fieldgroups broken after update 3.0.11 => 3.0.12

Created on 25 May 2024, 6 months ago
Updated 8 June 2024, 6 months ago

Problem/Motivation

Background

We have content displayed in a tabbed fieldgroups as illustrated below...

Everything works nicely; we have a step-by-step presentation in the first tab, and YouTube video in the second tab...

Underlying markup

The underlaying markup (below) shows the detail of each tab rendered as expected as <detail> elements with classes: card horizontal-tabs-pane...

<div class=" explanation-tabs field-group-tabs-wrapper">
  <div data-horizontal-tabs="" class="horizontal-tabs clearfix" data-once="horizontal-tabs">
    <ul data-horizontal-tabs-list="" class="horizontal-tabs-list">
      <li class="horizontal-tab-button horizontal-tab-button-0 first selected" tabindex="-1"
        data-horizontaltabbutton="0"><a href="#edit-group-tab-self-paced"><strong>Go step-by-step at your own
            pace</strong><span class="summary"></span><span id="active-horizontal-tab" class="visually-hidden">(active
            tab)</span></a></li>
      <li class="horizontal-tab-button horizontal-tab-button-1 last" tabindex="-1" data-horizontaltabbutton="1"><a
          href="#edit-group-video-version"><strong>Watch and listen</strong><span class="summary"></span></a></li>
    </ul>
    <div data-horizontal-tabs-panes="" class="horizontal-tabs-panes">
      <input class="horizontal-tabs-active-tab" type="hidden" value="edit-group-tab-self-paced">

      <details class="tab-self-paced js-form-wrapper form-wrapper card horizontal-tabs-pane"
        id="edit-group-tab-self-paced" open="open" data-once="details">
        ...
      </details>

After theme update

Immediately after updating 3.0.11 => 3.012 these fieldgroups are smashed and don't render at all.

Debugging

Digging into the markup, it seems that after the update, the <detail> HTML elements are incorrectly rendered as accordions! as show in the markup below...

<details class="accordion-item" data-once="details">
  <summary role="button" aria-controls="edit-group-tab-self-paced" aria-expanded="false" class="accordion-header">
  </summary>
</details>

That's quite a hard-hitting bug ;-)

Versions affected

We have experimented with updates both 3.011 => 3.0.12 and 3.011 => 3.0.12 and we can confirm that we are seeing the same symptoms with both.

Rolling back to 3.0.11 fixes it all back up immediately

🐛 Bug report
Status

Fixed

Version

3.0

Component

Code

Created by

🇬🇧United Kingdom SirClickALot Somerset

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

Comments & Activities

Production build 0.71.5 2024