@jsenv/core 25.4.0 → 25.4.4

package/src/internal/compiling/jsenvCompilerForHtml.js

@@ -139,7 +139,7 @@ export const compileHtml = async ({
       addHtmlMutation,
     })
   }
-  await visitImportmapScript({
+  await visitImportmapScripts({
     logger,
     url,
     compiledUrl,
@@ -245,7 +245,7 @@ const visitRessourceHints = async ({ ressourceHints, addHtmlMutation }) => {
   )
 }
 
-const visitImportmapScript = async ({
+const visitImportmapScripts = async ({
   logger,
   url,
   compiledUrl,
@@ -265,14 +265,15 @@ const visitImportmapScript = async ({
     const type = typeAttribute ? typeAttribute.value : "application/javascript"
     return type === "importmap"
   })
+  const jsenvImportmap = getDefaultImportmap(compiledUrl, {
+    projectDirectoryUrl,
+    compileDirectoryUrl,
+  })
+
   // in case there is no importmap, force the presence
   // so that '@jsenv/core/' are still remapped
   if (importmapScripts.length === 0) {
-    const defaultImportMap = getDefaultImportmap(compiledUrl, {
-      projectDirectoryUrl,
-      compileDirectoryUrl,
-    })
-    const defaultImportMapAsText = JSON.stringify(defaultImportMap, null, "  ")
+    const defaultImportMapAsText = JSON.stringify(jsenvImportmap, null, "  ")
     onHtmlImportmapInfo({
       url: compiledUrl,
       text: defaultImportMapAsText,
@@ -324,6 +325,7 @@ const visitImportmapScript = async ({
       )
       importmap = {}
     }
+    importmap = composeTwoImportMaps(jsenvImportmap, importmap)
     const importmapAsText = JSON.stringify(importmap, null, "  ")
     onHtmlImportmapInfo({
       url: importmapUrl,
@@ -343,10 +345,6 @@ const visitImportmapScript = async ({
     return
   }
 
-  const jsenvImportmap = getDefaultImportmap(compiledUrl, {
-    projectDirectoryUrl,
-    compileDirectoryUrl,
-  })
   const htmlImportmap = JSON.parse(
     getHtmlNodeTextNode(firstImportmapScript).value,
   )

package/src/internal/compiling/jsenv_directory/comparison_utils.js

@@ -20,5 +20,8 @@ export const sameValueInTwoObjects = (object, secondObject) => {
 }
 
 export const sameValuesInTwoArrays = (array, secondArray) => {
-  return array.every((value) => secondArray.includes(value))
+  return (
+    array.length === secondArray.length &&
+    array.every((value) => secondArray.includes(value))
+  )
 }

package/src/internal/compiling/startCompileServer.js

@@ -289,6 +289,7 @@ export const startCompileServer = async ({
               sourcemapMappingFileInfo.url,
               projectDirectoryUrl,
             ),
+            availableCompileIds: Object.keys(jsenvDirectory.compileDirectories),
           },
           null,
           "  ",

package/src/internal/dev_server/toolbar/compilation/toolbar.compilation.js

@@ -92,7 +92,9 @@ export const renderCompilationInToolbar = ({ compileGroup }) => {
           ? "mismatch"
           : actualCompileId
           ? "source"
-          : "compiled",
+          : expectedCompiledId
+          ? "compiled"
+          : "force",
       })
       if (filesCompilation === "yes") {
         document.querySelector(
@@ -106,7 +108,12 @@ export const renderCompilationInToolbar = ({ compileGroup }) => {
       filesCompilationRootNode.querySelector(
         "a.link_to_compiled_files",
       ).onclick = () => {
-        window.parent.location.href = `/${jsenvDirectoryRelativeUrl}${compileId}/${compileGroup.fileRelativeUrl}`
+        window.parent.location.href = `/${jsenvDirectoryRelativeUrl}${expectedCompiledId}/${compileGroup.fileRelativeUrl}`
+      }
+      filesCompilationRootNode.querySelector(
+        "a.link_to_compilation_forced_files",
+      ).onclick = () => {
+        window.parent.location.href = `/${jsenvDirectoryRelativeUrl}force/${compileGroup.fileRelativeUrl}`
       }
       filesCompilationRootNode.querySelector(
         "a.link_to_appropriate_files",

package/src/internal/dev_server/toolbar/toolbar.html

@@ -460,6 +460,12 @@
                       href="javascript:void(0);"
                       >Switch to compiled files</a
                     >
+                    <a
+                      data-when="compilation_link:force"
+                      class="link_to_compilation_forced_files"
+                      href="javascript:void(0);"
+                      >Force compilation</a
+                    >
                   </div>
                 </div>
               </div>

package/src/internal/dev_server/toolbar/toolbar.injector.js

@@ -1,3 +1,4 @@
+import { fetchExploringJson } from "@jsenv/core/src/internal/dev_server/exploring/fetchExploringJson.js"
 import { setAttributes, setStyles } from "./util/dom.js"
 
 // eslint-disable-next-line no-undef
@@ -12,7 +13,7 @@ const injectToolbar = async () => {
       window.requestAnimationFrame(resolve)
     }
   })
-
+  const exploringJSON = await fetchExploringJson()
   const placeholder = getToolbarPlaceholder()
 
   const iframe = document.createElement("iframe")
@@ -36,13 +37,20 @@ const injectToolbar = async () => {
     "border": "none",
   })
   const iframeLoadedPromise = iframeToLoadedPromise(iframe)
-  const jsenvToolbarHtmlServerUrl = `/${TOOLBAR_BUILD_RELATIVE_URL}`
+  const jsenvCoreDirectoryServerUrl = new URL(
+    exploringJSON.jsenvCoreDirectoryRelativeUrl,
+    document.location.origin,
+  ).href
+  const jsenvToolbarHtmlServerUrl = new URL(
+    TOOLBAR_BUILD_RELATIVE_URL,
+    jsenvCoreDirectoryServerUrl,
+  )
   // set iframe src BEFORE putting it into the DOM (prevent firefox adding an history entry)
   iframe.setAttribute("src", jsenvToolbarHtmlServerUrl)
   placeholder.parentNode.replaceChild(iframe, placeholder)
 
   addToolbarEventCallback(iframe, "toolbar_ready", () => {
-    sendCommandToToolbar(iframe, "renderToolbar")
+    sendCommandToToolbar(iframe, "renderToolbar", { exploringJSON })
   })
 
   await iframeLoadedPromise

package/src/internal/dev_server/toolbar/toolbar.main.js

@@ -1,7 +1,6 @@
 import { urlIsInsideOf } from "@jsenv/filesystem/src/urlIsInsideOf.js"
 import { urlToRelativeUrl } from "@jsenv/filesystem/src/urlToRelativeUrl.js"
 
-import { fetchExploringJson } from "../exploring/fetchExploringJson.js"
 import { startJavaScriptAnimation } from "../toolbar/util/animation.js"
 import "./focus/toolbar.focus.js"
 import {
@@ -25,12 +24,11 @@ import { makeToolbarResponsive } from "./responsive/toolbar.responsive.js"
 
 const toolbarVisibilityPreference = createPreference("toolbar")
 
-const renderToolbar = async () => {
+const renderToolbar = async ({ exploringJSON }) => {
   const executedFileCompiledUrl = window.parent.location.href
   const compileServerOrigin = window.parent.location.origin
   // this should not block the whole toolbar rendering + interactivity
-  const exploringConfig = await fetchExploringJson()
-  const { jsenvDirectoryRelativeUrl, livereloading } = exploringConfig
+  const { jsenvDirectoryRelativeUrl, livereloading } = exploringJSON
   const compileGroup = getCompileGroup({
     executedFileCompiledUrl,
     jsenvDirectoryRelativeUrl,
@@ -168,25 +166,24 @@ const getCompileGroup = ({
   jsenvDirectoryRelativeUrl,
   compileServerOrigin,
 }) => {
-  const outDirectoryServerUrl = String(
-    new URL(jsenvDirectoryRelativeUrl, compileServerOrigin),
-  )
-  if (urlIsInsideOf(executedFileCompiledUrl, outDirectoryServerUrl)) {
+  const jsenvDirectoryServerUrl = new URL(
+    jsenvDirectoryRelativeUrl,
+    compileServerOrigin,
+  ).href
+  if (urlIsInsideOf(executedFileCompiledUrl, jsenvDirectoryServerUrl)) {
     const afterCompileDirectory = urlToRelativeUrl(
       executedFileCompiledUrl,
-      outDirectoryServerUrl,
+      jsenvDirectoryServerUrl,
     )
     const slashIndex = afterCompileDirectory.indexOf("/")
     const fileRelativeUrl = afterCompileDirectory.slice(slashIndex + 1)
     return {
       fileRelativeUrl,
-      jsenvDirectoryRelativeUrl,
       compileId: afterCompileDirectory.slice(0, slashIndex),
     }
   }
   return {
     fileRelativeUrl: new URL(executedFileCompiledUrl).pathname.slice(1),
-    jsenvDirectoryRelativeUrl,
     compileId: null,
   }
 }
@@ -228,13 +225,12 @@ const sendEventToParent = (name, data) => {
 }
 
 window.toolbar = {
-  render: renderToolbar,
   show: showToolbar,
   hide: () => hideToolbar(),
 }
 
-addExternalCommandCallback("renderToolbar", () => {
-  renderToolbar()
+addExternalCommandCallback("renderToolbar", (data) => {
+  renderToolbar(data)
 })
 addExternalCommandCallback("showToolbar", () => {
   showToolbar()

package/src/internal/features/browser_feature_detection/browser_feature_detection.js

@@ -14,8 +14,11 @@ export const scanBrowserRuntimeFeatures = async ({
   forceSource = false,
 } = {}) => {
   const jsenvCompileProfileUrl = "/__jsenv_compile_profile__"
-  const { jsenvDirectoryRelativeUrl, inlineImportMapIntoHTML } =
-    await fetchJson(jsenvCompileProfileUrl)
+  const {
+    jsenvDirectoryRelativeUrl,
+    inlineImportMapIntoHTML,
+    availableCompileIds,
+  } = await fetchJson(jsenvCompileProfileUrl)
   const { name, version } = detectBrowser()
   const featuresReport = await detectSupportedFeatures({
     coverageHandledFromOutside,
@@ -42,9 +45,10 @@ export const scanBrowserRuntimeFeatures = async ({
   return {
     jsenvDirectoryRelativeUrl,
     inlineImportMapIntoHTML,
+    availableCompileIds,
+    runtimeReport,
     compileProfile,
     compileId,
-    runtimeReport,
   }
 }
 

package/src/internal/import-resolution/importmap_default.js

@@ -18,7 +18,6 @@ export const getDefaultImportmap = (
     jsenvCoreDirectoryUrl,
     projectDirectoryUrl,
   )
-
   let jsenvCoreUrl
   if (compileDirectoryUrl && urlIsInsideOf(url, compileDirectoryUrl)) {
     jsenvCoreUrl = resolveUrl(
@@ -28,25 +27,11 @@ export const getDefaultImportmap = (
   } else {
     jsenvCoreUrl = jsenvCoreDirectoryUrl
   }
-
+  const jsenvCoreRelativeUrl = urlToRelativeUrl(jsenvCoreUrl, url)
   const importmap = {
     imports: {
-      "@jsenv/core/": makeRelativeMapping(jsenvCoreUrl, url),
+      "@jsenv/core/": `./${jsenvCoreRelativeUrl}`,
     },
   }
   return importmap
 }
-
-// this function just here to ensure relative urls starts with './'
-// so that importmap do not consider them as bare specifiers
-const makeRelativeMapping = (url, baseUrl) => {
-  const relativeUrl = urlToRelativeUrl(url, baseUrl)
-
-  if (urlIsInsideOf(url, baseUrl)) {
-    if (relativeUrl.startsWith("../")) return relativeUrl
-    if (relativeUrl.startsWith("./")) return relativeUrl
-    return `./${relativeUrl}`
-  }
-
-  return relativeUrl
-}

package/src/internal/node_launcher/createControllableNodeProcess.js

@@ -277,7 +277,6 @@ export const createControllableNodeProcess = async ({
 
 const sendToProcess = async (childProcess, type, data) => {
   const source = uneval(data, { functionAllowed: true })
-
   return new Promise((resolve, reject) => {
     childProcess.send({ type, data: source }, (error) => {
       if (error) {
@@ -295,12 +294,10 @@ const installProcessOutputListener = (childProcess, callback) => {
     callback({ type: "log", text: String(chunk) })
   }
   childProcess.stdout.on("data", stdoutDataCallback)
-
   const stdErrorDataCallback = (chunk) => {
     callback({ type: "error", text: String(chunk) })
   }
   childProcess.stderr.on("data", stdErrorDataCallback)
-
   return () => {
     childProcess.stdout.removeListener("data", stdoutDataCallback)
     childProcess.stderr.removeListener("data", stdoutDataCallback)

package/src/internal/node_runtime/nodeControllableFile.mjs

@@ -59,8 +59,7 @@ const sendActionFailed = (error) => {
   sendToParent(
     ACTION_RESPONSE_EVENT_NAME,
     // process.send algorithm does not send non enumerable values
-    // because it works with JSON.stringify I guess so use uneval
-
+    // so use @jsenv/uneval
     uneval(
       {
         status: ACTION_RESPONSE_STATUS_FAILED,
@@ -91,7 +90,6 @@ const sendToParent = (type, data) => {
   if (!process.connected) {
     return
   }
-
   // this can keep process alive longer than expected
   // when source is a long string.
   // It means node process may stay alive longer than expected
@@ -111,11 +109,9 @@ const onceProcessMessage = (type, callback) => {
       callback(eval(`(${event.data})`))
     }
   }
-
   const removeListener = () => {
     process.removeListener("message", listener)
   }
-
   process.on("message", listener)
   return removeListener
 }

package/src/internal/redirector/redirector.html

@@ -13,10 +13,12 @@
       import { scanBrowserRuntimeFeatures } from "../features/browser_feature_detection/browser_feature_detection.js"
 
       const redirect = async () => {
-        const redirectTarget = new URLSearchParams(window.location.search).get(
-          "redirect",
-        )
-        const browserRuntimeProfile = await scanBrowserRuntimeFeatures()
+        const searchParams = new URLSearchParams(window.location.search)
+        const redirectTarget = searchParams.get("redirect")
+        const forceCompilation = searchParams.get("force_compilation")
+        const browserRuntimeProfile = await scanBrowserRuntimeFeatures({
+          forceCompilation: forceCompilation === "1",
+        })
         const href = `${getDirectoryUrl(
           browserRuntimeProfile,
         )}${redirectTarget}`

package/dist/toolbar_injector/toolbar_injector_978bbd14.js

@@ -1,267 +0,0 @@
-(function () {
-  'use strict';
-
-  var nativeTypeOf = function nativeTypeOf(obj) {
-    return typeof obj;
-  };
-
-  var customTypeOf = function customTypeOf(obj) {
-    return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
-  };
-
-  var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? nativeTypeOf : customTypeOf;
-
-  var setStyles = function setStyles(element, styles) {
-    var elementStyle = element.style;
-    var restoreStyles = Object.keys(styles).map(function (styleName) {
-      var restore;
-
-      if (styleName in elementStyle) {
-        var currentStyle = elementStyle[styleName];
-
-        restore = function restore() {
-          elementStyle[styleName] = currentStyle;
-        };
-      } else {
-        restore = function restore() {
-          delete elementStyle[styleName];
-        };
-      }
-
-      elementStyle[styleName] = styles[styleName];
-      return restore;
-    });
-    return function () {
-      restoreStyles.forEach(function (restore) {
-        return restore();
-      });
-    };
-  };
-  var setAttributes = function setAttributes(element, attributes) {
-    Object.keys(attributes).forEach(function (name) {
-      element.setAttribute(name, attributes[name]);
-    });
-  };
-
-  function _await(value, then, direct) {
-    if (direct) {
-      return then ? then(value) : value;
-    }
-
-    if (!value || !value.then) {
-      value = Promise.resolve(value);
-    }
-
-    return then ? value.then(then) : value;
-  }
-
-  var TOOLBAR_BUILD_RELATIVE_URL = "dist/toolbar/toolbar_d3a918a4.html";
-
-  function _async(f) {
-    return function () {
-      for (var args = [], i = 0; i < arguments.length; i++) {
-        args[i] = arguments[i];
-      }
-
-      try {
-        return Promise.resolve(f.apply(this, args));
-      } catch (e) {
-        return Promise.reject(e);
-      }
-    };
-  }
-
-  var jsenvLogoSvgUrl = new URL("assets/jsenv-logo_188b9ca6.svg", document.currentScript && document.currentScript.src || document.baseURI);
-
-  var injectToolbar = _async(function () {
-    return _await(new Promise(function (resolve) {
-      if (window.requestIdleCallback) {
-        window.requestIdleCallback(resolve, {
-          timeout: 400
-        });
-      } else {
-        window.requestAnimationFrame(resolve);
-      }
-    }), function () {
-      var placeholder = getToolbarPlaceholder();
-      var iframe = document.createElement("iframe");
-      setAttributes(iframe, {
-        tabindex: -1,
-        // sandbox: "allow-forms allow-modals allow-pointer-lock allow-popups allow-presentation allow-same-origin allow-scripts allow-top-navigation-by-user-activation",
-        // allow: "accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; microphone; midi; payment; vr",
-        allowtransparency: true
-      });
-      setStyles(iframe, {
-        "position": "fixed",
-        "zIndex": 1000,
-        "bottom": 0,
-        "left": 0,
-        "width": "100%",
-        "height": 0,
-
-        /* ensure toolbar children are not focusable when hidden */
-        "visibility": "hidden",
-        "transition-duration": "300ms",
-        "transition-property": "height, visibility",
-        "border": "none"
-      });
-      var iframeLoadedPromise = iframeToLoadedPromise(iframe);
-      var jsenvToolbarHtmlServerUrl = "/".concat(TOOLBAR_BUILD_RELATIVE_URL); // set iframe src BEFORE putting it into the DOM (prevent firefox adding an history entry)
-
-      iframe.setAttribute("src", jsenvToolbarHtmlServerUrl);
-      placeholder.parentNode.replaceChild(iframe, placeholder);
-      addToolbarEventCallback(iframe, "toolbar_ready", function () {
-        sendCommandToToolbar(iframe, "renderToolbar");
-      });
-      return _await(iframeLoadedPromise, function () {
-        iframe.removeAttribute("tabindex");
-        var div = document.createElement("div");
-        div.innerHTML = "\n<div id=\"jsenv-toolbar-trigger\">\n  <svg id=\"jsenv-toolbar-trigger-icon\">\n    <use xlink:href=\"".concat(jsenvLogoSvgUrl, "#jsenv-logo\"></use>\n  </svg>\n  <style>\n    #jsenv-toolbar-trigger {\n      display: block;\n      overflow: hidden;\n      position: fixed;\n      z-index: 1000;\n      bottom: -32px;\n      right: 20px;\n      height: 40px;\n      width: 40px;\n      padding: 0;\n      margin: 0;\n      border-radius: 5px 5px 0 0;\n      border: 1px solid rgba(0, 0, 0, 0.33);\n      border-bottom: none;\n      box-shadow: 0px 0px 6px 2px rgba(0, 0, 0, 0.46);\n      background: transparent;\n      text-align: center;\n      transition: 600ms;\n    }\n\n    #jsenv-toolbar-trigger:hover {\n      cursor: pointer;\n    }\n\n    #jsenv-toolbar-trigger[data-expanded] {\n      bottom: 0;\n    }\n\n    #jsenv-toolbar-trigger-icon {\n      width: 35px;\n      height: 35px;\n      opacity: 0;\n      transition: 600ms;\n    }\n\n    #jsenv-toolbar-trigger[data-expanded] #jsenv-toolbar-trigger-icon {\n      opacity: 1;\n    }\n  </style>\n</div>");
-        var toolbarTrigger = div.firstElementChild;
-        iframe.parentNode.appendChild(toolbarTrigger);
-        var timer;
-
-        toolbarTrigger.onmouseenter = function () {
-          toolbarTrigger.setAttribute("data-animate", "");
-          timer = setTimeout(expandToolbarTrigger, 500);
-        };
-
-        toolbarTrigger.onmouseleave = function () {
-          clearTimeout(timer);
-          collapseToolbarTrigger();
-        };
-
-        toolbarTrigger.onfocus = function () {
-          toolbarTrigger.removeAttribute("data-animate");
-          expandToolbarTrigger();
-        };
-
-        toolbarTrigger.onblur = function () {
-          toolbarTrigger.removeAttribute("data-animate");
-          clearTimeout(timer);
-          collapseToolbarTrigger();
-        };
-
-        toolbarTrigger.onclick = function () {
-          sendCommandToToolbar(iframe, "showToolbar");
-        };
-
-        var showToolbarTrigger = function showToolbarTrigger() {
-          toolbarTrigger.style.display = "block";
-        };
-
-        var hideToolbarTrigger = function hideToolbarTrigger() {
-          toolbarTrigger.style.display = "none";
-        };
-
-        var expandToolbarTrigger = function expandToolbarTrigger() {
-          toolbarTrigger.setAttribute("data-expanded", "");
-        };
-
-        var collapseToolbarTrigger = function collapseToolbarTrigger() {
-          toolbarTrigger.removeAttribute("data-expanded", "");
-        };
-
-        hideToolbarTrigger();
-        addToolbarEventCallback(iframe, "toolbar-visibility-change", function (visible) {
-          if (visible) {
-            hideToolbarTrigger();
-          } else {
-            showToolbarTrigger();
-          }
-        });
-        return iframe;
-      });
-    });
-  });
-
-  var addToolbarEventCallback = function addToolbarEventCallback(iframe, eventName, callback) {
-    var messageEventCallback = function messageEventCallback(messageEvent) {
-      var data = messageEvent.data;
-
-      if (_typeof(data) !== "object") {
-        return;
-      }
-
-      var __jsenv__ = data.__jsenv__;
-
-      if (!__jsenv__) {
-        return;
-      }
-
-      if (__jsenv__.event !== eventName) {
-        return;
-      }
-
-      callback(__jsenv__.data);
-    };
-
-    window.addEventListener("message", messageEventCallback, false);
-    return function () {
-      window.removeEventListener("message", messageEventCallback, false);
-    };
-  };
-
-  var sendCommandToToolbar = function sendCommandToToolbar(iframe, command) {
-    for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
-      args[_key - 2] = arguments[_key];
-    }
-
-    iframe.contentWindow.postMessage({
-      __jsenv__: {
-        command: command,
-        args: args
-      }
-    }, window.origin);
-  };
-
-  var getToolbarPlaceholder = function getToolbarPlaceholder() {
-    var placeholder = queryPlaceholder();
-
-    if (placeholder) {
-      if (document.body.contains(placeholder)) {
-        return placeholder;
-      } // otherwise iframe would not be visible because in <head>
-
-
-      console.warn("element with [data-jsenv-toolbar-placeholder] must be inside document.body");
-      return createTooolbarPlaceholder();
-    }
-
-    return createTooolbarPlaceholder();
-  };
-
-  var queryPlaceholder = function queryPlaceholder() {
-    return document.querySelector("[data-jsenv-toolbar-placeholder]");
-  };
-
-  var createTooolbarPlaceholder = function createTooolbarPlaceholder() {
-    var placeholder = document.createElement("span");
-    document.body.appendChild(placeholder);
-    return placeholder;
-  };
-
-  var iframeToLoadedPromise = function iframeToLoadedPromise(iframe) {
-    return new Promise(function (resolve) {
-      var onload = function onload() {
-        iframe.removeEventListener("load", onload, true);
-        resolve();
-      };
-
-      iframe.addEventListener("load", onload, true);
-    });
-  };
-
-  if (document.readyState === "complete") {
-    injectToolbar();
-  } else {
-    window.addEventListener("load", injectToolbar); // document.addEventListener("readystatechange", () => {
-    //   if (document.readyState === "complete") {
-    //     injectToolbar()
-    //   }
-    // })
-  }
-
-})();
-
-//# sourceMappingURL=toolbar_injector_978bbd14.js.map