@jsenv/core 27.4.0 → 27.5.2

package/src/plugins/plugin_controller.js

@@ -1,44 +1,63 @@
 import { timeStart } from "@jsenv/server"
 
-export const createPluginController = ({
-  plugins,
-  scenario,
-  hooks = [
-    "init",
-    "resolveUrl",
-    "redirectUrl",
-    "fetchUrlContent",
-    "transformUrlContent",
-    "transformUrlSearchParams",
-    "formatUrl",
-    "finalizeUrlContent",
-    "cooked",
-    "destroy",
-  ],
-}) => {
-  plugins = flattenAndFilterPlugins(plugins, { scenario })
-  // precompute a list of hooks per hookName
-  // For one major reason:
+const HOOK_NAMES = [
+  "init",
+  "serve", // is called only during dev/tests
+  "resolveUrl",
+  "redirectUrl",
+  "fetchUrlContent",
+  "transformUrlContent",
+  "transformUrlSearchParams",
+  "formatUrl",
+  "finalizeUrlContent",
+  "bundle", // is called only during build
+  "optimizeUrlContent", // is called only during build
+  "cooked",
+  "augmentResponse", // is called only during dev/tests
+  "destroy",
+]
+
+export const createPluginController = ({ plugins, scenario }) => {
+  const flatPlugins = flattenAndFilterPlugins(plugins, { scenario })
+  // precompute a list of hooks per hookName for one major reason:
   // - When debugging, there is less iteration
-  // And also it should increase perf as there is less work to do
+  // also it should increase perf as there is less work to do
+
   const hookGroups = {}
-  const addHook = (hookName) => {
-    const hooks = []
-    plugins.forEach((plugin) => {
-      const hook = plugin[hookName]
-      if (hook) {
-        hooks.push({
+  const addPlugin = (plugin, { position = "start" }) => {
+    Object.keys(plugin).forEach((key) => {
+      if (key === "name" || key === "appliesDuring" || key === "serverEvents") {
+        return
+      }
+      const isHook = HOOK_NAMES.includes(key)
+      if (!isHook) {
+        console.warn(`Unexpected "${key}" property on "${plugin.name}" plugin`)
+      }
+      const hookName = key
+      const hookValue = plugin[hookName]
+      if (hookValue) {
+        const group = hookGroups[hookName] || (hookGroups[hookName] = [])
+        const hook = {
           plugin,
-          hookName,
-          value: hook,
-        })
+          name: hookName,
+          value: hookValue,
+        }
+        if (position === "start") {
+          group.push(hook)
+        } else {
+          group.unshift(hook)
+        }
       }
     })
-    hookGroups[hookName] = hooks
-    return hooks
   }
-  hooks.forEach((hookName) => {
-    addHook(hookName)
+  const pushPlugin = (plugin) => {
+    addPlugin(plugin, { position: "start" })
+  }
+  const unshiftPlugin = (plugin) => {
+    addPlugin(plugin, { position: "end" })
+  }
+  flatPlugins.forEach((plugin) => {
+    pushPlugin(plugin)
   })
 
   let currentPlugin = null
@@ -49,15 +68,18 @@ export const createPluginController = ({
       return null
     }
     currentPlugin = hook.plugin
-    currentHookName = hook.hookName
-    const timeEnd = timeStart(
-      `${currentHookName}-${currentPlugin.name.replace("jsenv:", "")}`,
-    )
+    currentHookName = hook.name
+    let timeEnd
+    if (info.timing) {
+      timeEnd = timeStart(
+        `${currentHookName}-${currentPlugin.name.replace("jsenv:", "")}`,
+      )
+    }
     let valueReturned = hookFn(info, context)
     if (info.timing) {
       Object.assign(info.timing, timeEnd())
     }
-    valueReturned = assertAndNormalizeReturnValue(hook.hookName, valueReturned)
+    valueReturned = assertAndNormalizeReturnValue(hook.name, valueReturned)
     currentPlugin = null
     currentHookName = null
     return valueReturned
@@ -68,15 +90,18 @@ export const createPluginController = ({
       return null
     }
     currentPlugin = hook.plugin
-    currentHookName = hook.hookName
-    const timeEnd = timeStart(
-      `${currentHookName}-${currentPlugin.name.replace("jsenv:", "")}`,
-    )
+    currentHookName = hook.name
+    let timeEnd
+    if (info.timing) {
+      timeEnd = timeStart(
+        `${currentHookName}-${currentPlugin.name.replace("jsenv:", "")}`,
+      )
+    }
     let valueReturned = await hookFn(info, context)
     if (info.timing) {
       Object.assign(info.timing, timeEnd())
     }
-    valueReturned = assertAndNormalizeReturnValue(hook.hookName, valueReturned)
+    valueReturned = assertAndNormalizeReturnValue(hook.name, valueReturned)
     currentPlugin = null
     currentHookName = null
     return valueReturned
@@ -84,36 +109,45 @@ export const createPluginController = ({
 
   const callHooks = (hookName, info, context, callback) => {
     const hooks = hookGroups[hookName]
-    for (const hook of hooks) {
-      const returnValue = callHook(hook, info, context)
-      if (returnValue) {
-        callback(returnValue)
+    if (hooks) {
+      for (const hook of hooks) {
+        const returnValue = callHook(hook, info, context)
+        if (returnValue && callback) {
+          callback(returnValue)
+        }
       }
     }
   }
   const callAsyncHooks = async (hookName, info, context, callback) => {
     const hooks = hookGroups[hookName]
-    await hooks.reduce(async (previous, hook) => {
-      await previous
-      const returnValue = await callAsyncHook(hook, info, context)
-      if (returnValue && callback) {
-        await callback(returnValue)
-      }
-    }, Promise.resolve())
+    if (hooks) {
+      await hooks.reduce(async (previous, hook) => {
+        await previous
+        const returnValue = await callAsyncHook(hook, info, context)
+        if (returnValue && callback) {
+          await callback(returnValue)
+        }
+      }, Promise.resolve())
+    }
   }
 
   const callHooksUntil = (hookName, info, context) => {
     const hooks = hookGroups[hookName]
-    for (const hook of hooks) {
-      const returnValue = callHook(hook, info, context)
-      if (returnValue) {
-        return returnValue
+    if (hooks) {
+      for (const hook of hooks) {
+        const returnValue = callHook(hook, info, context)
+        if (returnValue) {
+          return returnValue
+        }
       }
     }
     return null
   }
   const callAsyncHooksUntil = (hookName, info, context) => {
     const hooks = hookGroups[hookName]
+    if (!hooks) {
+      return null
+    }
     if (hooks.length === 0) {
       return null
     }
@@ -136,8 +170,9 @@ export const createPluginController = ({
   }
 
   return {
-    plugins,
-    addHook,
+    plugins: flatPlugins,
+    pushPlugin,
+    unshiftPlugin,
     getHookFunction,
     callHook,
     callAsyncHook,
@@ -152,8 +187,8 @@ export const createPluginController = ({
   }
 }
 
-const flattenAndFilterPlugins = (pluginsRaw, { scenario }) => {
-  const plugins = []
+const flattenAndFilterPlugins = (plugins, { scenario }) => {
+  const flatPlugins = []
   const visitPluginEntry = (pluginEntry) => {
     if (Array.isArray(pluginEntry)) {
       pluginEntry.forEach((value) => visitPluginEntry(value))
@@ -169,7 +204,7 @@ const flattenAndFilterPlugins = (pluginsRaw, { scenario }) => {
         return
       }
       if (appliesDuring === "*") {
-        plugins.push(pluginEntry)
+        flatPlugins.push(pluginEntry)
         return
       }
       if (typeof appliesDuring === "string") {
@@ -179,7 +214,7 @@ const flattenAndFilterPlugins = (pluginsRaw, { scenario }) => {
           )
         }
         if (appliesDuring === scenario) {
-          plugins.push(pluginEntry)
+          flatPlugins.push(pluginEntry)
         }
         return
       }
@@ -189,7 +224,7 @@ const flattenAndFilterPlugins = (pluginsRaw, { scenario }) => {
         )
       }
       if (appliesDuring[scenario]) {
-        plugins.push(pluginEntry)
+        flatPlugins.push(pluginEntry)
         return
       }
       if (pluginEntry.destroy) {
@@ -199,8 +234,8 @@ const flattenAndFilterPlugins = (pluginsRaw, { scenario }) => {
     }
     throw new Error(`plugin must be objects, got ${pluginEntry}`)
   }
-  pluginsRaw.forEach((plugin) => visitPluginEntry(plugin))
-  return plugins
+  plugins.forEach((plugin) => visitPluginEntry(plugin))
+  return flatPlugins
 }
 
 const getHookFunction = (

package/src/plugins/plugins.js

@@ -19,16 +19,17 @@ import { jsenvPluginMinification } from "./minification/jsenv_plugin_minificatio
 import { jsenvPluginImportMetaHot } from "./import_meta_hot/jsenv_plugin_import_meta_hot.js"
 import { jsenvPluginAutoreload } from "./autoreload/jsenv_plugin_autoreload.js"
 import { jsenvPluginCacheControl } from "./cache_control/jsenv_plugin_cache_control.js"
+// dev only
+import { jsenvPluginExplorer } from "./explorer/jsenv_plugin_explorer.js"
 
 export const getCorePlugins = ({
   rootDirectoryUrl,
-  urlGraph,
   scenario,
   runtimeCompat,
 
   urlAnalysis = {},
   htmlSupervisor,
-  nodeEsmResolution,
+  nodeEsmResolution = true,
   fileSystemMagicResolution,
   directoryReferenceAllowed,
   transpilation = true,
@@ -38,6 +39,7 @@ export const getCorePlugins = ({
   clientAutoreload = false,
   clientFileChangeCallbackList,
   clientFilesPruneCallbackList,
+  explorer,
 } = {}) => {
   if (htmlSupervisor === true) {
     htmlSupervisor = {}
@@ -45,9 +47,13 @@ export const getCorePlugins = ({
   if (nodeEsmResolution === true) {
     nodeEsmResolution = {}
   }
+  if (fileSystemMagicResolution === true) {
+    fileSystemMagicResolution = {}
+  }
   if (clientAutoreload === true) {
     clientAutoreload = {}
   }
+
   return [
     jsenvPluginUrlAnalysis({ rootDirectoryUrl, ...urlAnalysis }),
     jsenvPluginTranspilation(transpilation),
@@ -63,12 +69,7 @@ export const getCorePlugins = ({
     jsenvPluginHttpUrls(),
     jsenvPluginLeadingSlash(),
     // before url resolution to handle "js_import_export" resolution
-    jsenvPluginNodeEsmResolution({
-      rootDirectoryUrl,
-      urlGraph,
-      runtimeCompat,
-      ...nodeEsmResolution,
-    }),
+    jsenvPluginNodeEsmResolution(nodeEsmResolution),
     jsenvPluginUrlResolution(),
     jsenvPluginUrlVersion(),
     jsenvPluginCommonJsGlobals(),
@@ -90,5 +91,6 @@ export const getCorePlugins = ({
         ]
       : []),
     jsenvPluginCacheControl(),
+    ...(explorer ? [jsenvPluginExplorer(explorer)] : []),
   ]
 }

package/src/{helpers/event_source/event_source.js → plugins/server_events/client/event_source_connection.js}

@@ -1,5 +1,3 @@
-/* eslint-env browser */
-
 const STATUSES = {
   CONNECTING: "connecting",
   CONNECTED: "connected",
@@ -8,7 +6,12 @@ const STATUSES = {
 
 export const createEventSourceConnection = (
   eventSourceUrl,
-  { retryMaxAttempt = Infinity, retryAllocatedMs = Infinity, lastEventId } = {},
+  {
+    retryMaxAttempt = Infinity,
+    retryAllocatedMs = Infinity,
+    lastEventId,
+    useEventsToManageConnection = true,
+  } = {},
 ) => {
   const { EventSource } = window
   if (typeof EventSource !== "function") {
@@ -16,25 +19,85 @@ export const createEventSourceConnection = (
   }
 
   let eventSource
-  const events = {}
+  const listenersMap = new Map()
+  const callbacksMap = new Map()
   const eventSourceOrigin = new URL(eventSourceUrl).origin
-  const addEventCallbacks = (eventCallbacks) => {
-    Object.keys(eventCallbacks).forEach((eventName) => {
-      const eventCallback = eventCallbacks[eventName]
-      events[eventName] = (e) => {
-        if (e.origin === eventSourceOrigin) {
-          if (e.lastEventId) {
-            lastEventId = e.lastEventId
+  const addEventCallbacks = (namedCallbacks) => {
+    let listenersMapSize = listenersMap.size
+    Object.keys(namedCallbacks).forEach((eventName) => {
+      const callback = namedCallbacks[eventName]
+      const existingCallbacks = callbacksMap.get(eventName)
+      let callbacks
+      if (existingCallbacks) {
+        callbacks = existingCallbacks
+      } else {
+        callbacks = []
+        callbacksMap.set(eventName, callbacks)
+      }
+      if (callbacks.length === 0) {
+        const eventListener = (e) => {
+          if (e.origin === eventSourceOrigin) {
+            if (e.lastEventId) {
+              lastEventId = e.lastEventId
+            }
+            callbacks.forEach((eventCallback) => {
+              eventCallback(e)
+            })
           }
-          eventCallback(e)
+        }
+        listenersMap.set(eventName, eventListener)
+        if (eventSource) {
+          eventSource.addEventListener(eventName, eventListener)
         }
       }
-      if (eventSource) {
-        eventSource.addEventListener(eventName, events[eventName])
-      }
+      callbacks.push(callback)
     })
+    if (
+      useEventsToManageConnection &&
+      listenersMapSize === 0 &&
+      listenersMap.size > 0 &&
+      status.value !== STATUSES.CONNECTING &&
+      status.value !== STATUSES.CONNECTED
+    ) {
+      _connect()
+    }
+
+    let removed = false
+    return () => {
+      if (removed) return
+      removed = true
+      listenersMapSize = listenersMap.size
+      Object.keys(namedCallbacks).forEach((eventName) => {
+        const callback = namedCallbacks[eventName]
+        const callbacks = callbacksMap.get(eventName)
+        if (callbacks) {
+          const index = callbacks.indexOf(callback)
+          if (index > -1) {
+            callbacks.splice(index, 1)
+            if (callbacks.length === 0) {
+              const listener = listenersMap.get(eventName)
+              if (listener) {
+                listenersMap.delete(listener)
+                if (eventSource) {
+                  eventSource.removeEventListener(eventName, listener)
+                }
+              }
+            }
+          }
+        }
+      })
+      namedCallbacks = null // allow garbage collect
+      if (
+        useEventsToManageConnection &&
+        listenersMapSize > 0 &&
+        listenersMap.size === 0 &&
+        (status.value === STATUSES.CONNECTING ||
+          status.value === STATUSES.CONNECTED)
+      ) {
+        _disconnect()
+      }
+    }
   }
-  addEventCallbacks(events)
 
   const status = {
     value: "default",
@@ -50,6 +113,12 @@ export const createEventSourceConnection = (
   let _disconnect = () => {}
 
   const attemptConnection = (url) => {
+    if (
+      status.value === STATUSES.CONNECTING ||
+      status.value === STATUSES.CONNECTED
+    ) {
+      return
+    }
     eventSource = new EventSource(url, {
       withCredentials: true,
     })
@@ -63,11 +132,13 @@ export const createEventSourceConnection = (
         )
         return
       }
-      eventSource.onerror = undefined
-      eventSource.close()
-      Object.keys(events).forEach((eventName) => {
-        eventSource.removeEventListener(eventName, events[eventName])
-      })
+      if (eventSource) {
+        eventSource.onerror = undefined
+        eventSource.close()
+        listenersMap.forEach((listener, eventName) => {
+          eventSource.removeEventListener(eventName, listener)
+        })
+      }
       eventSource = null
       status.goTo(STATUSES.DISCONNECTED)
     }
@@ -107,22 +178,20 @@ export const createEventSourceConnection = (
     eventSource.onopen = () => {
       status.goTo(STATUSES.CONNECTED)
     }
-    Object.keys(events).forEach((eventName) => {
-      eventSource.addEventListener(eventName, events[eventName])
+    listenersMap.forEach((listener, eventName) => {
+      eventSource.addEventListener(eventName, listener)
     })
-    if (!events.hasOwnProperty("welcome")) {
-      eventSource.addEventListener("welcome", (e) => {
-        if (e.origin === eventSourceOrigin && e.lastEventId) {
-          lastEventId = e.lastEventId
-        }
+    if (!listenersMap.has("welcome")) {
+      addEventCallbacks({
+        welcome: () => {}, // to update lastEventId
       })
     }
     status.goTo(STATUSES.CONNECTING)
   }
 
-  let connect = () => {
+  let _connect = () => {
     attemptConnection(eventSourceUrl)
-    connect = () => {
+    _connect = () => {
       attemptConnection(
         lastEventId
           ? addLastEventIdIntoUrlSearchParams(eventSourceUrl, lastEventId)
@@ -143,11 +212,13 @@ export const createEventSourceConnection = (
   const destroy = () => {
     removePageUnloadListener()
     _disconnect()
+    listenersMap.clear()
+    callbacksMap.clear()
   }
 
   return {
     status,
-    connect,
+    connect: () => _connect(),
     addEventCallbacks,
     disconnect: () => _disconnect(),
     destroy,

package/src/plugins/server_events/client/server_events_client.js

@@ -0,0 +1,17 @@
+import { createEventSourceConnection } from "./event_source_connection.js"
+
+const eventsourceConnection = createEventSourceConnection(
+  document.location.href,
+  {
+    retryMaxAttempt: Infinity,
+    retryAllocatedMs: 20 * 1000,
+  },
+)
+const { status, connect, addEventCallbacks, disconnect } = eventsourceConnection
+window.__server_events__ = {
+  addEventCallbacks,
+  status,
+  connect,
+  disconnect,
+}
+connect()

package/src/plugins/server_events/jsenv_plugin_server_events_client_injection.js

@@ -0,0 +1,48 @@
+/*
+ * This plugin is very special because it is here
+ * to provide "serverEvents" used by other plugins
+ */
+
+import {
+  parseHtmlString,
+  stringifyHtmlAst,
+  injectScriptNodeAsEarlyAsPossible,
+  createHtmlNode,
+} from "@jsenv/ast"
+
+const serverEventsClientFileUrl = new URL(
+  "./client/server_events_client.js",
+  import.meta.url,
+).href
+
+export const jsenvPluginServerEventsClientInjection = () => {
+  return {
+    name: "jsenv:server_events_client_injection",
+    appliesDuring: "*",
+    transformUrlContent: {
+      html: (htmlUrlInfo, context) => {
+        const htmlAst = parseHtmlString(htmlUrlInfo.content)
+        const [serverEventsClientFileReference] = context.referenceUtils.inject(
+          {
+            type: "script_src",
+            expectedType: "js_module",
+            specifier: serverEventsClientFileUrl,
+          },
+        )
+        injectScriptNodeAsEarlyAsPossible(
+          htmlAst,
+          createHtmlNode({
+            "tagName": "script",
+            "type": "module",
+            "src": serverEventsClientFileReference.generatedSpecifier,
+            "injected-by": "jsenv:server_events",
+          }),
+        )
+        const htmlModified = stringifyHtmlAst(htmlAst)
+        return {
+          content: htmlModified,
+        }
+      },
+    },
+  }
+}

package/src/plugins/server_events/server_events_dispatcher.js

@@ -0,0 +1,69 @@
+import { createSSERoom } from "@jsenv/server"
+import { createCallbackListNotifiedOnce } from "@jsenv/abort"
+
+export const createServerEventsDispatcher = () => {
+  const destroyCallbackList = createCallbackListNotifiedOnce()
+  const rooms = []
+  const sseRoomLimit = 100
+
+  destroyCallbackList.add(() => {
+    rooms.forEach((room) => {
+      room.close()
+    })
+  })
+
+  return {
+    addRoom: (request) => {
+      const existingRoom = rooms.find(
+        (roomCandidate) =>
+          roomCandidate.request.ressource === request.ressource,
+      )
+      if (existingRoom) {
+        return existingRoom
+      }
+      const room = createSSERoom({
+        retryDuration: 2000,
+        historyLength: 100,
+        welcomeEventEnabled: true,
+        effect: () => {
+          rooms.push(room)
+          if (rooms.length >= sseRoomLimit) {
+            const firstRoom = rooms.shift()
+            firstRoom.close()
+          }
+          return () => {
+            // when the last client leaves the room it is closed and removed from the list
+            room.close()
+            const index = rooms.indexOf(room)
+            if (index > -1) {
+              rooms.splice(index, 1)
+            }
+          }
+        },
+      })
+      room.request = request
+      return room
+    },
+    dispatch: ({ type, data }) => {
+      rooms.forEach((room) =>
+        room.sendEventToAllClients({
+          type,
+          data: JSON.stringify(data),
+        }),
+      )
+    },
+    dispatchToRoomsMatching: ({ type, data }, predicate) => {
+      rooms.forEach((room) => {
+        if (predicate(room)) {
+          room.sendEventToAllClients({
+            type,
+            data: JSON.stringify(data),
+          })
+        }
+      })
+    },
+    destroy: () => {
+      destroyCallbackList.notify()
+    },
+  }
+}