fix: more test comment cleanup

Author: cpb8010

packages/auth-server/components/session/row/Expiry.vue

@@ -38,8 +38,8 @@ const props = defineProps<{
   status: SessionStatus;
   isExpired: boolean;
   now: number;
-  createdAt: number;
   expiresAt: number;
+  maxExpiresAt: number;
 }>();
 
 const expiresIn = useTimeAgo(props.expiresAt, { showSecond: true, updateInterval: 1000 });
@@ -54,7 +54,10 @@ const sessionExpiry = computed(() => {
   });
 });
 const timeLeft = computed<number>(() => Math.max(0, props.expiresAt - props.now));
-const timeTotal = computed<number>(() => Math.max(0, props.expiresAt - props.createdAt));
-const timeLeftPercentage = computed<number>(() => Math.min(100, (timeLeft.value / timeTotal.value) * 100));
+const maxTimeLeft = computed<number>(() => Math.max(0, props.maxExpiresAt - props.now));
+const timeLeftPercentage = computed<number>(() => {
+  if (maxTimeLeft.value === 0) return 0;
+  return Math.min(100, (timeLeft.value / maxTimeLeft.value) * 100);
+});
 const isRevoked = computed(() => props.status === SessionStatus.Closed);
 </script>

packages/auth-server/components/session/row/Row.vue

@@ -16,17 +16,13 @@
       </div>
     </div>
     <div class="session-expiry-container">
-      <!-- TODO: created-at is hardcoded to 0 because the current session data
-           does not include a creation timestamp. Update this when a real
-           created-at value is available or when SessionRowExpiry is changed
-           to not rely on created-at for active sessions. -->
       <SessionRowExpiry
         v-if="sessionState"
         :status="sessionState.status"
         :is-expired="isExpired"
-        :created-at="0"
         :expires-at="expiresAt"
         :now="now"
+        :max-expires-at="maxExpiresAt"
       />
     </div>
     <div class="session-spend-limit-container">
@@ -67,6 +63,7 @@ import { type SessionConfig, type SessionState, SessionStatus } from "zksync-sso
 const props = defineProps<{
   sessionHash: Hex;
   sessionSpec: SessionConfig;
+  maxExpiresAt: number;
 }>();
 
 const _now = useNow({ interval: 1000 });

packages/auth-server/pages/dashboard/sessions.vue

@@ -45,6 +45,7 @@
           :key="item.sessionHash"
           :session-hash="item.sessionHash"
           :session-spec="item.sessionSpec"
+          :max-expires-at="maxExpiresAt"
         />
       </template>
     </div>
@@ -55,7 +56,7 @@
 import { InformationCircleIcon } from "@heroicons/vue/20/solid";
 import type { Address, Hex } from "viem";
 import { listActiveSessions } from "zksync-sso-4337";
-import { type ConstraintCondition, LimitType, type SessionSpec } from "zksync-sso-4337/client";
+import { ConstraintCondition, LimitType, type SessionSpec } from "zksync-sso-4337/client";
 
 const { defaultChain } = useClientStore();
 const { address } = storeToRefs(useAccountStore());
@@ -158,12 +159,37 @@ const convertSessionSpec = (wasmSpec: WasmSessionSpec): SessionSpec => {
       selector: policy.selector,
       maxValuePerUse: safeBigInt(policy.maxValuePerUse, "maxValuePerUse"),
       valueLimit: convertLimit(policy.valueLimit),
-      constraints: (policy.constraints || []).map((constraint: WasmConstraint) => ({
-        condition: constraint.condition as unknown as ConstraintCondition,
-        index: safeBigInt(constraint.index, "constraint.index"),
-        refValue: constraint.refValue,
-        limit: convertLimit(constraint.limit),
-      })),
+      constraints: (policy.constraints || []).map((constraint: WasmConstraint) => {
+        // Validate and convert constraint condition
+        let condition: ConstraintCondition;
+        const validConditions: Record<string, ConstraintCondition> = {
+          Unconstrained: ConstraintCondition.Unconstrained,
+          Equal: ConstraintCondition.Equal,
+          Greater: ConstraintCondition.Greater,
+          Less: ConstraintCondition.Less,
+          GreaterEqual: ConstraintCondition.GreaterEqual,
+          LessEqual: ConstraintCondition.LessEqual,
+          NotEqual: ConstraintCondition.NotEqual,
+        };
+
+        if (constraint.condition in validConditions) {
+          condition = validConditions[constraint.condition];
+        } else {
+          const error = new Error(
+            `Unexpected constraint condition value received from WASM: ${constraint.condition}`,
+          );
+          // eslint-disable-next-line no-console
+          console.error(error);
+          throw error;
+        }
+
+        return {
+          condition,
+          index: safeBigInt(constraint.index, "constraint.index"),
+          refValue: constraint.refValue,
+          limit: convertLimit(constraint.limit),
+        };
+      }),
     })),
     transferPolicies: (wasmSpec.transferPolicies || []).map((policy: WasmTransferPolicy) => ({
       target: policy.target,
@@ -204,7 +230,7 @@ const {
       accountFactory: contracts.factory,
       webauthnValidator: contracts.webauthnValidator,
       eoaValidator: contracts.eoaValidator,
-      guardianExecutor: contracts.guardianExecutor,
+      guardianExecutor: contracts.guardianExecutor as Address,
     },
   });
 
@@ -227,5 +253,11 @@ const {
   return filtered;
 });
 
