From a0bc08a234fa181aab242eec5df0a2a5160684ac Mon Sep 17 00:00:00 2001
From: Tomi Virkki <virkki@vaadin.com>
Date: Wed, 11 Dec 2024 11:48:00 +0200
Subject: [PATCH] fix: always update focus index on click

---
 .../src/vaadin-virtual-list-selection-mixin.js  |  1 +
 .../test/virtual-list-selection.common.ts       | 17 +++++++++++++++++
 2 files changed, 18 insertions(+)

diff --git a/packages/virtual-list/src/vaadin-virtual-list-selection-mixin.js b/packages/virtual-list/src/vaadin-virtual-list-selection-mixin.js
index 496867cdf5..d57db16d7e 100644
--- a/packages/virtual-list/src/vaadin-virtual-list-selection-mixin.js
+++ b/packages/virtual-list/src/vaadin-virtual-list-selection-mixin.js
@@ -386,6 +386,7 @@ export const SelectionMixin = (superClass) =>
 
       const clickedRootElement = this.__getRootElementByContent(e.target);
       if (clickedRootElement) {
+        this.__updateFocusIndex(clickedRootElement.__index);
         this.__toggleSelection(clickedRootElement.__item);
       }
     }
diff --git a/packages/virtual-list/test/virtual-list-selection.common.ts b/packages/virtual-list/test/virtual-list-selection.common.ts
index da63b114b8..aa4a627fa8 100644
--- a/packages/virtual-list/test/virtual-list-selection.common.ts
+++ b/packages/virtual-list/test/virtual-list-selection.common.ts
@@ -191,6 +191,23 @@ describe('selection', () => {
       expect(rendererSpy.getCalls().filter((call) => call.args[2].index === 0).length).to.equal(1);
     });
 
+    it('should mark a previously focused element focused by clicking', async () => {
+      // Get a reference to the element representing the first item
+      const itemElement = getRenderedItem(0)!;
+      const firstItemElementTextContent = itemElement.textContent;
+      // Focus the first item by clicking
+      await click(itemElement);
+      // Scroll manually downwards
+      list.scrollTop = list.scrollHeight;
+      await nextFrame();
+      // Expect the same elemnt instance to now represent a different item due to virtualization
+      expect(itemElement.textContent).not.to.equal(firstItemElementTextContent);
+      // Click the same element again
+      await click(itemElement);
+      // Expect the element to be marked as focused
+      expect(itemElement.hasAttribute('focused')).to.be.true;
+    });
+
     it('should select an item with keyboard', async () => {
       expect(getRenderedItem(0)!.hasAttribute('selected')).to.be.false;
       beforeButton.focus();