fix: Fixes for eslint issues.

Author: willum070

e2e/samples.spec.ts

@@ -14,8 +14,6 @@
  * limitations under the License.
  */
 
-/* eslint-disable @typescript-eslint/no-unsafe-return */
-
 import { test, expect } from '@playwright/test';
 import fs from 'node:fs';
 import path from 'node:path';
@@ -138,7 +136,7 @@ foldersToTest.forEach((sampleFolder) => {
     test(`test ${sampleFolder}`, async ({ page }) => {
         // START run the preview
         // Get an available port
-        const port = 8080;
+        const port = '8080';
         const url = `http://localhost:${port}/`;
 
         const viteProcess = childProcess.spawn(
@@ -205,8 +203,9 @@ foldersToTest.forEach((sampleFolder) => {
 
             // Wait for Google Maps to load.
             await page.waitForFunction(
-                // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                () => (window as any).google?.maps,
+                () =>
+                    (window as typeof window & { google?: { maps?: unknown } })
+                        .google?.maps,
                 { timeout: 500 }
             );
 
@@ -216,12 +215,10 @@ foldersToTest.forEach((sampleFolder) => {
             // Assertions. These must be met or the test will fail.
             // The sample must load the Google Maps API.
             const hasGoogleMaps = await page.evaluate(() => {
-                return (
-                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                    typeof (window as any).google !== 'undefined' &&
-                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                    typeof (window as any).google.maps !== 'undefined'
-                );
+                const w = window as typeof window & {
+                    google?: { maps?: unknown };
+                };
+                return typeof w.google?.maps !== 'undefined';
             });
             expect(hasGoogleMaps).toBeTruthy();
 
@@ -240,7 +237,7 @@ foldersToTest.forEach((sampleFolder) => {
                     process.kill(viteProcess.pid, 'SIGINT');
                 } catch (error) {
                     console.warn(
-                        `Failed to kill Vite process for ${sampleFolder} (PID: ${viteProcess.pid}):`,
+                        `Failed to kill Vite process for ${sampleFolder} (PID: ${String(viteProcess.pid)}):`,
                         error
                     );
                 }

e2e/utils.ts

@@ -23,8 +23,9 @@ import process from 'node:process';
 
 export async function waitForGoogleMapsToLoad(page: Page) {
     await page.waitForFunction(
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-return
-        () => (window as any).google?.maps
+        () =>
+            (window as typeof window & { google?: { maps?: unknown } }).google
+                ?.maps
     );
     await page.waitForTimeout(100);
 }

eslint.config.mjs

@@ -72,7 +72,14 @@ export default defineConfig([
             '@typescript-eslint/no-non-null-assertion': 'off',
 
             // downgraded to warn for historic reasons:
-            '@typescript-eslint/restrict-template-expressions': 'warn',
+            '@typescript-eslint/restrict-template-expressions': [
+                'warn',
+                {
+                    allowNumber: true,
+                    allowNullish: true,
+                    allowBoolean: true,
+                },
+            ],
             '@typescript-eslint/restrict-plus-operands': 'warn',
             '@typescript-eslint/prefer-nullish-coalescing': 'warn',
 

samples/3d-accessibility-features/index.ts

@@ -51,7 +51,7 @@ async function init() {
 
     tourStops.forEach(({ position, title }, i) => {
         const pin = new PinElement({
-            glyphText: `${i + 1}`,
+            glyphText: String(i + 1),
             scale: 1.5,
             glyphColor: '#FFFFFF',
         });

samples/3d-camera-position/index.ts

@@ -43,7 +43,6 @@ async function initMap(): Promise<void> {
         const fov = fovClamped.toString();
         const roll = map3DElement.roll?.toFixed(0) ?? '0';
         const center = map3DElement.center;
-        const mode = map3DElement.mode;
 
         headingVal.textContent = heading;
         tiltVal.textContent = tilt;
@@ -68,7 +67,7 @@ async function initMap(): Promise<void> {
             lngSlider.value = lng;
             altitudeVal.textContent = alt;
 
-            codeElem.textContent = `<gmp-map-3d center="${lat},${lng},${alt}" mode="${mode}" tilt="${tilt}" range="${range}" heading="${heading}" fov="${fov}" roll="${roll}"></gmp-map-3d>`;
+            codeElem.textContent = `<gmp-map-3d center="${lat},${lng},${alt}" tilt="${tilt}" range="${range}" heading="${heading}" fov="${fov}" roll="${roll}"></gmp-map-3d>`;
         }
     };
 
@@ -124,8 +123,14 @@ async function initMap(): Promise<void> {
             map3DElement.tilt = Math.max(0, val);
         } else if (prop === 'fov') {
             map3DElement.fov = Math.min(80, Math.max(5, val));
+        } else if (prop === 'heading') {
+            map3DElement.heading = val;
+        } else if (prop === 'range') {
+            map3DElement.range = val;
+        } else if (prop === 'roll') {
+            map3DElement.roll = val;
         } else {
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-member-access
             (map3DElement as any)[prop] = val;
         }
         updateUI();

samples/3d-clamp-mode/index.ts

@@ -5,7 +5,7 @@
  */
 
 // [START maps_3d_clamp_mode]
-let polyline: google.maps.maps3d.Polyline3DElement;
+let polyline: google.maps.maps3d.Polyline3DElement | undefined;
 
 async function init() {
     const { Map3DElement, Polyline3DElement } =

samples/3d-coverage-map/index.ts

@@ -40,7 +40,6 @@ async function init() {
     placeAutocomplete.addEventListener(
         'gmp-select',
         async ({ placePrediction }) => {
-            if (!placePrediction) return;
             const place = placePrediction.toPlace();
             await place.fetchFields({
                 fields: ['location'],

samples/3d-map-events/index.ts

@@ -15,7 +15,7 @@ async function init() {
         (i) => i.textContent
     );
     for (const event of events) {
-        mapElement?.addEventListener(event, () => {
+        mapElement.addEventListener(event, () => {
             const eventElement = document.querySelector(`#${event}`);
             eventElement?.classList.add('active');
             setTimeout(() => {

samples/3d-places-autocomplete/index.ts

@@ -4,7 +4,6 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-/* eslint-disable @typescript-eslint/no-unsafe-assignment */
 /* eslint-disable @typescript-eslint/no-unsafe-call */
 
 // [START maps_3d_places_autocomplete]
@@ -33,7 +32,7 @@ async function initAutocomplete() {
     const { PlaceAutocompleteElement } =
         await google.maps.importLibrary('places');
 
-    const placeAutocomplete = new PlaceAutocompleteElement();
+    const placeAutocomplete = new PlaceAutocompleteElement() as google.maps.places.PlaceAutocompleteElement;
     placeAutocomplete.id = 'place-autocomplete-input';
     const card = document.getElementById('pac-container')!;
     card.appendChild(placeAutocomplete);
@@ -49,7 +48,9 @@ async function initAutocomplete() {
             });
             // If the place has a geometry, then present it on a map.
             if (!place.location) {
-                window.alert('No viewport for input: ' + place.displayName);
+                window.alert(
+                    `No viewport for input: ${place.displayName}`
+                );
                 return;
             }
             void flyToPlace(place);
@@ -107,7 +108,7 @@ async function getElevationforPoint(
         locations: [location],
     });
 
-    if (!elevationResponse?.results.length) {
+    if (!elevationResponse.results.length) {
         window.alert(
             `Insufficient elevation data for place: ${place.displayName}`
         );

samples/3d-places/index.ts

@@ -29,9 +29,9 @@ async function init() {
 
         // Display place details.
         document.getElementById('placeName')!.innerHTML =
-            '<b>Name :</b><br>&nbsp;' + place.displayName;
+            `<b>Name :</b><br>&nbsp;${place.displayName ?? ''}`;
         document.getElementById('placeId')!.innerHTML =
-            '<b>Id :</b><br>&nbsp;' + place.id;
+            `<b>Id :</b><br>&nbsp;${place.id}`;
         document.getElementById('placeType')!.innerHTML = '<b>Types :<b/>';
 
         for (const type of place.types ?? []) {