Try to always wait until the image is rendered

portal/static/js/gitlab.mjs

@@ -58,6 +58,27 @@ function toIsoString(year, month, day) {
     return `${year.toString().padStart(4, "0")}-${month.toString().padStart(2, "0")}-${day.toString().padStart(2, "0")}`
 }
 
+/**
+ * Wait until the image is rendered, i.e. until its width or height are different from 0
+ */
+async function waitUntilRendered(img) {
+    function isRendered(img) {
+        return img.width != 0 || img.height != 0
+    }
+
+    if (isRendered(img)) return // that was easy
+
+    await new Promise((resolve, _) => {
+        const observer = new MutationObserver((_, observer) => {
+            if (isRendered(img)) {
+                observer.disconnect()
+                resolve()
+            }
+        })
+        observer.observe(img, { attributes: true })
+    })
+}
+
 /**
  * Return an object with metadata about the latest protocol, or null, if the metadata cannot be accessed
  * (e.g., because the user is not logged in to GitLab, is logged in but has no access to the repo, or an error occurred in the pipeline).
@@ -83,6 +104,8 @@ export async function getLatestProtocolMetadata() {
         return null
     }
 
+    await waitUntilRendered(img)
+
     const year = img.width
     const month = Math.floor(img.height / 100)
     const dayAndMaybeOffset = img.height - 100 * month