added typed-query-selector dev dependency in preparation to templates migration

README.md

@@ -272,6 +272,7 @@ Listed in `package.json`, installed with `npm ci`, not vendored.
 * `typescript-eslint`, for type-aware and type-checked linting.
 * `copyfiles`, to copy static assets to the `dist` directory so that they can be next to compiled JS for frontend.
 * `rimraf`, to cleanup `dist` directory before building.
+* `typed-query-selector`, because https://github.com/microsoft/TypeScript/issues/29037 is not addressed yet.
 
 #### Backend dependencies (runtime)
 

package-lock.json

@@ -27,6 +27,7 @@
         "prettier": "^3.3.3",
         "rimraf": "^6.0.1",
         "tap": "^21.0.1",
+        "typed-query-selector": "^2.12.0",
         "typescript": "^5.7.2",
         "typescript-eslint": "^8.16.0"
       }
@@ -6973,6 +6974,13 @@
         "node": ">= 0.6"
       }
     },
+    "node_modules/typed-query-selector": {
+      "version": "2.12.0",
+      "resolved": "https://registry.npmjs.org/typed-query-selector/-/typed-query-selector-2.12.0.tgz",
+      "integrity": "sha512-SbklCd1F0EiZOyPiW192rrHZzZ5sBijB6xM+cpmrwDqObvdtunOHHIk9fCGsoK5JVIYXoyEp4iEdE3upFH3PAg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/typescript": {
       "version": "5.7.2",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.7.2.tgz",

package.json

@@ -31,6 +31,7 @@
     "prettier": "^3.3.3",
     "rimraf": "^6.0.1",
     "tap": "^21.0.1",
+    "typed-query-selector": "^2.12.0",
     "typescript": "^5.7.2",
     "typescript-eslint": "^8.16.0"
   },

src/frontend/components/board-game.ts

@@ -1,3 +1,4 @@
+import type {} from "typed-query-selector/strict.d.ts";
 import { BoardgameState } from "../../shared/datatypes/boardgame-state.ts";
 import { getTargetGameState } from "../../shared/gameplay/boardgame.ts";
 import { CurrentOutcome } from "../../shared/datatypes/types.ts";
@@ -46,9 +47,7 @@ export class BoardGameComponent extends HTMLElement {
       this.classList.toggle(className, shouldEnable);
     }
 
-    this.querySelectorAll("tbody.game-board").forEach((tbodyUntyped) => {
+    this.querySelectorAll("tbody.game-board").forEach((tbody) => {
-      const tbody = tbodyUntyped as HTMLTableSectionElement;
-
       while (gameState.rows < tbody.rows.length) {
         tbody.rows[0]?.remove();
       }