Skip to content

refactor: migrate AdvancedMarkerElement to native DOM events - #1653

Open
willum070 wants to merge 2 commits into
mainfrom
update-to-gmp-drag
Open

refactor: migrate AdvancedMarkerElement to native DOM events#1653
willum070 wants to merge 2 commits into
mainfrom
update-to-gmp-drag

Conversation

@willum070

Copy link
Copy Markdown
Collaborator

Description

As the Maps JavaScript API increasingly adopts Web Components, it's recommended to use native DOM events over the legacy google.maps.event wrapper for elements like AdvancedMarkerElement. This PR updates our samples to align with these modern best practices.

Key Changes

  • Native Event Listeners: Replaced all instances of the legacy addListener() method with native addEventListener() across all AdvancedMarkerElements in the repository.
  • Click Events: Standardized legacy click event bindings to use the native gmp-click DOM event.
  • Drag Events: Migrated the dragend event in advanced-markers-draggable and polyline-utility to use the native gmp-dragend DOM event.
  • Cleanup Logic Modernization: Removed the legacy event.clearInstanceListeners() cleanup call in polyline-utility. Because the markers are native DOM nodes that get cleanly discarded (spliced from state and map = null), any attached native gmp- event listeners are naturally garbage collected, rendering explicit cleanup unnecessary.
  • Linter Fixes: Removed now-unused event imports from the google.maps.importLibrary('core') destructuring assignments.

Affected Samples (11 total)

  • advanced-markers-draggable
  • advanced-markers-html
  • ai-powered-summaries-basic
  • event-closure
  • place-nearby-search
  • place-text-search
  • polyline-utility
  • ui-kit-advanced-place-search-nearby
  • ui-kit-advanced-place-search-text
  • ui-kit-place-search-nearby
  • ui-kit-place-search-text

Testing

  • Verified successful TypeScript compilation without lint errors (npm start tested successfully).
  • Searched the entire codebase to ensure no rogue addListener('click') bindings remain on any Marker elements.

Change-Id: I8977020fc4d94e5edced2a1e17308b19a9cefd5e

…ative DOM events

Change-Id: I8977020fc4d94e5edced2a1e17308b19a9cefd5e
@willum070
willum070 requested a review from jeantimex August 31, 2026 18:26
Comment thread samples/polyline-utility/index.ts
Comment thread samples/polyline-utility/index.ts
@willum070
willum070 requested a review from jeantimex September 1, 2026 14:45
Change-Id: I2cd3b4946fda3ade0a7e05ae1ba0e2a17daecd76
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants