DataGrid: Fix an issue in the setAria method that occurred when the value was undefined (#32274)

Co-authored-by: Alyar <>

Author: Alyar666

packages/devextreme/js/__internal/grids/data_grid/summary/m_summary.ts

@@ -44,8 +44,7 @@ export const renderSummaryCell = function (cell, options, setAria) {
   const $summaryItems: any = [];
 
   if (!column.command && summaryItems) {
-    for (let i = 0; i < summaryItems.length; i++) {
-      const summaryItem = summaryItems[i];
+    for (const summaryItem of summaryItems) {
       const text = gridCore.getSummaryText(summaryItem, options.summaryTexts);
       const $summaryItemElement = $('<div>')
         .css('textAlign', summaryItem.alignment || column.alignment)
@@ -55,7 +54,7 @@ export const renderSummaryCell = function (cell, options, setAria) {
         .toggleClass(DATAGRID_GROUP_TEXT_CONTENT_CLASS, options.rowType === 'group')
         .text(text);
 
-      setAria('label', `${column.caption} ${text}`, $summaryItemElement);
+      setAria('label', `${column.caption ?? ''} ${text ?? ''}`, $summaryItemElement);
       $summaryItems.push($summaryItemElement);
     }
     $cell.append($summaryItems);

packages/devextreme/js/__internal/grids/grid_core/m_modules.ts

@@ -9,7 +9,7 @@ import Callbacks from '@js/core/utils/callbacks';
 // @ts-expect-error
 import { grep } from '@js/core/utils/common';
 import { each } from '@js/core/utils/iterator';
-import { isFunction } from '@js/core/utils/type';
+import { isDefined, isFunction } from '@js/core/utils/type';
 import { hasWindow } from '@js/core/utils/window';
 import errors from '@js/ui/widget/ui.errors';
 
@@ -150,6 +150,10 @@ export class ModuleItem {
     value: string | number | boolean | undefined,
     $target: dxElementWrapper,
   ) {
+    if (!isDefined(value)) {
+      return;
+    }
+
     const target = $target.get(0);
     const prefix = name !== 'role' && name !== 'id' ? 'aria-' : '';
     const normalizedValue = String(value).replace(/\s+/g, ' ').trim();

packages/devextreme/js/__internal/grids/grid_core/selection/m_selection.ts

@@ -899,7 +899,7 @@ export const rowsViewSelectionExtenderMixin = (Base: ModuleType<RowsView>) => cl
                 $row
                   .toggleClass(ROW_SELECTION_CLASS, isSelected === undefined ? false : isSelected)
                   .find(`.${SELECT_CHECKBOX_CLASS}`).dxCheckBox('option', 'value', isSelected);
-                that.setAria('selected', isSelected, $row);
+                that.setAria('selected', String(isSelected), $row);
               }
             }
           });
@@ -949,7 +949,7 @@ export const rowsViewSelectionExtenderMixin = (Base: ModuleType<RowsView>) => cl
 
       const selectionMode = this.option(SELECTION_MODE);
       if (selectionMode !== 'none') {
-        this.setAria('selected', isSelected, $row);
+        this.setAria('selected', String(isSelected), $row);
       }
     }
 

packages/devextreme/testing/tests/DevExpress.ui.widgets.dataGrid/gridView.tests.js

@@ -532,9 +532,9 @@ QUnit.module('Grid view', {
                 ],
                 totalItem: {
                     summaryCells: [
-                        { summaryType: 'count', value: 100 },
-                        { summaryType: 'min', value: 0 },
-                        { summaryType: 'max', value: 120001 }
+                        [{ summaryType: 'count', value: 100 }],
+                        [{ summaryType: 'min', value: 0 }],
+                        [{ summaryType: 'max', value: 120001 }]
                     ]
                 }
             })
@@ -592,7 +592,7 @@ QUnit.module('Grid view', {
                 ],
                 totalItem: {
                     summaryCells: [
-                        { summaryType: 'count', value: 100 }
+                        [{ summaryType: 'count', value: 100 }]
                     ]
                 }
             })
@@ -1626,9 +1626,9 @@ QUnit.module('Synchronize columns', {
                 items: [{ values: [''] }],
                 totalItem: {
                     summaryCells: [
-                        { summaryType: 'count', value: 100 },
-                        { summaryType: 'min', value: 0 },
-                        { summaryType: 'max', value: 120001 }
+                        [{ summaryType: 'count', value: 100 }],
+                        [{ summaryType: 'min', value: 0 }],
+                        [{ summaryType: 'max', value: 120001 }]
                     ]
                 }
             })
@@ -1663,9 +1663,9 @@ QUnit.module('Synchronize columns', {
                 items: [{ values: [''] }],
                 totalItem: {
                     summaryCells: [
-                        { summaryType: 'count', value: 100 },
-                        { summaryType: 'min', value: 0 },
-                        { summaryType: 'max', value: 120001 }
+                        [{ summaryType: 'count', value: 100 }],
+                        [{ summaryType: 'min', value: 0 }],
+                        [{ summaryType: 'max', value: 120001 }]
                     ]
                 }
             })