+// Calculate the maximum expiration time across all sessions for progress bar scaling
+const maxExpiresAt = computed(() => {
+  if (!sessions.value || sessions.value.length === 0) return 0;
+  return Math.max(...sessions.value.map((s) => Number(s.sessionSpec.expiresAt)));
+});
+
 sessionsFetch();
 </script>

packages/auth-server/tests/sessions.spec.ts

@@ -99,52 +99,33 @@ test("Session list: verify sessions page loads and displays correctly", async ({
 
   console.log("Page loaded, checking content...");
 
-  // Log any errors that occurred
-  if (pageErrors.length > 0) {
-    console.log(`⚠️ Page errors detected: ${pageErrors.join(", ")}`);
-  }
-
-  // Check what's actually on the page
-  const bodyText = await page.locator("body").textContent();
-  console.log(`Page content (first 500 chars): ${bodyText?.substring(0, 500)}`);
+  // Assert no page errors occurred
+  expect(pageErrors, "No page errors should occur during load").toHaveLength(0);
 
   // Step 3: Verify sessions page UI
   console.log("\nStep 3: Verifying sessions page UI...");
 
-  // Check for main content
-  const mainVisible = await page.locator("main").isVisible({ timeout: 5000 }).catch(() => false);
-  console.log(`Main content visible: ${mainVisible}`);
+  // Assert main content is visible
+  const main = page.locator("main");
+  await expect(main).toBeVisible({ timeout: 5000 });
 
-  // Look for sessions heading (in header)
+  // Assert sessions heading is present
   const header = page.locator("header").getByText("Sessions");
-  const headerVisible = await header.isVisible({ timeout: 5000 }).catch(() => false);
-  console.log(`Sessions header visible: ${headerVisible}`);
-
-  if (headerVisible) {
-    console.log("✓ Sessions header found");
-  } else {
-    console.log("❌ Sessions header NOT found");
-    // Check what's in the header
-    const headerText = await page.locator("header").textContent().catch(() => "");
-    console.log(`Header content: ${headerText}`);
-  }
+  await expect(header).toBeVisible({ timeout: 5000 });
 
-  // Look for empty state or error message
+  // Assert empty state is visible (since we haven't created any sessions yet)
   const emptyStateText = page.getByText(/no active sessions/i);
-  const emptyVisible = await emptyStateText.isVisible({ timeout: 3000 }).catch(() => false);
-  console.log(`Empty state visible: ${emptyVisible}`);
+  await expect(emptyStateText).toBeVisible({ timeout: 3000 });
 
+  // Assert no error alerts are shown
   const errorAlert = page.locator("[role='alert']");
-  const errorVisible = await errorAlert.isVisible({ timeout: 1000 }).catch(() => false);
-  if (errorVisible) {
-    const errorText = await errorAlert.textContent();
-    console.log(`⚠️ Error alert: ${errorText}`);
-  }
+  await expect(errorAlert).not.toBeVisible({ timeout: 1000 });
 
-  // Check for session rows
-  const sessionRows = page.locator("[data-testid*='session-row'], .session-item");
+  // Assert no session rows are displayed (empty state)
+  const sessionRows = page.locator(".session-row");
   const count = await sessionRows.count();
-  console.log(`Session rows found: ${count}`);
+  expect(count, "No sessions should be displayed in empty state").toBe(0);
 
+  console.log("✓ All assertions passed");
   console.log("\n=== Session List UI Test Complete ===\n");
 });