From 71d459a2226652cc539d49870058b68e0a0f2848 Mon Sep 17 00:00:00 2001
From: Martin Schuhfuss <m.schuhfuss@gmail.com>
Date: Thu, 7 Dec 2023 11:57:51 +0100
Subject: [PATCH] fix: remap click to gmp-click to avoid error-messages

---
 src/__tests__/marker.test.ts | 50 ++++++++++++++++++++++++++++++++++++
 src/marker.ts                |  5 +++-
 2 files changed, 54 insertions(+), 1 deletion(-)

diff --git a/src/__tests__/marker.test.ts b/src/__tests__/marker.test.ts
index 81f29d4..e0557d5 100644
--- a/src/__tests__/marker.test.ts
+++ b/src/__tests__/marker.test.ts
@@ -314,6 +314,56 @@ describe('html attributes', () => {
   });
 });
 
+describe('events', () => {
+  const position = [10, 53] as [number, number];
+
+  let map: google.maps.Map;
+  let marker: Marker;
+  let markerElement: google.maps.marker.AdvancedMarkerElement;
+  let addListenerSpy: jest.SpyInstance;
+  let addDomListenerSpy: jest.SpyInstance;
+
+  beforeEach(async () => {
+    initialize();
+
+    map = new google.maps.Map(document.createElement('div'));
+    marker = new Marker({position, map});
+
+    markerElement = mockInstances.get(AdvancedMarkerElement).at(0)!;
+    // eslint-disable-next-line @typescript-eslint/unbound-method
+    addListenerSpy = markerElement.addListener as jest.MockedFunction<
+      typeof markerElement.addListener
+    >;
+    addDomListenerSpy = jest
+      .spyOn(markerElement.element, 'addEventListener')
+      .mockImplementation(() => {});
+  });
+
+  test('events are added to the marker instance', () => {
+    const fn = jest.fn();
+
+    marker.addListener('drag', fn);
+
+    expect(addListenerSpy).toHaveBeenCalledWith('drag', fn);
+  });
+
+  test('click event is rerouted to gmp-click', () => {
+    const fn = jest.fn();
+
+    marker.addListener('click', fn);
+
+    expect(addListenerSpy).toHaveBeenCalledWith('gmp-click', fn);
+  });
+
+  test('dom-events are forwarded to the html-element', () => {
+    const fn = jest.fn();
+    marker.addListener('touchstart', fn);
+    expect(addDomListenerSpy).toHaveBeenCalledWith('touchstart', fn);
+  });
+
+  test.todo('dom-events can be removed');
+});
+
 describe('dynamic attributes', () => {
   test.todo('dynamic attribute parameters');
   test.todo('marker state');
diff --git a/src/marker.ts b/src/marker.ts
index 3bfcb0d..4dfe469 100644
--- a/src/marker.ts
+++ b/src/marker.ts
@@ -271,7 +271,10 @@ export class Marker<TUserData = unknown> {
     handler: ((ev: google.maps.MapMouseEvent) => void) | ((ev: Event) => void)
   ): google.maps.MapsEventListener {
     if (eventName in MarkerEvents) {
-      return this.markerView_.addListener(eventName, handler);
+      return this.markerView_.addListener(
+        eventName === 'click' ? 'gmp-click' : eventName,
+        handler
+      );
     }
 
     const element = this.markerView_.element;