Merge pull request #27905 from overleaf/mj-pug-frontend-helpers-ts

[web] Convert pug frontend helpers to typescript

GitOrigin-RevId: e74527306ded6bc7db992cd8ceaff34d0d26b1b7

services/web/frontend/js/features/fallback-image/index.js

@@ -1,16 +0,0 @@
-function loadingFailed(imgEl) {
-  return imgEl.complete && imgEl.naturalWidth === 0
-}
-
-document.querySelectorAll('[data-ol-fallback-image]').forEach(imgEl => {
-  function showFallback() {
-    imgEl.src = imgEl.getAttribute('data-ol-fallback-image')
-  }
-  if (loadingFailed(imgEl)) {
-    // The image loading failed before the sprinkle ran.
-    showFallback()
-  } else {
-    // The image loading might fail in the future.
-    imgEl.addEventListener('error', showFallback)
-  }
-})

services/web/frontend/js/features/fallback-image/index.ts

@@ -0,0 +1,21 @@
+function loadingFailed(imgEl: HTMLImageElement) {
+  return imgEl.complete && imgEl.naturalWidth === 0
+}
+
+document.querySelectorAll('[data-ol-fallback-image]').forEach(element => {
+  if (!(element instanceof HTMLImageElement)) {
+    // The sprinkle only applies to image elements.
+    return
+  }
+  const imgEl = element as HTMLImageElement
+  function showFallback() {
+    imgEl.src = imgEl.getAttribute('data-ol-fallback-image')!
+  }
+  if (loadingFailed(imgEl)) {
+    // The image loading failed before the sprinkle ran.
+    showFallback()
+  } else {
+    // The image loading might fail in the future.
+    imgEl.addEventListener('error', showFallback)
+  }
+})

services/web/frontend/js/features/link-helpers/slow-link.ts

@@ -1,7 +1,7 @@
 import { inflightHelper } from '../form-helpers/hydrate-form'
 import { disableElement } from '../utils/disableElement'
 
-function setup(el) {
+function setup(el: Element) {
   // Make the element discoverable for multi-submit.
   el.setAttribute('data-ol-disabled-inflight', '')