From 0af819ee165258b24c98af7c2e1ab0dfe0b54826 Mon Sep 17 00:00:00 2001
From: Lokaesshwar <144367798+lokaesshwar@users.noreply.github.com>
Date: Fri, 14 Mar 2025 00:45:17 +0530
Subject: [PATCH] Resolved Duplicate IDs in overlay HTML

Fixed Overlay ID Issue

Ensured that overlay elements always have a unique ID.

If the element has an ID, it's used (overlay-wrapper-[elementID]).

If no ID exists, a random unique ID is generated (crypto.randomUUID()).

Added a class (openseadragon-overlay-wrapper) to all overlays for easier selection.
---
 src/overlay.js | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/overlay.js b/src/overlay.js
index 61f5fa88..f231e644 100644
--- a/src/overlay.js
+++ b/src/overlay.js
@@ -133,14 +133,18 @@
         this.elementWrapper.appendChild(this.element);
 
         if (this.element.id) {
-            this.elementWrapper.id = "overlay-wrapper-" + this.element.id;
+        this.elementWrapper.id = "overlay-wrapper-" + this.element.id;
         } else {
-            this.elementWrapper.id = "overlay-wrapper";
+        this.elementWrapper.id = "overlay-wrapper-" + crypto.randomUUID(); // Ensure unique ID
         }
 
+        // Always add a class for easier selection
+        this.elementWrapper.classList.add("openseadragon-overlay-wrapper");
+
+
         this.style = this.elementWrapper.style;
         this._init(options);
-    };
+        };
 
     /** @lends OpenSeadragon.Overlay.prototype */
     $.Overlay.prototype = {