TileView: Fix aria-activedescendant setting (T1217255)

packages/devextreme/js/ui/tile_view.js

@@ -7,7 +7,7 @@ import { isDefined } from '../core/utils/type';
 import { extend } from '../core/utils/extend';
 import { hasWindow } from '../core/utils/window';
 import { getPublicElement } from '../core/element';
-import { deferRender } from '../core/utils/common';
+import { noop, deferRender } from '../core/utils/common';
 import { nativeScrolling } from '../core/utils/support';
 import ScrollView from './scroll_view';
 import CollectionWidget from './collection/ui.collection_widget.edit';
@@ -271,6 +271,8 @@ const TileView = CollectionWidget.inherit({
         }).bind(this));
     },
 
+    _refreshActiveDescendant: noop,
+
     _getItemPosition: function(item) {
         const config = this._config;
         const mainPosition = config.mainPosition;

packages/devextreme/testing/testcafe/helpers/widgetTypings.ts

@@ -40,6 +40,7 @@ export type WidgetName =
   | 'dxTextBox'
   | 'dxTextArea'
   | 'dxToolbar'
+  | 'dxTileView'
   | 'dxTreeView'
   | 'dxDateBox'
   | 'dxDateRangeBox'

packages/devextreme/testing/testcafe/tests/accessibility/tileView.ts

@@ -0,0 +1,35 @@
+import url from '../../helpers/getPageUrl';
+import { clearTestPage } from '../../helpers/clearPage';
+import { testAccessibility, Configuration } from '../../helpers/accessibility/test';
+import { Options } from '../../helpers/generateOptionMatrix';
+import { Properties } from '../../../../js/ui/tile_view.d';
+
+fixture.disablePageReloads`Accessibility`
+  .page(url(__dirname, '../container.html'))
+  .afterEach(async () => clearTestPage());
+
+const options: Options<Properties> = {
+  items: [[{ text: 'test 1' }]],
+  focusStateEnabled: [true],
+};
+
+const created = async (t: TestController): Promise<void> => {
+  await t.pressKey('tab');
+};
+
+const a11yCheckConfig = {
+  rules: {
+    'color-contrast': {
+      enabled: false,
+    },
+  },
+};
+
+const configuration: Configuration = {
+  component: 'dxTileView',
+  a11yCheckConfig,
+  options,
+  created,
+};
+
+testAccessibility(configuration);

packages/devextreme/testing/tests/DevExpress.ui.widgets/tileView.tests.js

@@ -276,6 +276,28 @@ QUnit.module('rendering', {
         assert.strictEqual($tile.outerHeight(), DEFAULT_ITEMSIZE, 'Tile height updated correctly');
         assert.strictEqual($tile.outerWidth(), DEFAULT_ITEMSIZE, 'Tile width updated correctly');
     });
+
+    QUnit.testInActiveWindow('aria-activedescendant should not be set for the component after tile focus (T1217255)', function(assert) {
+        const clock = sinon.useFakeTimers();
+
+        try {
+            this.$element.dxTileView({
+                items: [{ text: 'test 1' }],
+                focusStateEnabled: true,
+            });
+
+            const $firstItem = this.$element.find(TILEVIEW_ITEM_SELECTOR).eq(0);
+
+            $firstItem.trigger('dxpointerdown');
+
+            clock.tick(10);
+
+            assert.strictEqual($firstItem.hasClass('dx-state-focused'), true);
+            assert.strictEqual(this.$element.attr('aria-activedescendant'), undefined);
+        } finally {
+            clock.restore();
+        }
+    });
 });