enable a bunch more linting (#1422)

* A few more cases of avoiding excessive @typescript-eslint/no-explicit-any per file

* reenable @typescript-eslint/no-unsafe-* and enable object-shorthand
ban "({})"

* config updates + use "!" over "as HTMLElement" where possible

* build fixes + remove unknown query param "internal_usage_attribution_ids"

* reenable noImplicitAny

* partially enable eslint TS strictTypeChecked

* partially enable stylisticTypeChecked

* formatting

* enable eqeqeq

* enable prefer-arrow-callback

* add some output to check-and-fix

* disable @typescript-eslint/no-non-null-assertion
this codebase uses non-null assertions a lot for document.querySelector() and similar patterns:

Author: chrisjshull

dist/samples/3d-label-toggle/app/index.ts

@@ -5,7 +5,7 @@
  */
 
 // [START maps_3d_label_toggle]
-let map;
+let map: google.maps.maps3d.Map3DElement;
 async function init() {
     const { Map3DElement } = await google.maps.importLibrary('maps3d');
 

e2e/samples.spec.ts

@@ -14,9 +14,11 @@
  * limitations under the License.
  */
 
+/* eslint-disable @typescript-eslint/no-unsafe-return */
+
 import { test, expect } from '@playwright/test';
-import fs from 'fs';
-import path from 'path';
+import fs from 'node:fs';
+import path from 'node:path';
 import childProcess, { execSync } from 'child_process';
 
 const samplesDir = path.join(__dirname, '..', 'samples');
@@ -203,7 +205,8 @@ foldersToTest.forEach((sampleFolder) => {
 
             // Wait for Google Maps to load.
             await page.waitForFunction(
-                () => window.google && window.google.maps,
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                () => (window as any).google?.maps,
                 { timeout: 500 }
             );
 
@@ -214,29 +217,31 @@ foldersToTest.forEach((sampleFolder) => {
             // The sample must load the Google Maps API.
             const hasGoogleMaps = await page.evaluate(() => {
                 return (
-                    typeof window.google !== 'undefined' &&
-                    typeof window.google.maps !== 'undefined'
+                    // 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'
                 );
             });
             expect(hasGoogleMaps).toBeTruthy();
 
             /** const mapElement = await page.locator('#map');
-      if (await page.locator('#map').isVisible()) {
-        console.log(`✅ Assertion passed: Map is visible.`);
-      } else {
-        console.error(`❌ Assertion failed: Map is not visible.`);
-        throw new Error('Assertion failed: Map is not visible.');
-      }*/
+             if (await page.locator('#map').isVisible()) {
+                console.log(`✅ Assertion passed: Map is visible.`);
+            } else {
+                console.error(`❌ Assertion failed: Map is not visible.`);
+                throw new Error('Assertion failed: Map is not visible.');
+            }*/
         } finally {
             // viteProcess.kill(); // We used to just kill the process. Curious to see about how the other stuff works.
             if (viteProcess.pid) {
                 try {
                     // Use process.kill for cross-platform compatibility, sending SIGINT
                     process.kill(viteProcess.pid, 'SIGINT');
-                } catch (e) {
+                } catch (error) {
                     console.warn(
                         `Failed to kill Vite process for ${sampleFolder} (PID: ${viteProcess.pid}):`,
-                        e.message
+                        error
                     );
                 }
             }

e2e/tsconfig.json

@@ -1,7 +1,10 @@
 {
   "extends": "../tsconfig.base.json",
   "compilerOptions": {
-    "rootDir": "."
+    "rootDir": ".",
+    "types": ["node"],
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext"
   },
   "include": ["./*.ts"]
 }

e2e/utils.ts

@@ -17,11 +17,15 @@
 // IMPORTANT: Keep this file, it contains things you may need. This file is not
 
 import { Page } from '@playwright/test';
+import process from 'node:process';
 
 // from https://github.com/lit/lit.dev/blob/5d79d1e0989e68f8b5905e5271229ffe4c55265c/packages/lit-dev-tests/src/playwright/util.ts
 
 export async function waitForGoogleMapsToLoad(page: Page) {
-    await page.waitForFunction(() => window.google && window.google.maps);
+    await page.waitForFunction(
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-return
+        () => (window as any).google?.maps
+    );
     await page.waitForTimeout(100);
 }
 

eslint.config.mjs

@@ -14,6 +14,9 @@ export default defineConfig([
         plugins: { js },
         extends: ['js/recommended'],
         languageOptions: { globals: { ...globals.browser, ...globals.node } },
+        linterOptions: {
+            reportUnusedDisableDirectives: 'error',
+        },
     },
     tseslint.configs.recommended,
     {
@@ -27,14 +30,18 @@ export default defineConfig([
             'prefer-const': 'error',
             'spaced-comment': ['error', 'always'],
             'no-shadow': 'error',
-
-            // temporarily downgraded to warn for historic reasons:
-            'no-prototype-builtins': 'warn',
+            'no-prototype-builtins': 'off', // samples show more vanilla patterns
+            'object-shorthand': ['error', 'always'],
+            eqeqeq: ['error', 'always', { null: 'ignore' }],
+            'prefer-arrow-callback': 'error',
         },
     },
     {
         files: ['**/*.ts', '**/*.tsx'],
-        extends: [...tseslint.configs.recommendedTypeChecked],
+        extends: [
+            ...tseslint.configs.strictTypeChecked,
+            ...tseslint.configs.stylisticTypeChecked,
+        ],
         languageOptions: {
             parserOptions: {
                 projectService: true,
@@ -58,12 +65,20 @@ export default defineConfig([
                 { allowDeclarations: true, allowDefinitionFiles: true },
             ],
 
-            // temporarily downgraded to warn for historic reasons:
+            // If something is already "any", then allow member access
             '@typescript-eslint/no-unsafe-member-access': 'warn',
-            '@typescript-eslint/no-unsafe-assignment': 'warn',
-            '@typescript-eslint/no-unsafe-call': 'warn',
-            '@typescript-eslint/no-unsafe-return': 'warn',
-            '@typescript-eslint/no-unsafe-argument': 'warn',
+
+            // this codebase uses non-null assertions a lot for document.querySelector() and similar patterns:
+            '@typescript-eslint/no-non-null-assertion': 'off',
+
+            // downgraded to warn for historic reasons:
+            '@typescript-eslint/restrict-template-expressions': 'warn',
+            '@typescript-eslint/restrict-plus-operands': 'warn',
+            '@typescript-eslint/prefer-nullish-coalescing': 'warn',
+
+            // buggy. breaks the code:
+            '@typescript-eslint/non-nullable-type-assertion-style': 'warn',
+            '@typescript-eslint/no-unnecessary-condition': 'warn',
         },
     },
     {

package-lock.json

@@ -6,7 +6,8 @@
     "build-all": "npm run clean && npm run build-all-parallel && npm run generate-index",
     "build-all-parallel": "bash samples/build-all.sh",
     "clean": "bash samples/clean.sh",
-    "generate-index": "bash samples/generate-index.sh"
+    "generate-index": "bash samples/generate-index.sh",
+    "check-and-fix": "echo eslint... && npx eslint --fix --quiet && echo prettier... && npx prettier -w --log-level warn . && echo tsc... && find ./ -name tsconfig.json -not -path '*/dist/*' -not -path '*/node_modules/*' -exec echo '{}' \\; -exec npx tsc --noEmit -p '{}' \\;"
   },
   "workspaces": [
     "samples/*"
@@ -19,7 +20,7 @@
     "@playwright/test": "^1.59.1",
     "@stylistic/eslint-plugin": "^5.10.0",
     "@types/google.maps": "^3.64.0",
-    "@types/node": "^25.6.0",
+    "@types/node": "^25.6.2",
     "eslint": "^10.3.0",
     "globals": "^17.6.0",
     "prettier": "^3.8.3",

package.json

@@ -1,3 +1,4 @@
+import process from 'node:process';
 import { defineConfig, devices } from '@playwright/test';
 
 /*

playwright.config.ts

@@ -21,13 +21,13 @@ async function initMap(): Promise<void> {
     const fovSlider = document.getElementById('fov') as HTMLInputElement;
     const rollSlider = document.getElementById('roll') as HTMLInputElement;
 
-    const headingVal = document.getElementById('heading-val') as HTMLElement;
-    const tiltVal = document.getElementById('tilt-val') as HTMLElement;
-    const rangeVal = document.getElementById('range-val') as HTMLElement;
-    const altitudeVal = document.getElementById('altitude-val') as HTMLElement;
-    const fovVal = document.getElementById('fov-val') as HTMLElement;
-    const rollVal = document.getElementById('roll-val') as HTMLElement;
-    const codeElem = document.getElementById('generated-code') as HTMLElement;
+    const headingVal = document.getElementById('heading-val')!;
+    const tiltVal = document.getElementById('tilt-val')!;
+    const rangeVal = document.getElementById('range-val')!;
+    const altitudeVal = document.getElementById('altitude-val')!;
+    const fovVal = document.getElementById('fov-val')!;
+    const rollVal = document.getElementById('roll-val')!;
+    const codeElem = document.getElementById('generated-code')!;
     const copyBtn = document.getElementById('copy-btn') as HTMLButtonElement;
 
     let currentAltitude = 30;
@@ -82,7 +82,7 @@ async function initMap(): Promise<void> {
     });
 
     // Listen to slider changes using event delegation.
-    const panel = document.querySelector('.panel') as HTMLElement;
+    const panel = document.querySelector('.panel')!;
 
     panel.addEventListener('input', (e) => {
         const target = e.target as HTMLInputElement;
@@ -121,7 +121,8 @@ async function initMap(): Promise<void> {
                 };
             }
         } else {
-            map3DElement[prop] = val;
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            (map3DElement as any)[prop] = val;
         }
         updateUI();
     });