test: improve E2E form error logging

scripts/check-forms.ts

@@ -66,6 +66,12 @@ async function main() {
 
   const page = await browser.newPage();
 
+  page.on('console', (msg) => console.log('💻 BROWSER CONSOLE:', msg.text()));
+  page.on('pageerror', (error) => console.error('💻 BROWSER ERROR:', error.message));
+  page.on('requestfailed', (request) => {
+    console.error('💻 BROWSER REQUEST FAILED:', request.url(), request.failure()?.errorText);
+  });
+
   // 3. Authenticate through Gatekeeper login form
   console.log(`\n🛡️ Authenticating through Gatekeeper...`);
   try {
@@ -98,7 +104,7 @@ async function main() {
     await page.goto(contactUrl, { waitUntil: 'networkidle0', timeout: 30000 });
 
     // Ensure React has hydrated completely
-    await page.waitForNetworkIdle({ idleTime: 1000, timeout: 15000 }).catch(() => { });
+    await page.waitForNetworkIdle({ idleTime: 1000, timeout: 15000 }).catch(() => {});
 
     // Ensure form is visible and interactive
     try {
@@ -127,10 +133,17 @@ async function main() {
 
     // Explicitly click submit and wait for navigation/state-change
     await Promise.all([
-      page.waitForSelector('[role="alert"][aria-live="polite"]', { timeout: 15000 }),
+      page.waitForSelector('[role="alert"]', { timeout: 15000 }),
       page.click('button[type="submit"]'),
     ]);
 
+    const alertText = await page.$eval('[role="alert"]', (el) => el.textContent);
+    console.log(`   Alert text: ${alertText}`);
+
+    if (alertText?.includes('Failed') || alertText?.includes('went wrong')) {
+      throw new Error(`Form submitted but showed error: ${alertText}`);
+    }
+
     console.log(`✅ Contact Form submitted successfully! (Success state verified)`);
   } catch (err: any) {
     console.error(`❌ Contact Form Test Failed: ${err.message}`);
@@ -143,7 +156,7 @@ async function main() {
     await page.goto(productUrl, { waitUntil: 'networkidle0', timeout: 30000 });
 
     // Ensure React has hydrated completely
-    await page.waitForNetworkIdle({ idleTime: 1000, timeout: 15000 }).catch(() => { });
+    await page.waitForNetworkIdle({ idleTime: 1000, timeout: 15000 }).catch(() => {});
 
     // The product form uses dynamic IDs, so we select by input type in the specific form context
     try {
@@ -170,10 +183,17 @@ async function main() {
 
     // Submit and wait for success state
     await Promise.all([
-      page.waitForSelector('[role="alert"][aria-live="polite"]', { timeout: 15000 }),
+      page.waitForSelector('[role="alert"]', { timeout: 15000 }),
       page.click('form button[type="submit"]'),
     ]);
 
+    const alertText = await page.$eval('[role="alert"]', (el) => el.textContent);
+    console.log(`   Alert text: ${alertText}`);
+
+    if (alertText?.includes('Failed') || alertText?.includes('went wrong')) {
+      throw new Error(`Form submitted but showed error: ${alertText}`);
+    }
+
     console.log(`✅ Product Quote Form submitted successfully! (Success state verified)`);
   } catch (err: any) {
     console.error(`❌ Product Quote Form Test Failed: ${err.message}`);
@@ -202,12 +222,16 @@ async function main() {
         console.log(`   ✅ Deleted submission: ${doc.id}`);
       } catch (delErr: any) {
         // Log but don't fail, 403s on Directus / Payload APIs for guest Gatekeeper sessions are normal
-        console.warn(`   ⚠️ Cleanup attempt on ${doc.id} returned an error, typically due to API Auth separation: ${delErr.message}`);
+        console.warn(
+          `   ⚠️ Cleanup attempt on ${doc.id} returned an error, typically due to API Auth separation: ${delErr.message}`,
+        );
       }
     }
   } catch (err: any) {
     if (err.response?.status === 403) {
-      console.warn(`   ⚠️ Cleanup fetch failed with 403 Forbidden. This is expected if the runner lacks admin API credentials. Test submissions remain in the database.`);
+      console.warn(
+        `   ⚠️ Cleanup fetch failed with 403 Forbidden. This is expected if the runner lacks admin API credentials. Test submissions remain in the database.`,
+      );
     } else {
       console.error(`   ❌ Cleanup fetch failed: ${err.message}`);
     }