feat: Updates instance of pac.element to pac for AC preview. (#1609)

Change-Id: I468a4c7fbd9dff40443c858b3d026d153441afc1
googlemaps · Nov 6, 2023 · 14928b2 · 14928b2
1 parent bb930f5
commit 14928b2
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 4 deletions.
diff --git a/samples/place-autocomplete-element/index.ts b/samples/place-autocomplete-element/index.ts
@@ -15,7 +15,8 @@ async function initMap(): Promise<void> {
     // Create the input HTML element, and append it.
     const input = document.createElement('input');
     const pac = new google.maps.places.PlaceAutocompleteElement({ inputElement: input });
-    document.body.appendChild(pac.element as HTMLElement);
+    //@ts-ignore
+    document.body.appendChild(pac);
     // [END maps_place_autocomplete_element_add]
 
     // Inject HTML UI.
@@ -29,7 +30,8 @@ async function initMap(): Promise<void> {
 
     // [START maps_place_autocomplete_element_listener]
     // Add the gmp-placeselect listener, and display the results.
-    pac.addListener('gmp-placeselect', async ({ place }) => {
+    //@ts-ignore
+    pac.addEventListener('gmp-placeselect', async ({ place }) => {
         await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location'] });
 
         selectedPlaceTitle.textContent = 'Selected Place:';

diff --git a/samples/place-autocomplete-map/index.ts b/samples/place-autocomplete-map/index.ts
@@ -31,7 +31,8 @@ async function initMap(): Promise<void> {
     const pac = new google.maps.places.PlaceAutocompleteElement({ inputElement: input });
 
     const card = document.getElementById('pac-card') as HTMLElement;
-    card.appendChild(pac.element as HTMLElement);
+    //@ts-ignore
+    card.appendChild(pac);
     map.controls[google.maps.ControlPosition.TOP_LEFT].push(card);
     // [END maps_place_autocomplete_map_add]
 
@@ -44,7 +45,8 @@ async function initMap(): Promise<void> {
 
     // [START maps_place_autocomplete_map_listener]
     // Add the gmp-placeselect listener, and display the results on the map.
-    pac.addListener('gmp-placeselect', async ({ place }) => {
+    //@ts-ignore
+    pac.addEventListener('gmp-placeselect', async ({ place }) => {
         await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location'] });
 
         // If the place has a geometry, then present it on a map.