Merge pull request #1 from vitejs/client-event-target

feat: add EventTarget to @vite/client
vitejs · Jun 4, 2021 · 795ab4b · 795ab4b
2 parents 366bd16 + 38d269a
commit 795ab4b
Showing 1 changed file with 18 additions and 15 deletions.
diff --git a/packages/vite/src/client/client.ts b/packages/vite/src/client/client.ts
@@ -10,7 +10,10 @@ declare const __HMR_PORT__: string
 declare const __HMR_TIMEOUT__: number
 declare const __HMR_ENABLE_OVERLAY__: boolean
 
+export const viteEventTarget = new EventTarget()
+
 console.log('[vite] connecting...')
+viteEventTarget.dispatchEvent(new Event('vite:connecting'))
 
 // use server configuration, then fallback to inference
 const socketProtocol =
@@ -35,18 +38,6 @@ socket.addEventListener('message', async ({ data }) => {
   handleMessage(JSON.parse(data))
 })
 
-const listeners = new Set<HMRListener>()
-
-export type HMRListener = (payload: HMRPayload) => void
-
-export function addHMRListener(listener: HMRListener): void {
-  listeners.add(listener)
-}
-
-export function removeHMRListener(listener: HMRListener): void {
-  listeners.delete(listener)
-}
-
 let isFirstUpdate = true
 
 async function handleMessage(payload: HMRPayload) {
@@ -56,18 +47,27 @@ async function handleMessage(payload: HMRPayload) {
       // proxy(nginx, docker) hmr ws maybe caused timeout,
       // so send ping package let ws keep alive.
       setInterval(() => socket.send('ping'), __HMR_TIMEOUT__)
+      viteEventTarget.dispatchEvent(
+        new CustomEvent('vite:connected', { detail: { payload } })
+      )
       break
     case 'update':
       // if this is the first update and there's already an error overlay, it
       // means the page opened with existing server compile error and the whole
       // module script failed to load (since one of the nested imports is 500).
       // in this case a normal update won't work and a full reload is needed.
       if (isFirstUpdate && hasErrorOverlay()) {
+        viteEventTarget.dispatchEvent(
+          new CustomEvent('vite:update', { detail: { payload } })
+        )
         window.location.reload()
         return
       } else {
         clearErrorOverlay()
         isFirstUpdate = false
+        viteEventTarget.dispatchEvent(
+          new CustomEvent('vite:update', { detail: { payload } })
+        )
       }
       payload.updates.forEach((update) => {
         if (update.type === 'js-update') {
@@ -135,8 +135,14 @@ async function handleMessage(payload: HMRPayload) {
       const err = payload.err
       if (enableOverlay) {
         createErrorOverlay(err)
+        viteEventTarget.dispatchEvent(
+          new CustomEvent('vite:error', { detail: { payload, error: err } })
+        )
       } else {
         console.error(`[vite] Internal Server Error\n${err.stack}`)
+        viteEventTarget.dispatchEvent(
+          new CustomEvent('vite:error', { detail: { payload, error: err } })
+        )
       }
       break
     }
@@ -145,9 +151,6 @@ async function handleMessage(payload: HMRPayload) {
       return check
     }
   }
-  for (const listener of [...listeners]) {
-    listener(payload)
-  }
 }
 
 const enableOverlay = __HMR_ENABLE_OVERLAY__