@jsenv/core 39.11.2 → 39.13.0

package/src/plugins/plugin_controller.js

@@ -3,6 +3,7 @@ import { performance } from "node:perf_hooks";
 const HOOK_NAMES = [
   "init",
   "serve", // is called only during dev/tests
+  "serveWebsocket",
   "resolveReference",
   "redirectReference",
   "transformReferenceSearchParams",
@@ -15,6 +16,7 @@ const HOOK_NAMES = [
   "cooked",
   "augmentResponse", // is called only during dev/tests
   "destroy",
+  "effect",
 ];
 
 export const createPluginController = (
@@ -28,19 +30,18 @@ export const createPluginController = (
     return value;
   };
 
-  const plugins = [];
-  // precompute a list of hooks per hookName for one major reason:
-  // - When debugging, there is less iteration
-  // also it should increase perf as there is less work to do
-  const hookGroups = {};
-  const addPlugin = (plugin, { position = "end" }) => {
+  const pluginCandidates = [];
+  const activeEffectSet = new Set();
+  const activePlugins = [];
+  // precompute a list of hooks per hookName because:
+  // 1. [MAJOR REASON] when debugging, there is less iteration (so much better)
+  // 2. [MINOR REASON] it should increase perf as there is less work to do
+  const hookSetMap = new Map();
+  const addPlugin = (plugin, options) => {
     if (Array.isArray(plugin)) {
-      if (position === "start") {
-        plugin = plugin.slice().reverse();
+      for (const value of plugin) {
+        addPlugin(value, options);
       }
-      plugin.forEach((plugin) => {
-        addPlugin(plugin, { position });
-      });
       return;
     }
     if (plugin === null || typeof plugin !== "object") {
@@ -50,65 +51,10 @@ export const createPluginController = (
       plugin.name = "anonymous";
     }
     if (!testAppliesDuring(plugin) || !initPlugin(plugin)) {
-      if (plugin.destroy) {
-        plugin.destroy();
-      }
+      plugin.destroy?.();
       return;
     }
-    plugins.push(plugin);
-    for (const key of Object.keys(plugin)) {
-      if (key === "meta") {
-        const value = plugin[key];
-        if (typeof value !== "object" || value === null) {
-          console.warn(`plugin.meta must be an object, got ${value}`);
-          continue;
-        }
-        Object.assign(pluginsMeta, value);
-        // any extension/modification on plugin.meta
-        // won't be taken into account so we freeze object
-        // to throw in case it happen
-        Object.freeze(value);
-        continue;
-      }
-
-      if (
-        key === "name" ||
-        key === "appliesDuring" ||
-        key === "init" ||
-        key === "serverEvents" ||
-        key === "mustStayFirst"
-      ) {
-        continue;
-      }
-      const isHook = HOOK_NAMES.includes(key);
-      if (!isHook) {
-        console.warn(`Unexpected "${key}" property on "${plugin.name}" plugin`);
-        continue;
-      }
-      const hookName = key;
-      const hookValue = plugin[hookName];
-      if (hookValue) {
-        const group = hookGroups[hookName] || (hookGroups[hookName] = []);
-        const hook = {
-          plugin,
-          name: hookName,
-          value: hookValue,
-        };
-        if (position === "start") {
-          let i = 0;
-          while (i < group.length) {
-            const before = group[i];
-            if (!before.plugin.mustStayFirst) {
-              break;
-            }
-            i++;
-          }
-          group.splice(i, 0, hook);
-        } else {
-          group.push(hook);
-        }
-      }
-    }
+    pluginCandidates.push(plugin);
   };
   const testAppliesDuring = (plugin) => {
     const { appliesDuring } = plugin;
@@ -147,22 +93,131 @@ export const createPluginController = (
     );
   };
   const initPlugin = (plugin) => {
-    if (plugin.init) {
-      const initReturnValue = plugin.init(kitchenContext, plugin);
-      if (initReturnValue === false) {
-        return false;
-      }
-      if (typeof initReturnValue === "function" && !plugin.destroy) {
-        plugin.destroy = initReturnValue;
-      }
+    const { init } = plugin;
+    if (!init) {
+      return true;
+    }
+    const initReturnValue = init(kitchenContext, { plugin });
+    if (initReturnValue === false) {
+      return false;
+    }
+    if (typeof initReturnValue === "function" && !plugin.destroy) {
+      plugin.destroy = initReturnValue;
     }
     return true;
   };
-  const pushPlugin = (plugin) => {
-    addPlugin(plugin, { position: "end" });
+  const pushPlugin = (...args) => {
+    for (const arg of args) {
+      addPlugin(arg);
+    }
+    updateActivePlugins();
   };
-  const unshiftPlugin = (plugin) => {
-    addPlugin(plugin, { position: "start" });
+  const updateActivePlugins = () => {
+    // construct activePlugins and hooks according
+    // to the one present in candidates and their effects
+    // 1. active plugins is an empty array
+    // 2. all active effects are cleaned-up
+    // 3. all effects are re-activated if still relevant
+    // 4. hooks are precomputed according to plugin order
+
+    // 1.
+    activePlugins.length = 0;
+    // 2.
+    for (const { cleanup } of activeEffectSet) {
+      cleanup();
+    }
+    activeEffectSet.clear();
+    for (const pluginCandidate of pluginCandidates) {
+      const effect = pluginCandidate.effect;
+      if (!effect) {
+        activePlugins.push(pluginCandidate);
+        continue;
+      }
+    }
+    // 3.
+    for (const pluginCandidate of pluginCandidates) {
+      const effect = pluginCandidate.effect;
+      if (!effect) {
+        continue;
+      }
+      const returnValue = effect({
+        kitchenContext,
+        otherPlugins: activePlugins,
+      });
+      if (!returnValue) {
+        continue;
+      }
+      activePlugins.push(pluginCandidate);
+      activeEffectSet.add({
+        plugin: pluginCandidate,
+        cleanup: typeof returnValue === "function" ? returnValue : () => {},
+      });
+    }
+    // 4.
+    activePlugins.sort((a, b) => {
+      return pluginCandidates.indexOf(a) - pluginCandidates.indexOf(b);
+    });
+    hookSetMap.clear();
+    for (const activePlugin of activePlugins) {
+      for (const key of Object.keys(activePlugin)) {
+        if (key === "meta") {
+          const value = activePlugin[key];
+          if (typeof value !== "object" || value === null) {
+            console.warn(`plugin.meta must be an object, got ${value}`);
+            continue;
+          }
+          Object.assign(pluginsMeta, value);
+          // any extension/modification on plugin.meta
+          // won't be taken into account so we freeze object
+          // to throw in case it happen
+          Object.freeze(value);
+          continue;
+        }
+        if (
+          key === "name" ||
+          key === "appliesDuring" ||
+          key === "init" ||
+          key === "serverEvents" ||
+          key === "mustStayFirst" ||
+          key === "effect"
+        ) {
+          continue;
+        }
+        const isHook = HOOK_NAMES.includes(key);
+        if (!isHook) {
+          console.warn(
+            `Unexpected "${key}" property on "${activePlugin.name}" plugin`,
+          );
+          continue;
+        }
+        const hookName = key;
+        const hookValue = activePlugin[hookName];
+        if (hookValue) {
+          let hookSet = hookSetMap.get(hookName);
+          if (!hookSet) {
+            hookSet = new Set();
+            hookSetMap.set(hookName, hookSet);
+          }
+          const hook = {
+            plugin: activePlugin,
+            name: hookName,
+            value: hookValue,
+          };
+          // if (position === "start") {
+          //   let i = 0;
+          //   while (i < group.length) {
+          //     const before = group[i];
+          //     if (!before.plugin.mustStayFirst) {
+          //       break;
+          //     }
+          //     i++;
+          //   }
+          //   group.splice(i, 0, hook);
+          // } else {
+          hookSet.add(hook);
+        }
+      }
+    }
   };
 
   let lastPluginUsed = null;
@@ -215,75 +270,76 @@ export const createPluginController = (
   };
 
   const callHooks = (hookName, info, callback) => {
-    const hooks = hookGroups[hookName];
-    if (hooks) {
-      const setHookParams = (firstArg = info) => {
-        info = firstArg;
-      };
-      for (const hook of hooks) {
-        const returnValue = callHook(hook, info);
-        if (returnValue && callback) {
-          callback(returnValue, hook.plugin, setHookParams);
-        }
+    const hookSet = hookSetMap.get(hookName);
+    if (!hookSet) {
+      return;
+    }
+    const setHookParams = (firstArg = info) => {
+      info = firstArg;
+    };
+    for (const hook of hookSet) {
+      const returnValue = callHook(hook, info);
+      if (returnValue && callback) {
+        callback(returnValue, hook.plugin, setHookParams);
       }
     }
   };
   const callAsyncHooks = async (hookName, info, callback, options) => {
-    const hooks = hookGroups[hookName];
-    if (hooks) {
-      for (const hook of hooks) {
-        const returnValue = await callAsyncHook(hook, info, options);
-        if (returnValue && callback) {
-          await callback(returnValue, hook.plugin);
-        }
+    const hookSet = hookSetMap.get(hookName);
+    if (!hookSet) {
+      return;
+    }
+    for (const hook of hookSet) {
+      const returnValue = await callAsyncHook(hook, info, options);
+      if (returnValue && callback) {
+        await callback(returnValue, hook.plugin);
       }
     }
   };
 
   const callHooksUntil = (hookName, info) => {
-    const hooks = hookGroups[hookName];
-    if (hooks) {
-      for (const hook of hooks) {
-        const returnValue = callHook(hook, info);
-        if (returnValue) {
-          return returnValue;
-        }
+    const hookSet = hookSetMap.get(hookName);
+    if (!hookSet) {
+      return null;
+    }
+    for (const hook of hookSet) {
+      const returnValue = callHook(hook, info);
+      if (returnValue) {
+        return returnValue;
       }
     }
     return null;
   };
   const callAsyncHooksUntil = async (hookName, info, options) => {
-    const hooks = hookGroups[hookName];
-    if (!hooks) {
+    const hookSet = hookSetMap.get(hookName);
+    if (!hookSet) {
       return null;
     }
-    if (hooks.length === 0) {
+    if (hookSet.size === 0) {
       return null;
     }
+    const iterator = hookSet.values()[Symbol.iterator]();
     let result;
-    let index = 0;
     const visit = async () => {
-      if (index >= hooks.length) {
+      const { done, value: hook } = iterator.next();
+      if (done) {
         return;
       }
-      const hook = hooks[index];
       const returnValue = await callAsyncHook(hook, info, options);
       if (returnValue) {
         result = returnValue;
         return;
       }
-      index++;
       await visit();
     };
-    await visit(0);
+    await visit();
     return result;
   };
 
   return {
     pluginsMeta,
-    plugins,
+    activePlugins,
     pushPlugin,
-    unshiftPlugin,
     getHookFunction,
     callHook,
     callAsyncHook,

package/src/plugins/plugins.js

@@ -65,8 +65,8 @@ export const getCorePlugins = ({
     jsenvPluginReferenceAnalysis(referenceAnalysis),
     ...(injections ? [jsenvPluginInjections(injections)] : []),
     jsenvPluginTranspilation(transpilation),
+    // "jsenvPluginInlining" must be very soon because all other plugins will react differently once they see the file is inlined
     ...(inlining ? [jsenvPluginInlining()] : []),
-    ...(supervisor ? [jsenvPluginSupervisor(supervisor)] : []), // after inline as it needs inline script to be cooked
 
     /* When resolving references the following applies by default:
        - http urls are resolved by jsenvPluginHttpUrls
@@ -80,7 +80,6 @@ export const getCorePlugins = ({
       magicDirectoryIndex,
       directoryListingUrlMocks,
     }),
-
     {
       name: "jsenv:resolve_root_as_main",
       appliesDuring: "*",
@@ -99,12 +98,14 @@ export const getCorePlugins = ({
       : []),
     jsenvPluginWebResolution(),
     jsenvPluginDirectoryReferenceEffect(directoryReferenceEffect),
-
     jsenvPluginVersionSearchParam(),
+
+    // "jsenvPluginSupervisor" MUST be after "jsenvPluginInlining" as it needs inline script to be cooked
+    ...(supervisor ? [jsenvPluginSupervisor(supervisor)] : []),
+
     jsenvPluginCommonJsGlobals(),
     jsenvPluginImportMetaScenarios(),
     ...(scenarioPlaceholders ? [jsenvPluginGlobalScenarios()] : []),
-
     jsenvPluginNodeRuntime({ runtimeCompat }),
 
     jsenvPluginImportMetaHot(),

package/src/plugins/protocol_file/client/assets/home.svg

@@ -0,0 +1,6 @@
+<svg id="root" fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="30.4 23.47 40.05 45.63">
+    <path d="M32.5,69.1c-0.6,0-1.1-0.2-1.4-0.5c-0.7-0.6-0.7-1.5-0.7-1.8V41.1h4v24h9v4H32.9C32.8,69.1,32.6,69.1,32.5,69.1z" />
+    <path d="M67.8,69.1c-0.2,0-0.3,0-0.5,0c-0.1,0-0.1,0-0.2,0H56.4v-4h10v-23h4v24.7c0,0.6-0.3,1.2-0.7,1.7  C69.1,69,68.3,69.1,67.8,69.1z" />
+    <path d="M68.4,44.1c-0.5,0-1-0.2-1.3-0.5L50,28.2L33.7,42.6c-0.8,0.7-2.1,0.7-2.8-0.2c-0.7-0.8-0.7-2.1,0.2-2.8L48.7,24  c0.8-0.7,1.9-0.7,2.7,0l18.4,16.6c0.8,0.7,0.9,2,0.1,2.8C69.5,43.8,68.9,44.1,68.4,44.1z" />
+    <path d="M58.4,69.1h-4v-13h-8v13h-4v-15c0-1.1,0.9-2,2-2h12c1.1,0,2,0.9,2,2V69.1z" />
+</svg>

package/src/plugins/protocol_file/client/directory_listing.css

@@ -0,0 +1,190 @@
+html,
+body,
+h1,
+div,
+p,
+ul,
+li,
+a,
+p,
+button {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+/* ERROR MESSAGE */
+.error_message {
+  background-color: #fce4e4;
+  border: 1px solid #fcc2c3;
+  padding: 1.5em 1.2em;
+  margin: 1em;
+  display: block;
+}
+.error_text {
+  color: #853611;
+  font-weight: bold;
+  text-shadow: 1px 1px rgba(250, 250, 250, 0.3);
+}
+.hint_message {
+  background-color: lightblue;
+  border: 1px solid #fcc2c3;
+  padding: 1.5em 1.2em;
+  margin: 1em;
+  display: block;
+}
+.hint_text {
+  color: black;
+  font-weight: bold;
+  line-height: 2em;
+  text-shadow: 1px 1px rgba(250, 250, 250, 0.3);
+}
+
+/* NAV */
+.nav {
+  font-size: 16px;
+  font-weight: bold;
+  margin: 20px 25px 15px 25px;
+  display: flex;
+  gap: 0.3em;
+}
+.nav_item {
+  display: flex;
+  align-items: center;
+}
+.nav_item_icon {
+  display: flex;
+  width: 1em;
+  height: 1em;
+  margin-right: 0.25em;
+  color: #f1f1f1;
+}
+a.nav_item_icon {
+  text-decoration: none;
+}
+.nav_item_text {
+  position: relative;
+  color: inherit;
+}
+a.nav_item_text {
+  text-decoration: none;
+}
+.nav_item[data-404] .nav_item_text {
+  background-color: yellow;
+  color: #853611;
+}
+.file_path_bad {
+  text-decoration-line: underline;
+  text-decoration-color: red;
+  text-decoration-style: wavy;
+}
+.nav_item_badge_404 {
+  color: #853611;
+  text-align: center;
+  background-color: yellow;
+  border-radius: 5px;
+  padding: 0.2em 0.1em;
+  font-size: 0.8em;
+  margin-right: 0.3em;
+}
+
+/* CONTENT */
+.directory_empty_message {
+  margin: 1em;
+  padding: 0.5em;
+  color: #bbbbbb;
+}
+.directory_content {
+  margin: 10px 15px 10px 15px;
+  list-style-type: none;
+  border-radius: 3px;
+}
+.directory_content_item {
+  display: flex;
+  position: relative;
+  padding: 10px 15px 10px 15px;
+  font-size: 15px;
+  min-height: 19px;
+  box-sizing: border-box;
+  align-items: center;
+}
+.directory_content_item_link {
+  display: flex;
+  flex: 1;
+  gap: 10px;
+  align-items: center;
+  text-decoration: none;
+}
+.directory_content_item_icon {
+  width: 15px;
+  aspect-ratio: 1/1;
+  display: flex;
+  color: #f1f1f1;
+}
+.directory_content_item_icon img {
+  width: 100%;
+}
+.directory_content_item_text {
+  display: flex;
+}
+.directory_content_item:last-child {
+  border-bottom: none;
+  padding-bottom: 10px;
+}
+.directory_content_item_arrow {
+  display: flex;
+  color: #666666;
+  height: 10px;
+  stroke-width: 15%;
+}
+
+body[data-theme="dark"] {
+  background: #121212;
+}
+body[data-theme="light"] {
+  background: #f1f1f1;
+}
+body[data-theme="dark"] .nav_item {
+  color: #999999;
+}
+body[data-theme="dark"] .nav_item[data-current] {
+  color: #f1f1f1;
+}
+body[data-theme="light"] .nav_item {
+  color: #000000;
+}
+body[data-theme="dark"] .directory_separator {
+  color: #666666;
+}
+body[data-theme="light"] .directory_separator {
+  color: #999999;
+}
+body[data-theme="dark"] .directory_content {
+  background: #1e1e1e;
+}
+body[data-theme="light"] .directory_content {
+  background: #fefefe;
+}
+body[data-theme="dark"] .directory_content_item {
+  border-bottom: 1px solid #121212;
+}
+body[data-theme="light"] .directory_content_item {
+  border-bottom: 1px solid #f1f1f1;
+}
+body[data-theme="dark"] .directory_content_item[data-type="dir"]::before {
+  border-top: 2px solid #666666;
+  border-right: 2px solid #666666;
+}
+body[data-theme="light"] .directory_content_item[data-type="file"]::before {
+  border-top: 2px solid #999999;
+  border-right: 2px solid #999999;
+}
+body[data-theme="dark"] .directory_content_item a {
+  color: #ffffff;
+}
+body[data-theme="light"] .directory_content_item a {
+  color: #000000;
+}

package/src/plugins/protocol_file/client/directory_listing.html

@@ -0,0 +1,18 @@
+<!doctype html>
+<html>
+  <head>
+    <title>Directory explorer</title>
+    <meta charset="utf-8" />
+    <link rel="icon" href="data:," />
+    <link rel="stylesheet" href="./directory_listing.css" />
+  </head>
+
+  <body data-theme="dark">
+    <div id="root"></div>
+    <script>
+      // eslint-disable-next-line no-undef
+      window.DIRECTORY_LISTING = __DIRECTORY_LISTING__;
+    </script>
+    <script type="module" src="./directory_listing.jsx"></script>
+  </body>
+</html>