@govtechsg/oobee 0.10.92 → 0.10.94

package/dist/static/ejs/partials/scripts/ruleModal/pageAccordionBuilder.ejs

@@ -451,7 +451,7 @@
             <div id="${accordionId}-content" class="accordion-collapse collapse" aria-labelledby="${accordionId}-title">
               <div class="accordion-body p-3">
                 ${isCustomFlow
-                  ? createCustomFlowContent(page)
+                  ? createCustomFlowContent(page, ruleInCategory)
                   :
                   `<div class="d-flex align-items-center gap-1 accordion-link" style="    word-wrap: break-word; word-break: break-word;">
                     <a href="${page.url}" target="_blank">${page.url}
@@ -486,16 +486,46 @@
     return accordion;
   }
 
-  function createCustomFlowContent(page) {
+  function getCustomFlowPageScreenshot(page, ruleInCategory) {
+    if (page && page.pageImagePath) return page.pageImagePath;
+
+    // Use same source-of-truth as scanAboutModal.
+    const scannedPages =
+      typeof scanData !== 'undefined' &&
+      scanData &&
+      Array.isArray(scanData.pagesScanned)
+        ? scanData.pagesScanned
+        : [];
+
+    if (page) {
+      const matchByUrl = scannedPages.find((p) => p && p.url === page.url && p.pageImagePath);
+      if (matchByUrl) return matchByUrl.pageImagePath;
+
+      const matchByTitle = scannedPages.find(
+        (p) => p && p.pageTitle === page.pageTitle && p.pageImagePath,
+      );
+      if (matchByTitle) return matchByTitle.pageImagePath;
+    }
+
+    return '';
+  }
+
+  function createCustomFlowContent(page, ruleInCategory) {
+    const pageScreenshot = getCustomFlowPageScreenshot(page, ruleInCategory);
+
     return `
       <div class="custom-flow-screenshot-container">
           <div class="custom-flow-thumb">
-            <img
-              src="${page.pageImagePath}"
-              alt="Screenshot of ${page.url}"
-              class="custom-flow-screenshot"
-              onerror="this.onerror = null; this.remove();"
-            >
+            ${
+              pageScreenshot
+                ? `<img
+                    src="${pageScreenshot}"
+                    alt="Screenshot of ${page.url}"
+                    class="custom-flow-screenshot"
+                    onerror="this.onerror = null; this.remove();"
+                  >`
+                : ''
+            }
           </div>
           <div class="display-url-container">
             <div><a href="${page.url}" target="_blank">${page.url}</a></div>
@@ -538,6 +568,7 @@
 
   function setupCustomFlowScreenshot(accordion, page) {
     const customScreenshotElem = accordion.getElementsByClassName('custom-flow-screenshot')[0];
+    if (!customScreenshotElem) return;
 
     customScreenshotElem.onerror = function(event) {
       this.onerror = null;

package/dist/static/ejs/partials/scripts/scannedPagesSegmentedTabs.ejs

@@ -1,21 +1,27 @@
 <script>
   document.addEventListener('click', function (e) {
-    const btn = e.target.closest('.seg-pill');
+    const btn = e.target.closest('.seg-pill[role="tab"]');
     if (!btn) return;
 
-    const container = btn.closest('.segmented-tabs');
+    const container = btn.closest('.segmented-tabs[role="tablist"]');
+    if (!container) return;
+
     const targetSel = btn.getAttribute('data-tab-target');
     const panel = document.querySelector(targetSel);
     if (!panel) return;
 
-    container.querySelectorAll('.seg-pill').forEach((p) =>
-      p.setAttribute('aria-selected', 'false')
-    );
+    container.querySelectorAll('.seg-pill[role="tab"]').forEach((p) => {
+      p.setAttribute('aria-selected', 'false');
+      p.setAttribute('tabindex', '-1');
+    });
+
     btn.setAttribute('aria-selected', 'true');
+    btn.setAttribute('tabindex', '0');
 
     document
       .querySelectorAll('.seg-panels > [role="tabpanel"]')
       .forEach((p) => (p.hidden = true));
+
     panel.hidden = false;
   });
 

package/dist/static/ejs/partials/scripts/screenshotLightbox.ejs

@@ -6,18 +6,32 @@
   const lightboxContent = document.getElementsByClassName('lightbox-content')[0];
   const lightboxImg = document.getElementById('lightbox-image');
 
-  var customFlowScreenshots = document.getElementsByClassName('custom-flow-screenshot');
-  Array.from(customFlowScreenshots).forEach(screenshot => {
-    screenshot.onerror = function (event) {
-      screenshot.onerror = null;
-      screenshot.remove();
-    };
-    screenshot.onclick = event => {
-      event.preventDefault();
-      const pageTitle = screenshot.parentNode.getElementsByTagName('a')[0].textContent;
-      const pageUrl = screenshot.parentNode.getElementsByTagName('a')[0].href;
-      openLightbox(screenshot.src, pageTitle, pageUrl);
-    };
+  // Handle dynamically inserted custom-flow screenshots (about scan modal content is rendered later)
+  document.addEventListener(
+    'error',
+    event => {
+      const target = event.target;
+      if (target && target.classList && target.classList.contains('custom-flow-screenshot')) {
+        target.onerror = null;
+        target.remove();
+      }
+    },
+    true,
+  );
+
+  document.addEventListener('click', event => {
+    const screenshot = event.target.closest('.custom-flow-screenshot');
+    if (!screenshot) return;
+
+    event.preventDefault();
+
+    const container = screenshot.closest('.custom-flow-screenshot-container');
+    const link = container ? container.querySelector('.display-url-container a') : null;
+
+    const pageTitle = link?.textContent?.trim() || screenshot.getAttribute('alt') || 'Screenshot';
+    const pageUrl = link?.href || '';
+
+    openLightbox(screenshot.src, pageTitle, pageUrl);
   });
 
   lightbox.addEventListener('click', event => {
@@ -31,8 +45,9 @@
   });
 
   const offcanvasElem = document.getElementsByClassName('offcanvas')[0];
+  let offcanvasItem = null;
   if (offcanvasElem) {
-    const offcanvasItem = new bootstrap.Offcanvas(offcanvasElem);
+    offcanvasItem = new bootstrap.Offcanvas(offcanvasElem);
     offcanvasItem._config.keyboard = false; // Disable default keyboard handling
   }
 
@@ -43,27 +58,30 @@
     pagesScannedModalItem._config.keyboard = false;
   }
 
-  document.addEventListener('keydown', event => {
-    if (event.key === 'Escape') {
-      if (offcanvasItem._isShown) {
-        if (lightbox.style.display === 'block') {
-          event.preventDefault(); // Prevent default bootstrap behaviour
-          closeLightbox();
-        } else {
-          offcanvasItem.hide();
-        }
+  // Use capture phase so lightbox handles Escape before Bootstrap modal/offcanvas handlers.
+  document.addEventListener(
+    'keydown',
+    event => {
+      if (event.key !== 'Escape') return;
+
+      if (lightbox.style.display === 'block') {
+        event.preventDefault();
+        event.stopPropagation();
+        event.stopImmediatePropagation();
+        closeLightbox();
+        return;
       }
 
-      if (pagesScannedModalItem._isShown) {
-        if (lightbox.style.display === 'block') {
-          event.preventDefault(); // Prevent default bootstrap behaviour
-          closeLightbox();
-        } else {
-          pagesScannedModalItem.hide();
-        }
+      if (offcanvasItem && offcanvasItem._isShown) {
+        offcanvasItem.hide();
       }
-    }
-  });
+
+      if (pagesScannedModalItem && pagesScannedModalItem._isShown) {
+        pagesScannedModalItem.hide();
+      }
+    },
+    true,
+  );
 
   function openLightbox(imgSrc, pageTitle, pageUrl) {
     lightbox.style.display = 'block';

package/dist/static/ejs/partials/styles/header/SiteInfo.ejs

@@ -112,7 +112,7 @@
 
   .link {
     color: var(--a11y-majorelle-blue);
-    text-decoration: none;
+    text-decoration: underline;
   }
 
   .link:hover {

package/dist/static/ejs/partials/styles/header/aboutScanModal/ScanDetails.ejs

@@ -3,12 +3,16 @@
     word-break: break-word;
   }
 
-  #scan-about > ul > li:first-child {
-    padding-top: 0.5rem;
+  #aboutScanModalLabel {
+    margin-bottom: 1rem;
   }
 
-  #scan-about ul {
+  #scan-about > ul {
     padding-left: 0;
+    padding-top: 0;
+    padding-bottom: 1rem;
+    margin-top: 0;
+    margin-bottom: 0;
   }
 
   #scan-about li {
@@ -38,21 +42,28 @@
     margin-bottom: 0.3rem;
   }
 
-  .advanced-group {
-    display: flex;
-    align-items: center;
-    margin-bottom: 0 !important;
+  #scan-about li.advanced-group {
+    align-items: flex-start;
+    margin-bottom: 0;
+  }
+
+  #scan-about li.advanced-group > .advanced-group-content {
+    min-width: 0;
+    flex: 1;
   }
 
-  .advanced-group + .advanced-sublist,
-  .advanced-group + ul {
-    list-style: disc !important;
-    margin-left: 3.125rem;
+  #scan-about li.advanced-group > .advanced-group-content > ul.advanced-sublist {
+    list-style: disc;
+    list-style-position: outside;
+    margin-left: 8px;
+    margin-top: 0.5rem;
+    padding-left: 12px;
+    text-indent: -2px;
   }
 
-  .advanced-group + .advanced-sublist li,
-  .advanced-group + ul li {
+  #scan-about li.advanced-group > .advanced-group-content > ul.advanced-sublist li {
     margin: 0;
+    list-style-position: outside !important;
   }
 
   .advanced-sublist-li {
@@ -85,10 +96,14 @@
 
   .about-scan-toggle .about-us-type-of-scan-text {
     color: var(--a11y-majorelle-blue) !important;
-    display: inline !important;
-    text-decoration: none;
+    display: inline;
+    text-decoration: underline;
     cursor: pointer;
   }
+
+  #pagesScannedModalToggleTxt {
+    color: var(--a11y-majorelle-blue) !important;
+  }
   .about-scan-toggle:hover .about-us-type-of-scan-text,
   .about-scan-toggle .about-us-type-of-scan-text:focus-visible {
     text-decoration: underline;
@@ -112,9 +127,14 @@
     line-height: 1.2;
   }
 
+  .about-scan-divider-item {
+    display: block !important;
+    margin-bottom: 2rem !important;
+  }
+
   .about-scan-link-text {
     color: var(--a11y-majorelle-blue);
-    text-decoration: none;
+    text-decoration: underline;
     cursor: pointer;
   }
 

package/dist/static/ejs/partials/styles/prioritiseIssues/PrioritiseIssues.ejs

@@ -120,15 +120,36 @@
 
   .priority-issue-item {
     padding: 0.75rem;
-    cursor: pointer;
     position: relative;
     padding-left: 1.5rem;
+    display: flex;
+    align-items: flex-start;
+  }
+
+  .priority-issue-action {
+    appearance: none;
+    border: 0;
+    background: transparent;
+    width: 100%;
+    padding: 0;
+    margin: 0;
+    display: flex;
+    text-align: left;
+    cursor: pointer;
+    color: inherit;
+    line-height: 1.5;
+  }
+
+  .priority-issue-action > .w-90 {
+    width: 100% !important;
   }
 
   .priority-issue-item::before {
     counter-increment: issue-counter;
     content: counter(issue-counter) '.';
     line-height: 1.5;
+    margin-right: 0.5rem;
+    flex-shrink: 0;
   }
 
   .priority-issue-item:hover:not(.active) {

package/dist/static/ejs/partials/styles/styles.ejs

@@ -98,7 +98,7 @@
 
   a {
     color: var(--a11y-majorelle-blue);
-    text-decoration: none;
+    text-decoration: underline;
   }
 
   a:hover {

package/dist/static/ejs/partials/styles/wcagCompliance/WcagGaugeBar.ejs

@@ -39,6 +39,11 @@
   .gauge-number {
     font-weight: 700;
     font-size: 16px;
+    color: var(--dark-charcoal, #1f1f1f);
+    background-color: var(--true-white, #fff);
+    display: inline-block;
+    padding: 2px 8px;
+    border-radius: 999px;
   }
 
   .gauge-caption {
@@ -54,6 +59,7 @@
 
   .gauge-value-number {
     font-size: 24px;
+    color: var(--dark-charcoal, #1f1f1f);
   }
 
   .gauge-value-number.perfect-score {

package/dist/static/ejs/partials/styles/wcagCompliance.ejs

@@ -18,10 +18,11 @@
 		margin-bottom: 0rem;
 	}
 
-	.wcag-link {
-		font-size: 1rem;
-		border: 0;
-	}
+.wcag-link {
+font-size: 1rem;
+border: 0;
+text-decoration: underline;
+}
 
 	.wcag-status {
 		margin-bottom: 0.3rem;

package/dist/static/ejs/partials/styles/wcagCoverageDetails.ejs

@@ -12,9 +12,14 @@
     gap: 10px 18px;
   }
 
+  #wcagCoverage .wcag-criteria-heading {
+    font-size: 1.25rem;
+    line-height: 1.2;
+  }
+
   #wcagCoverage .wcag-grid a {
     color: var(--a11y-majorelle-blue, #5735DF);
-    text-decoration: none;
+    text-decoration: underline;
   }
   #wcagCoverage .wcag-grid a:hover,
   #wcagCoverage .wcag-grid a:focus-visible {

package/oobee-client-scanner.js

@@ -3,9 +3,9 @@
  * DO NOT EDIT MANUALLY. Re-generate with: node dist/generateOobeeClientScanner.js
  *
  * Embedded at generation time:
- *   App version : 0.10.92
+ *   App version : 0.10.94
  *   Sentry DSN  : (from OOBEE_SENTRY_DSN env var or constants.ts default)
- *   Sentry SDK  : @sentry/browser 9.47.1 (loaded from CDN at runtime)
+ *   Sentry SDK  : @sentry/browser 10.58.0 (loaded from CDN at runtime)
  *
  * Usage:
  *   <script src="oobee-client-scanner.js"></script>
@@ -34883,8 +34883,8 @@
   // ── Sentry browser telemetry (Sentry JS SDK, loaded from CDN) ────────────
   
   var _oobeeSentryDsn          = "https://3b8c7ee46b06f33815a1301b6713ebc3@o4509047624761344.ingest.us.sentry.io/4509327783559168";
-  var _oobeeAppVersion         = "0.10.92";
-  var _oobeeSentryVersion      = "9.47.1";
+  var _oobeeAppVersion         = "0.10.94";
+  var _oobeeSentryVersion      = "10.58.0";
   var _oobeeSentryInitialized  = false;
   var _oobeeSentryLoadPromise  = null;
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@govtechsg/oobee",
   "main": "dist/npmIndex.js",
-  "version": "0.10.92",
+  "version": "0.10.94",
   "type": "module",
   "author": "Government Technology Agency <info@tech.gov.sg>",
   "bin": {
@@ -11,7 +11,7 @@
     "@aws-sdk/client-s3": "^3.1049.0",
     "@json2csv/node": "^7.0.3",
     "@napi-rs/canvas": "^0.1.53",
-    "@sentry/node": "^9.13.0",
+    "@sentry/node": "^10.58.0",
     "@types/aws-sdk": "^0.0.42",
     "axe-core": "^4.11.4",
     "axios": "^1.8.2",

package/src/cli.ts

@@ -264,9 +264,10 @@ const scanInit = async (argvs: Answers): Promise<string> => {
     consoleLogger.info(`Connectivity Check HTTP Response Code: ${res.httpStatus}`);
 
   if (res.status === statuses.success.code) {
-    // Custom flow should continue from the user-provided entry URL so auth redirects
-    // do not replace the original domain used for overlay gating and navigation.
+    // Keep browser-resolved URL as entryUrl for downstream scan metadata/events
+    // on non-custom scans.
     if (data.type !== ScannerTypes.CUSTOM) {
+      data.entryUrl = res.url;
       data.url = res.url;
     }
     if (process.env.OOBEE_VALIDATE_URL) {

package/src/combine.ts

@@ -45,6 +45,7 @@ const combineRun = async (details: Data, deviceToScan: string) => {
   const {
     type,
     url,
+    entryUrl,
     nameEmail,
     randomToken,
     deviceChosen,
@@ -104,8 +105,8 @@ const combineRun = async (details: Data, deviceToScan: string) => {
 
   // remove basic-auth credentials from URL
   const finalUrl = !(type === ScannerTypes.SITEMAP || type === ScannerTypes.LOCALFILE)
-    ? new URL(url)
-    : new URL(pathToFileURL(url));
+    ? new URL(entryUrl)
+    : new URL(pathToFileURL(entryUrl));
 
   // Use the string version of finalUrl to reduce logic at submitForm
   const finalUrlString = finalUrl.toString();
@@ -154,6 +155,7 @@ const combineRun = async (details: Data, deviceToScan: string) => {
         blacklistedPatterns,
         includeScreenshots,
         customFlowLabel && customFlowLabel !== 'None' ? customFlowLabel : '',
+        extraHTTPHeaders,
       );
 
       urlsCrawledObj = res.urlsCrawled;