From d266bb92bd49ad97c67589b9e911cade2e03efe8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A2u=20Cao?= <raucao@kosmos.org>
Date: Fri, 5 Jun 2026 18:33:08 +0400
Subject: [PATCH] Use data attribute to determine current gallery photo in test

---
 app/components/photo-gallery.gjs              |  5 +++-
 .../components/photo-gallery-test.gjs         | 23 ++++++++-----------
 2 files changed, 13 insertions(+), 15 deletions(-)

diff --git a/app/components/photo-gallery.gjs b/app/components/photo-gallery.gjs
index dc9ecbe..43a6fe9 100644
--- a/app/components/photo-gallery.gjs
+++ b/app/components/photo-gallery.gjs
@@ -21,7 +21,10 @@ const GalleryContent = <template>
     {{@bindKeyboard @handleKeydown}}
   >
     {{! template-lint-disable no-invalid-interactive }}
-    <div class="photo-gallery-content">
+    <div
+      class="photo-gallery-content"
+      data-current-event-id={{@currentPhoto.eventId}}
+    >
       <div class="actions-btn-container">
         <DropdownMenu
           @iconSize={{24}}
diff --git a/tests/integration/components/photo-gallery-test.gjs b/tests/integration/components/photo-gallery-test.gjs
index 1d540e9..95abd26 100644
--- a/tests/integration/components/photo-gallery-test.gjs
+++ b/tests/integration/components/photo-gallery-test.gjs
@@ -287,35 +287,30 @@ module('Integration | Component | photo-gallery', function (hooks) {
       </template>
     );
 
-    // Let carousel settle
-    await new Promise((resolve) => setTimeout(resolve, 150));
+    assert
+      .dom('.photo-gallery-content')
+      .hasAttribute('data-current-event-id', 'event1');
 
     // Right Arrow
     await triggerKeyEvent(document, 'keydown', 'ArrowRight');
-    await new Promise((resolve) => setTimeout(resolve, 150));
 
-    // Let's just assert that currentPhoto was updated internally, which trickles down.
-    // The actual DOM update for the main image might be tricky if the carousel relies on scroll events.
-    // We can at least check if the thumbnail selection changed, as that is directly driven by currentPhoto
     assert
-      .dom('.thumbnail-strip-container .carousel-slide.active img')
-      .hasAttribute('data-src', 'photo2.jpg');
+      .dom('.photo-gallery-content')
+      .hasAttribute('data-current-event-id', 'event2');
 
     // Right Arrow again
     await triggerKeyEvent(document, 'keydown', 'ArrowRight');
-    await new Promise((resolve) => setTimeout(resolve, 150));
 
     assert
-      .dom('.thumbnail-strip-container .carousel-slide.active img')
-      .hasAttribute('data-src', 'photo3.jpg');
+      .dom('.photo-gallery-content')
+      .hasAttribute('data-current-event-id', 'event3');
 
     // Left Arrow
     await triggerKeyEvent(document, 'keydown', 'ArrowLeft');
-    await new Promise((resolve) => setTimeout(resolve, 150));
 
     assert
-      .dom('.thumbnail-strip-container .carousel-slide.active img')
-      .hasAttribute('data-src', 'photo2.jpg');
+      .dom('.photo-gallery-content')
+      .hasAttribute('data-current-event-id', 'event2');
   });
 
   test('escape key closes gallery', async function (assert) {