fix(core): focus first element in data-list

taiga-family · Dec 3, 2024 · 12b6db7 · 12b6db7
1 parent 84fd6e4
commit 12b6db7
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 10 deletions.
diff --git a/projects/cdk/utils/focus/get-closest-focusable.ts b/projects/cdk/utils/focus/get-closest-focusable.ts
@@ -53,15 +53,15 @@ export function tuiGetClosestFocusable({
 
     treeWalker.currentNode = initial;
 
-    while (previous ? treeWalker.previousNode() : treeWalker.nextNode()) {
+    do {
         if (tuiIsHTMLElement(treeWalker.currentNode)) {
             initial = treeWalker.currentNode;
         }
 
         if (tuiIsHTMLElement(initial) && check(initial)) {
             return initial;
         }
-    }
+    } while (previous ? treeWalker.previousNode() : treeWalker.nextNode());
 
     return null;
 }
diff --git a/projects/demo-playwright/tests/core/data-list/data-list.pw.spec.ts b/projects/demo-playwright/tests/core/data-list/data-list.pw.spec.ts
@@ -36,37 +36,50 @@ test.describe('DataList', () => {
         const example = documentationPagePO.getExample('#submenu');
 
         await example.scrollIntoViewIfNeeded();
-        await example.locator('button').click();
         await documentationPagePO.prepareBeforeScreenshot();
+
+        await example.locator('button').click();
         await page.keyboard.down('ArrowDown');
         await page.keyboard.down('ArrowDown');
+
+        await expect(page).toHaveScreenshot('03-1-data-list.png');
+
         await page.waitForTimeout(100);
         await page.keyboard.down('Enter');
         await page.waitForTimeout(100);
 
-        await expect(page).toHaveScreenshot('03-1-data-list.png');
+        await expect(page).toHaveScreenshot('03-2-data-list.png');
 
         await page.keyboard.down('ArrowRight');
+
+        await expect(page).toHaveScreenshot('03-3-data-list.png');
+
         await page.keyboard.down('ArrowDown');
         await page.keyboard.down('ArrowDown');
         await page.keyboard.down('ArrowDown');
+
+        await expect(page).toHaveScreenshot('03-4-data-list.png');
+
         await page.waitForTimeout(100);
         await page.keyboard.down('Enter');
         await page.waitForTimeout(100);
 
-        await expect(page).toHaveScreenshot('03-2-data-list.png');
+        await expect(page).toHaveScreenshot('03-5-data-list.png');
 
         await page.keyboard.down('ArrowRight');
+
+        await expect(page).toHaveScreenshot('03-6-data-list.png');
+
         await page.keyboard.down('ArrowDown');
         await page.keyboard.down('ArrowDown');
 
-        await expect(page).toHaveScreenshot('03-3-data-list.png');
+        await expect(page).toHaveScreenshot('03-7-data-list.png');
 
         await page.waitForTimeout(100);
         await page.keyboard.down('Enter');
         await page.waitForTimeout(100);
 
-        await expect(page).toHaveScreenshot('03-4-data-list.png');
+        await expect(page).toHaveScreenshot('03-8-data-list.png');
     });
 
     test('Form control', async ({page}) => {

diff --git a/projects/kit/directives/data-list-dropdown-manager/data-list-dropdown-manager.directive.ts b/projects/kit/directives/data-list-dropdown-manager/data-list-dropdown-manager.directive.ts
@@ -163,8 +163,6 @@ export class TuiDataListDropdownManager implements AfterViewInit {
             root: content,
         });
 
-        if (item) {
-            item.focus();
-        }
+        item?.focus();
     }
 }