feat(a11y): add containerRole parameter (#7708)

* Add containerRole parameter to a11y module To fix accessibility error related to aria-roledescription * add types --------- Co-authored-by: Vladimir Kharlampidi <nolimits4web@gmail.com>
nolimits4web · Aug 29, 2024 · 1542c01 · 1542c01
1 parent d79f6e5
commit 1542c01
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 0 deletions.
diff --git a/src/modules/a11y/a11y.mjs b/src/modules/a11y/a11y.mjs
@@ -15,6 +15,7 @@ export default function A11y({ swiper, extendParams, on }) {
       slideLabelMessage: '{{index}} / {{slidesLength}}',
       containerMessage: null,
       containerRoleDescriptionMessage: null,
+      containerRole: null,
       itemRoleDescriptionMessage: null,
       slideRole: 'group',
       id: null,
@@ -302,6 +303,9 @@ export default function A11y({ swiper, extendParams, on }) {
     if (params.containerMessage) {
       addElLabel(containerEl, params.containerMessage);
     }
+    if (params.containerRole) {
+      addElRole(containerEl, params.containerRole);
+    }
 
     // Wrapper
     const wrapperEl = swiper.wrapperEl;

diff --git a/src/types/modules/a11y.d.ts b/src/types/modules/a11y.d.ts
@@ -66,6 +66,13 @@ export interface A11yOptions {
    */
   containerRoleDescriptionMessage?: string | null;
 
+  /**
+   * Value of the "role" attribute to be set on the swiper container
+   *
+   * @default null
+   */
+  containerRole?: string | null;
+
   /**
    * Message for screen readers describing the role of slide element
    *