Fix flaky E2E test cases - hardened 404 capture logic in BasePage.ts: the listener now installs only once, records status/method/url for each 4xx response, and exposes reset404Errors() so each navigation starts from a clean slate, reworked the @ready main pages have no 404 errors coverage in critical-paths.spec.ts to enable the listener once, reset errors before every goto, and then assert. The loop no longer keeps stale entries from prior navigations or spins up redundant listeners, so the smoke check now exercises exactly one listener per Playwright page.

Author: webstackdev

test/e2e/helpers/pageObjectModels/BasePage.ts

@@ -23,6 +23,7 @@ export class BasePage {
   public errors404: string[] = []
   public navigationItems = navigationItems
   private lastAstroPageLoadCount = 0
+  private has404Listener = false
 
   protected constructor(protected readonly _page: Page) {
     this.page = _page
@@ -862,12 +863,32 @@ export class BasePage {
   /**
    * Verify 404 page is displayed for non-existent pages
    */
+  /**
+   * Capture network responses that return 4xx status codes.
+   * Listener is attached once per Playwright page instance.
+   */
   async enable404Listener(): Promise<void> {
-    this._page.on('response', async response => {
-      if (response.status() >= 400 && response.status() < 500) {
-        this.errors404.push(this._page.url())
+    if (this.has404Listener) {
+      return
+    }
+
+    this._page.on('response', response => {
+      const status = response.status()
+      if (status >= 400 && status < 500) {
+        const method = response.request().method()
+        const responseUrl = response.url()
+        this.errors404.push(`${status} ${method} ${responseUrl}`)
       }
     })
+
+    this.has404Listener = true
+  }
+
+  /**
+   * Reset tracked 4xx network errors between navigations.
+   */
+  reset404Errors(): void {
+    this.errors404 = []
   }
 
   /**

test/e2e/specs/01-smoke/critical-paths.spec.ts

@@ -112,8 +112,9 @@ test.describe('Critical Paths @smoke', () => {
 
   test('@ready main pages have no 404 errors', async ({ page: playwrightPage}) => {
     const page = await BasePage.init(playwrightPage)
+    await page.enable404Listener()
     for (const { url: path } of page.navigationItems) {
-      page.enable404Listener()
+      page.reset404Errors()
       await page.goto(path)
       expect(page.errors404, `Received 404 errors for:\n${page.errors404.join("\n")}`).toHaveLength(0)
     }