test: enhance E2E and integration testing infrastructure

- Add comprehensive TypeScript types to E2E test helpers
- Improve medication, auth, modal, and wait helper classes with proper typing
- Enhance test data with readonly type assertions for better immutability
- Update integration tests with better error handling and assertions
- Improve Playwright type definitions for better IDE support
- Add environment variable support to manual test scripts

tests/e2e/helpers.ts

@@ -1,14 +1,35 @@
 // E2E Test Utilities and Helpers
+import { Page } from '@playwright/test';
+
+// Type definitions for better type safety
+interface MedicationData {
+  name: string;
+  dosage: string;
+  frequency: string;
+  times: string;
+}
+
+interface UserData {
+  email: string;
+  username: string;
+  password: string;
+}
+
+interface ReminderData {
+  title: string;
+  icon: string;
+  frequency: number;
+}
 
 export class MedicationHelpers {
-  constructor(private page: any) {}
+  constructor(private page: Page) {}
 
   async addMedication(
     name: string,
     dosage: string,
     frequency: string = 'daily',
     times: string = '1'
-  ) {
+  ): Promise<void> {
     await this.page.click('button:has-text("Add Medication")');
     await this.page.fill('input[name="name"]', name);
     await this.page.fill('input[name="dosage"]', dosage);
@@ -22,30 +43,32 @@ export class MedicationHelpers {
     await this.page.waitForSelector(`text=${name}`);
   }
 
-  async deleteMedication(name: string) {
+  async deleteMedication(name: string): Promise<void> {
     await this.page.click('button:has-text("Manage")');
 
     // Find the medication row and click delete
-    const medicationRow = this.page.locator(`tr:has-text("${name}")`);
-    await medicationRow.locator('[data-testid="delete-medication"]').click();
+    await this.page
+      .locator(`tr:has-text("${name}") [data-testid="delete-medication"]`)
+      .click();
     await this.page.click('button:has-text("Delete")');
 
     // Close manage modal
     await this.page.click('button:has-text("Close")');
   }
 
-  async takeDose(medicationName: string) {
-    const doseCard = this.page.locator(
-      `.dose-card:has-text("${medicationName}")`
-    );
-    await doseCard.locator('button:has-text("Take")').click();
+  async takeDose(medicationName: string): Promise<void> {
+    await this.page
+      .locator(
+        `.dose-card:has-text("${medicationName}") button:has-text("Take")`
+      )
+      .click();
   }
 }
 
 export class AuthHelpers {
-  constructor(private page: any) {}
+  constructor(private page: Page) {}
 
-  async loginAsAdmin() {
+  async loginAsAdmin(): Promise<void> {
     await this.page.goto('/');
     await this.page.fill('input[type="email"]', 'admin@localhost');
     await this.page.fill('input[type="password"]', 'admin123!');
@@ -53,7 +76,11 @@ export class AuthHelpers {
     await this.page.waitForSelector('h1:has-text("Medication Reminder")');
   }
 
-  async registerUser(email: string, username: string, password: string) {
+  async registerUser(
+    email: string,
+    username: string,
+    password: string
+  ): Promise<void> {
     await this.page.goto('/');
     await this.page.click('text=Register');
     await this.page.fill('input[type="email"]', email);
@@ -62,7 +89,7 @@ export class AuthHelpers {
     await this.page.click('button[type="submit"]');
   }
 
-  async logout() {
+  async logout(): Promise<void> {
     await this.page.click('[data-testid="avatar-dropdown"]');
     await this.page.click('button:has-text("Logout")');
     await this.page.waitForSelector('h2:has-text("Sign In")');
@@ -70,33 +97,33 @@ export class AuthHelpers {
 }
 
 export class ModalHelpers {
-  constructor(private page: any) {}
+  constructor(private page: Page) {}
 
-  async openModal(buttonText: string) {
+  async openModal(buttonText: string): Promise<void> {
     await this.page.click(`button:has-text("${buttonText}")`);
   }
 
-  async closeModal() {
+  async closeModal(): Promise<void> {
     await this.page.click('button:has-text("Close")');
   }
 
-  async confirmAction() {
+  async confirmAction(): Promise<void> {
     await this.page.click('button:has-text("Confirm")');
   }
 }
 
 export class WaitHelpers {
-  constructor(private page: any) {}
+  constructor(private page: Page) {}
 
-  async waitForAppLoad() {
+  async waitForAppLoad(): Promise<void> {
     await this.page.waitForSelector('h1:has-text("Medication Reminder")');
   }
 
-  async waitForModal(title: string) {
+  async waitForModal(title: string): Promise<void> {
     await this.page.waitForSelector(`text=${title}`);
   }
 
-  async waitForNotification(message: string) {
+  async waitForNotification(message: string): Promise<void> {
     await this.page.waitForSelector(`text=${message}`);
   }
 }
@@ -108,7 +135,7 @@ export const TestData = {
     { name: 'Vitamin D', dosage: '1000 IU', frequency: 'daily', times: '1' },
     { name: 'Omega-3', dosage: '500mg', frequency: 'daily', times: '2' },
     { name: 'Calcium', dosage: '600mg', frequency: 'twice_daily', times: '1' },
-  ],
+  ] as const satisfies readonly MedicationData[],
 
   users: [
     {
@@ -121,11 +148,11 @@ export const TestData = {
       username: 'testuser2',
       password: 'TestPass456!',
     },
-  ],
+  ] as const satisfies readonly UserData[],
 
   reminders: [
     { title: 'Drink Water', icon: 'bell', frequency: 60 },
     { title: 'Exercise', icon: 'heart', frequency: 1440 }, // Daily
     { title: 'Check Blood Pressure', icon: 'chart', frequency: 10080 }, // Weekly
-  ],
-};
+  ] as const satisfies readonly ReminderData[],
+} as const;