When the bulk actions are first rendered, the item count in the
aria-live region will not be announced by screen readers as aria-live
regions need to be present in the DOM and changed before screen readers
can announce their content.
This commit ensures that the item selection count will be announced
when the bulk actions get added to the DOM by calling
`updateBulkItemSelection()` after rendering the bulk actions HTML. This
removes the non-breaking space in the template, effectively causing a
change in DOM without affecting the visuals, and allowing screen readers
to announce the contents of the item count.
Replace previous ad-hoc fixes for active item spacing in dropdown
menu items.
Changes to Javascript are due to the following bug in our SCSS
compiler, preventing a simpler `&:has([...])` selector:
https://github.com/scssphp/scssphp/issues/606
Co-authored-by: Mikel Martín <mikel@moodle.com>
The 'in' rule currently behaves the same way that 'eq' does when used
with multi-selects, which is not correct. It should be modelled by
checking whether the selected values are a subset of the rule values
(i.e. selected values are 'in' the rule values). This patch implements
that for core form rules as well as for the admin settings show/hide.
Several behat features are updated as well, because these were verifying
the incorrect behaviour for multi-select in rules.
- Updated autocomplete behavior to announce dynamic changes
via ARIA live regions
- Fixed focus management for keyboard and screen reader navigation
- Added proper role/aria tags for interactive tag components
After upgrading to Bootstrap 5 (Moodle v5), opening a modal no longer prevents the background content from scrolling.
This fix restores the intended behavior by mimicking Bootstrap 5's JavaScript logic that disables background scrolling
when a modal is open.
Since move to BS5 data-* attributes in 0c586b41 trying to open custom
menu dropdowns that had been moved to the "More" sub-menu was broken.
It appears that Bootstrap now handles open/close for us automatically
(so we were effectively closing the menu immediately after Bootstrap
opened it).
During the Bootstrap 5.0 upgrade the event handling within dynamic
tabs appears to have changed such that the "click" event happens
too late for the form change checker module to determine whether
there were any "dirty" forms on the tab being switched from.
This is related to, although not specifically caused by, changes
made in 0c586b41.
> ARIA Expanded
A disclosure is a widget that allows content to be
collapsed (hidden) or expanded (visible). It has two elements:
1. Disclosure button, and
2. Section of content whose visibility is controlled by the button.
ARIA Expanded must be applied to the disclosure button element
or the element with role="button" rather than the content.
> ARIA label
Move the icon title and aria-label as they are not
interactive elements to the toggle element.
The title attribute is helpful for the tooltip,
and the aria-label benefits the screen reader.
This is the beginning of the end for non-routed pages in Moodle and the
start of SEO-friendly page URLs.
A 'shim' is provided for backwards compatibility.
ChartJs has a property called locale that makes possible to format scale
numbers according to a language. This way we ensure that decimal places
will be displayed correctly in the chart labels and tooltips.
This removes the "max" attribute from the input field of the
datetime filter. This can then be added back in by specific
filters if they inherit the core one and add their own
getContext() method.
Bootstrap EventHandler is managing the keydown event at document
level in the capture phase. That is conflicting with dropdown elements
with form autocomplete inputs inside, because when suggestions panel is
open, pressing the "Esc" key will close the whole dropdown.
This commit fixes that behaviour by realocating the Bootsrap dropdown
event listener to the body instead of the document.
You don’t need jQuery in Bootstrap 5, but it’s still possible to use our components with jQuery.
If Bootstrap detects jQuery in the window object, it’ll add all of our components in jQuery’s plugin system.
This allows you to do the following:
$('#myTooltip').tooltip('show')
- Fix subpanels positioning using data-bs-popper static
- Fix subpanels and dialogs event listener to use Boostrap EventHandler.
Doing that will avoid Bootstrap from stop propagating the event to the
subpanels and dialogs listeners.
- .custom-check is now .form-check.
- .custom-check.custom-switch is now .form-check.form-switch.
- .custom-select is now .form-select.
- .custom-file and .form-file have been replaced by custom styles on top of .form-control.
- .custom-range is now .form-range.
- Dropped .input-group-append and .input-group-prepend. You can now just add buttons
and .input-group-text as direct children of the input groups.
Data attributes for all Bootstrap5 JavaScript plugins are now namespaced
to help distinguish Bootstrap functionality from third parties and your own code.
For example, data-bs-toggle instead of data-toggle.
This commit refactor all old Bootstrap data-attributes to the new syntax.
Co-authored-by: Daniel Ziegenberg <daniel@ziegenberg.at>
When chartJs was updated to version 3.8.0, chart axis were now accessed
as a object property instead of an array element. This solution aims to
update the way we set the axis properties, aiming to display the labels
and other properties.
Huong Nguyen