List: expose NoDataText to screen readers when empty (T1329047)

packages/devextreme/js/__internal/ui/collection/collection_widget.base.ts

@@ -1439,7 +1439,7 @@ class CollectionWidget<
     return this._itemContainer();
   }
 
-  _renderEmptyMessage(rootNodes?: TItem[]): void {
+  _renderEmptyMessage(rootNodes?: TItem[]): boolean {
     const { items: userItems = [], noDataText } = this.option();
 
     const items = rootNodes ?? userItems;
@@ -1450,7 +1450,6 @@ class CollectionWidget<
       this._$noData.remove();
       // @ts-expect-error ts-error
       this._$noData = null;
-      this.setAria('label', undefined);
     }
 
     if (!hideNoData) {
@@ -1466,6 +1465,8 @@ class CollectionWidget<
       }
     }
     this.$element().toggleClass(EMPTY_COLLECTION, !hideNoData);
+
+    return !hideNoData;
   }
 
   _itemDXEventHandler(

packages/devextreme/js/__internal/ui/list/list.base.ts

@@ -1003,11 +1003,18 @@ export class ListBase extends CollectionWidget<ListBaseProperties, Item> {
     };
 
     this.setAria(elementAria, this.$element());
-    this.setAria({ role: 'application' }, this._focusTarget());
 
     this._setListAria();
   }
 
+  _renderEmptyMessage(rootNodes?: Item[]): boolean {
+    const isEmpty = super._renderEmptyMessage(rootNodes);
+
+    this.setAria({ role: isEmpty ? undefined : 'application' }, this._focusTarget());
+
+    return isEmpty;
+  }
+
   _isMultiSelectMode(): boolean {
     const { selectionMode } = this.option();
     return selectionMode === 'multiple' || selectionMode === 'all';

packages/devextreme/js/__internal/ui/toolbar/toolbar.base.ts

@@ -445,7 +445,9 @@ class ToolbarBase<
     this._applyCompactMode();
   }
 
-  _renderEmptyMessage(): void {}
+  _renderEmptyMessage(): boolean {
+    return false;
+  }
 
   _clean(): void {
     this._$toolbarItemsContainer.children().empty();

packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/lookup.tests.js

@@ -3562,7 +3562,6 @@ if(devices.real().deviceType === 'desktop') {
 
                 const listItemContainerAttributes = {
                     tabindex: '0',
-                    role: 'application',
                 };
 
                 let fieldAttributes = {
@@ -3714,15 +3713,15 @@ if(devices.real().deviceType === 'desktop') {
                 const $scrollView = $list.find(`.${SCROLL_VIEW_CONTENT_CLASS}`);
                 const $itemsContainer = $list.find(`.${LIST_ITEMS_CLASS}`);
 
-                helper.checkAttributes($scrollView, { tabindex: '0', role: 'application' });
+                helper.checkAttributes($scrollView, { tabindex: '0' });
                 helper.checkAttributes($itemsContainer, { });
 
                 helper.widget.option(dataSourcePropertyName, [1, 2, 3]);
                 helper.checkAttributes($scrollView, { tabindex: '0', role: 'application' });
                 helper.checkAttributes($itemsContainer, { 'aria-label': 'Items', role: 'listbox' });
 
                 helper.widget.option(dataSourcePropertyName, []);
-                helper.checkAttributes($scrollView, { tabindex: '0', role: 'application' });
+                helper.checkAttributes($scrollView, { tabindex: '0' });
                 helper.checkAttributes($itemsContainer, { });
             });
         });

packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/selectBox.tests.js

@@ -6150,7 +6150,7 @@ if(devices.real().deviceType === 'desktop') {
                 helper.checkAttributes(helper.widget._list.$element(), listAttributes, localizedRoleDescription);
 
                 const $listItemContainer = helper.widget._list.$element().find(`.${SCROLLVIEW_CONTENT_CLASS}`);
-                helper.checkAttributes($listItemContainer, { role: 'application' }, 'scrollview content');
+                helper.checkAttributes($listItemContainer, { }, 'scrollview content');
 
                 const inputAttributes = {
                     autocomplete: 'off',
@@ -6183,7 +6183,7 @@ if(devices.real().deviceType === 'desktop') {
 
                 listAttributes.id = helper.widget._listId;
                 helper.checkAttributes(helper.widget._list.$element(), listAttributes, 'list');
-                helper.checkAttributes($listItemContainer, { role: 'application' }, 'scrollview content');
+                helper.checkAttributes($listItemContainer, { }, 'scrollview content');
 
                 inputAttributes['aria-controls'] = helper.widget._listId;
                 inputAttributes['aria-owns'] = helper.widget._popupContentId;

packages/devextreme/testing/tests/DevExpress.ui.widgets/listParts/commonTests.js

@@ -5276,4 +5276,33 @@ QUnit.module('Accessibility', () => {
             'checkbox aria-label updated after runtime change');
     });
 
+    [true, false].forEach(repaintChangesOnly => {
+        QUnit.test(`scrollview-content should not have role when dataSource is empty on init and repaintChangesOnly=${repaintChangesOnly} (T1329047)`, function(assert) {
+            const instance = $('#list').dxList({ dataSource: [], repaintChangesOnly }).dxList('instance');
+
+            assert.strictEqual(instance.$element().find(`.${SCROLLVIEW_CONTENT_CLASS}`).eq(0).attr('role'), undefined);
+        });
+
+        QUnit.test(`scrollview-content should have role="application" when dataSource has items on init and repaintChangesOnly=${repaintChangesOnly} (T1329047)`, function(assert) {
+            const instance = $('#list').dxList({ dataSource: ['Item 1'], repaintChangesOnly }).dxList('instance');
+
+            assert.strictEqual(instance.$element().find(`.${SCROLLVIEW_CONTENT_CLASS}`).eq(0).attr('role'), 'application');
+        });
+
+        QUnit.test(`scrollview-content role should be removed when dataSource is cleared at runtime and repaintChangesOnly=${repaintChangesOnly} (T1329047)`, function(assert) {
+            const instance = $('#list').dxList({ dataSource: ['Item 1'], repaintChangesOnly }).dxList('instance');
+
+            instance.option('dataSource', []);
+
+            assert.strictEqual(instance.$element().find(`.${SCROLLVIEW_CONTENT_CLASS}`).eq(0).attr('role'), undefined);
+        });
+
+        QUnit.test(`scrollview-content role should be restored when dataSource is set at runtime and repaintChangesOnly=${repaintChangesOnly} (T1329047)`, function(assert) {
+            const instance = $('#list').dxList({ dataSource: [], repaintChangesOnly }).dxList('instance');
+
+            instance.option('dataSource', ['Item 1']);
+
+            assert.strictEqual(instance.$element().find(`.${SCROLLVIEW_CONTENT_CLASS}`).eq(0).attr('role'), 'application');
+        });
+    });
 });