feat(tests): implement TestClientEventBus for event handling in tests

Author: abedshaaban

packages/devtools-seo/src/json-ld-preview.tsx

@@ -1,10 +1,10 @@
 import { For, Show } from 'solid-js'
 import { Section, SectionDescription } from '@tanstack/devtools-ui'
 import { isInsideDevtools } from './devtools-dom-filter'
+import { sectionHealthScore } from './seo-section-summary'
 import { useSeoStyles } from './use-seo-styles'
 import { pickSeverityClass, seoHealthTier } from './seo-severity'
 import type { SeoSeverity } from './seo-severity'
-import { sectionHealthScore } from './seo-section-summary'
 import type { SeoSectionSummary } from './seo-section-summary'
 
 type JsonLdValue = Record<string, unknown>

packages/event-bus-client/package.json

@@ -56,8 +56,5 @@
     "test:types": "tsc",
     "test:build": "publint --strict",
     "build": "vite build"
-  },
-  "devDependencies": {
-    "@tanstack/devtools-event-bus": "workspace:*"
   }
 }

packages/event-bus-client/tests/index.test.ts

@@ -1,16 +1,41 @@
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
-import { ClientEventBus } from '@tanstack/devtools-event-bus/client'
 import { EventClient } from '../src'
 
+class TestClientEventBus {
+  #dispatcher = (e: Event) => {
+    const event = (e as CustomEvent).detail
+    window.dispatchEvent(new CustomEvent(event.type, { detail: event }))
+    window.dispatchEvent(
+      new CustomEvent('tanstack-devtools-global', {
+        detail: event,
+      }),
+    )
+  }
+
+  #connectFunction = () => {
+    window.dispatchEvent(new CustomEvent('tanstack-connect-success'))
+  }
+
+  start() {
+    window.addEventListener('tanstack-dispatch-event', this.#dispatcher)
+    window.addEventListener('tanstack-connect', this.#connectFunction)
+  }
+
+  stop() {
+    window.removeEventListener('tanstack-dispatch-event', this.#dispatcher)
+    window.removeEventListener('tanstack-connect', this.#connectFunction)
+  }
+}
+
 // client bus uses window to dispatch events
 const clientBusEmitTarget = window
 
 describe('EventClient', () => {
-  let bus: ClientEventBus
+  let bus: TestClientEventBus
 
   beforeEach(() => {
     // Create a fresh bus for each test to ensure isolation
-    bus = new ClientEventBus()
+    bus = new TestClientEventBus()
     bus.start()
   })