[#35671] - [4.0] Accordions always collapsed by default
- Closed
- 5 Nov 2021
- Medium
- Build: 4.0-dev
- # 35671
Steps to reproduce the issue
Create an accordion:
<?php echo HTMLHelper::_('bootstrap.startAccordion', 'group', [
'parent' => 'group',
'active' => 'slide-1',
]); ?>
<?php echo HTMLHelper::_('bootstrap.addSlide', 'group', 'Title A', 'slide-1'); ?>
Content A
<?php echo HTMLHelper::_('bootstrap.endSlide'); ?>
<?php echo HTMLHelper::_('bootstrap.addSlide', 'group', 'Title B', 'slide-2'); ?>
Content B
<?php echo HTMLHelper::_('bootstrap.endSlide'); ?>
<?php echo HTMLHelper::_('bootstrap.endAccordion'); ?>Expected result
The first slide should be active and expanded on page load
Actual result
All slides are collapsed
System information (as much as possible)
Issue comes from media/vendor/bootstrap/js/collapse.js where all accordions are forced to collapse.
Additional comments
In addition to this, the aria-expanded attribute in accordions is always empty.
Should be:
$ariaExpanded = trim($in) === 'show' ? 'true' : 'false';
joomla-cms-bot
- | Labels |
Added:
No Code Attached Yet
|
||
| Title |
|
||||||
| Title |
|
||||||
You are right, without using the parent option, the active slide works, but also the accordion doesn't automatically collapse a slide when another one is opened, so you end up with all slides open as you click them. My understanding is that this is why you would use the parent option to begin with.
Check the code in the file I referenced.
$in = static::$loaded[__CLASS__ . '::startAccordion'][$selector]['active'] === $id ? ' show' : '';$in is set to ' show', with an extra leading space. Then after that you have a strict check that will never be true:
$ariaExpanded = $in === 'show' ? true : false;
And finally, since the values are set to boolean instead of strings, they output on the page will either be one or zero within the attribute.
For this last bit you may need to check the source of the page using view-source: in the address bar, rather than looking at the page after it's been loaded and javascript initialized.
I cannot confirm your comments regarding the $ariaexpanded. That is working perfectly as intended.
| Status | New | ⇒ | Closed |
| Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2021-11-05 13:59:41 |
| Closed_By | ⇒ | jreviews |
You don't need
'parent' => 'group',in the arrayI can not confirm your issue with aria-expanded