feat(chat): Add aria-label to the button

DevExpress · Sep 30, 2024 · b5ece9e · b5ece9e
1 parent 8180012
commit b5ece9e
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 0 deletions.
diff --git a/packages/devextreme/js/__internal/ui/chat/messagebox.ts b/packages/devextreme/js/__internal/ui/chat/messagebox.ts
@@ -119,6 +119,7 @@ class MessageBox extends DOMComponent<MessageBox, Properties> {
       type: 'default',
       stylingMode: 'text',
       disabled: true,
+      elementAttr: { 'aria-label': 'Send' },
       onClick: (e): void => {
         this._sendHandler(e);
       },

diff --git a/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/messageBox.markup.tests.js b/packages/devextreme/testing/tests/DevExpress.ui.widgets/chatParts/messageBox.markup.tests.js
@@ -47,4 +47,12 @@ QUnit.module('MessageBox', moduleConfig, () => {
             assert.strictEqual($button.hasClass(CHAT_MESSAGEBOX_BUTTON_CLASS), true);
         });
     });
+
+    QUnit.module('Accessibility', moduleConfig, () => {
+        QUnit.test('send button should have correct aria-label', function(assert) {
+            const $button = this.$element.find(`.${BUTTON_CLASS}`);
+
+            assert.strictEqual($button.attr('aria-label'), 'Send');
+        });
+    });
 });