feat(marker.ts): only add aria-label if the custom element does not a…

…lready has one

CHANGELOG.md

@@ -1,6 +1,9 @@
 ## main
 
 ### ✨ Features and improvements
+
+- Now only adds `aria-label` on the Marker's element if it does not already has one ([#5298](https://github.com/maplibre/maplibre-gl-js/pull/5298))
+
 - _...Add new stuff here..._
 
 ### 🐞 Bug fixes

src/ui/marker.test.ts

@@ -260,6 +260,18 @@ describe('marker', () => {
         expect(marker.getElement().getAttribute('aria-label')).toBe('alt title');
     });
 
+    test('Marker aria-label is not set if the element already has one', () => {
+        const map = createMap({locale: {'Marker.Title': 'alt title'}});
+        const customHtmlElement = document.createElement('div');
+        customHtmlElement.setAttribute('aria-label', 'custom aria label');
+
+        const markerWithHtmlElement = new Marker({
+            element: customHtmlElement
+        }).setLngLat([10, 10]).addTo(map);
+
+        expect(markerWithHtmlElement.getElement().getAttribute('aria-label')).toBe('custom aria label');
+    });
+
     test('Marker anchor defaults to center', () => {
         const map = createMap();
         const marker = new Marker()

src/ui/marker.ts

@@ -316,7 +316,10 @@ export class Marker extends Evented {
     addTo(map: Map): this {
         this.remove();
         this._map = map;
-        this._element.setAttribute('aria-label', map._getUIString('Marker.Title'));
+
+        if (!this._element.hasAttribute('aria-label')) {
+            this._element.setAttribute('aria-label', map._getUIString('Marker.Title'));
+        }
 
         map.getCanvasContainer().appendChild(this._element);
         map.on('move', this._update);