@jsenv/core 25.0.0-alpha.0 → 25.0.0-alpha.1

package/dist/toolbar/{toolbar_412abb83.html → toolbar_04ba410c.html}

@@ -1290,6 +1290,8 @@ html[data-toolbar-visible] #toolbar-trigger {
 
   var importMapPromise = Promise.resolve();
   var importMap = { imports: {}, scopes: {}, depcache: {}, integrity: {} };
+  systemJSPrototype.importMap = importMap;
+  systemJSPrototype.baseUrl = baseUrl;
 
   // Scripts are processed immediately, on the first System.import, and on DOMReady.
   // Import map scripts are processed only once (by being marked) and in order for each phase.
@@ -1345,6 +1347,7 @@ html[data-toolbar-visible] #toolbar-trigger {
           return fetchPromise;
         }).then(function (text) {
           extendImportMap(importMap, text, script.src || baseUrl);
+          return importMap
         });
       }
     });
@@ -1359,6 +1362,7 @@ html[data-toolbar-visible] #toolbar-trigger {
     }
     resolveAndComposeImportMap(newMap, newMapUrl, importMap);
   }
+  System.extendImportMap = extendImportMap
 
   /*
    * Script instantiation loading
@@ -1512,23 +1516,33 @@ html[data-toolbar-visible] #toolbar-trigger {
    * Supports loading System.register in workers
    */
 
-  if (hasSelf && typeof importScripts === 'function')
+  if (hasSelf && typeof importScripts === 'function') {
     systemJSPrototype.instantiate = function (url) {
       var loader = this;
-      return Promise.resolve().then(function () {
-        importScripts(url);
+      return self.fetch(url, {
+        credentials: 'same-origin',
+      }).then(function (response) {
+        if (!response.ok) {
+          throw Error(errMsg(7,  [response.status, response.statusText, url].join(', ') ));
+        }
+        return response.text()
+      }).then(function (source) {
+        if (source.indexOf('//# sourceURL=') < 0) source += '\n//# sourceURL=' + url;
+        (0, eval)(source);
         return loader.getRegister(url);
-      });
+      })
     };
+  }
 
 }());
 
 (function(){
   var envGlobal = typeof self !== 'undefined' ? self : global;
   var System = envGlobal.System;
-  var register = System.register;
-  var registerRegistry = Object.create(null)
 
+  var registerRegistry = Object.create(null)
+  var register = System.register;
+  System.registerRegistry = registerRegistry;
   System.register = function (name, deps, declare) {
     if (typeof name !== 'string') return register.apply(this, arguments);
     var define = [deps, declare];
@@ -1558,6 +1572,87 @@ html[data-toolbar-visible] #toolbar-trigger {
     var result = registerRegistry[url] || register;
     return result;
   };
+}());
+
+(function () {
+  // worker or service worker
+  if (typeof WorkerGlobalScope === 'function' && self instanceof WorkerGlobalScope) {
+    var importMapFromParentPromise = new Promise((resolve) => {
+      var importmapMessageCallback = function (e) {
+        if (e.data === "__importmap_init__") {
+          self.removeEventListener("message", importmapMessageCallback)
+          e.ports[0].onmessage = (message) => {
+            resolve(message.data)
+          }
+          e.ports[0].postMessage('__importmap_request__')         
+        }
+      };
+      self.addEventListener("message", importmapMessageCallback)
+    })
+    // var prepareImport = System.prepareImport
+    System.prepareImport = function () {
+      return importMapFromParentPromise.then(function (importmap) {
+        System.extendImportMap(System.importMap, JSON.stringify(importmap), System.baseUrl)
+      })
+    }
+
+    // auto import first register
+    var messageEvents = []
+    var messageCallback = (event) => {
+      messageEvents.push(event)
+    }
+    self.addEventListener('message', messageCallback)
+    var register = System.register;
+    System.register = function(deps, declare) {
+      System.register = register;
+      System.registerRegistry[self.location.href] = [deps, declare];
+      System.import(self.location.href).then(() => {
+        self.removeEventListener('message', messageCallback)
+        messageEvents.forEach((messageEvent) => {
+          self.dispatchEvent(messageEvent)
+        })
+        messageEvents = null
+      })
+    }
+  }
+  else if (typeof window === 'object') {
+    var WorkerConstructor = window.Worker;
+    if (typeof WorkerConstructor === 'function') {
+      window.Worker = function (url, options) {
+        var worker = new WorkerConstructor(url, options);
+        var importmapChannel = new MessageChannel();
+        importmapChannel.port1.onmessage = function (message) {
+          System.prepareImport().then(function (importmap) {
+            message.target.postMessage(importmap);
+          });
+        }
+        worker.postMessage('__importmap_init__', [importmapChannel.port2]);
+        return worker
+      }
+    }
+
+    var serviceWorker = navigator.serviceWorker;
+    if (serviceWorker) {
+      var register =  serviceWorker.register;
+      serviceWorker.register = function(url, options) {
+        var registrationPromise = register.call(this, url, options);
+        registrationPromise.then(function(registration) {
+          var installing = registration.installing;
+          var waiting = registration.waiting;
+          var active = registration.active;
+          var worker = installing || waiting || active;
+          var importmapChannel = new MessageChannel();
+          importmapChannel.port1.onmessage = function (message) {
+            System.prepareImport().then(function (importmap) {
+              message.target.postMessage(importmap)
+            });
+          }
+          worker.postMessage('__importmap_init__', [importmapChannel.port2]);
+        })
+        return registrationPromise
+      }
+    }
+  }
 }());</script>
       </head>
   <body>
@@ -4125,16 +4220,16 @@ html[data-toolbar-visible] #toolbar-trigger {
             failFastOnFeatureDetection: failFastOnFeatureDetection,
             inlineImportMapIntoHTML: inlineImportMapIntoHTML
           }), function () {
-            return _await(pluginRequiredNamesFromGroupInfo(groupInfo, {
+            return _await(adjustMissingFeatureNames(groupInfo, {
               featuresReport: featuresReport,
               coverageHandledFromOutside: coverageHandledFromOutside
-            }), function (pluginRequiredNameArray) {
-              var canAvoidCompilation = customCompilerPatterns.length === 0 && pluginRequiredNameArray.length === 0 && featuresReport.importmap && featuresReport.dynamicImport && featuresReport.topLevelAwait;
+            }), function (missingFeatureNames) {
+              var canAvoidCompilation = customCompilerPatterns.length === 0 && missingFeatureNames.length === 0 && featuresReport.importmap && featuresReport.dynamicImport && featuresReport.topLevelAwait;
               return {
                 canAvoidCompilation: canAvoidCompilation,
                 featuresReport: featuresReport,
                 customCompilerPatterns: customCompilerPatterns,
-                pluginRequiredNameArray: pluginRequiredNameArray,
+                missingFeatureNames: missingFeatureNames,
                 inlineImportMapIntoHTML: inlineImportMapIntoHTML,
                 outDirectoryRelativeUrl: outDirectoryRelativeUrl,
                 compileId: compileId,
@@ -4145,17 +4240,17 @@ html[data-toolbar-visible] #toolbar-trigger {
         });
       });
 
-      var pluginRequiredNamesFromGroupInfo = _async$1(function (groupInfo, _ref3) {
+      var adjustMissingFeatureNames = _async$1(function (groupInfo, _ref3) {
         var featuresReport = _ref3.featuresReport,
             coverageHandledFromOutside = _ref3.coverageHandledFromOutside;
-        var pluginRequiredNameArray = groupInfo.pluginRequiredNameArray;
-        var requiredPluginNames = pluginRequiredNameArray.slice();
+        var missingFeatureNames = groupInfo.missingFeatureNames;
+        var missingFeatureNamesCopy = missingFeatureNames.slice();
 
-        var markPluginAsSupported = function markPluginAsSupported(name) {
-          var index = requiredPluginNames.indexOf(name);
+        var markAsSupported = function markAsSupported(name) {
+          var index = missingFeatureNamesCopy.indexOf(name);
 
           if (index > -1) {
-            requiredPluginNames.splice(index, 1);
+            missingFeatureNamesCopy.splice(index, 1);
           }
         }; // When instrumentation CAN be handed by playwright
         // https://playwright.dev/docs/api/class-chromiumcoverage#chromiumcoveragestartjscoverageoptions
@@ -4163,30 +4258,30 @@ html[data-toolbar-visible] #toolbar-trigger {
 
 
         if (coverageHandledFromOutside) {
-          markPluginAsSupported("transform-instrument");
+          markAsSupported("transform-instrument");
         }
 
         return _invoke(function () {
-          if (pluginRequiredNameArray.includes("transform-import-assertions")) {
+          if (missingFeatureNames.includes("transform-import-assertions")) {
             return _call$1(supportsJsonImportAssertions, function (jsonImportAssertions) {
               featuresReport.jsonImportAssertions = jsonImportAssertions;
               return _call$1(supportsCssImportAssertions, function (cssImportAssertions) {
                 featuresReport.cssImportAssertions = cssImportAssertions;
 
                 if (jsonImportAssertions && cssImportAssertions) {
-                  markPluginAsSupported("transform-import-assertions");
+                  markAsSupported("transform-import-assertions");
                 }
               });
             });
           }
         }, function () {
-          if (pluginRequiredNameArray.includes("new-stylesheet-as-jsenv-import")) {
+          if (missingFeatureNames.includes("new-stylesheet-as-jsenv-import")) {
             var newStylesheet = supportsNewStylesheet();
             featuresReport.newStylesheet = newStylesheet;
-            markPluginAsSupported("new-stylesheet-as-jsenv-import");
+            markAsSupported("new-stylesheet-as-jsenv-import");
           }
 
-          return requiredPluginNames;
+          return missingFeatureNamesCopy;
         });
       });
 
@@ -4361,7 +4456,7 @@ html[data-toolbar-visible] #toolbar-trigger {
           var canAvoidCompilation = _ref2.canAvoidCompilation,
               featuresReport = _ref2.featuresReport,
               customCompilerPatterns = _ref2.customCompilerPatterns,
-              pluginRequiredNameArray = _ref2.pluginRequiredNameArray,
+              missingFeatureNames = _ref2.missingFeatureNames,
               inlineImportMapIntoHTML = _ref2.inlineImportMapIntoHTML,
               outDirectoryRelativeUrl = _ref2.outDirectoryRelativeUrl,
               compileId = _ref2.compileId;
@@ -4377,7 +4472,7 @@ html[data-toolbar-visible] #toolbar-trigger {
                 missingOnly: true,
                 featuresReport: featuresReport,
                 customCompilerPatterns: customCompilerPatterns,
-                pluginRequiredNameArray: pluginRequiredNameArray,
+                missingFeatureNames: missingFeatureNames,
                 inlineImportMapIntoHTML: inlineImportMapIntoHTML
               })));
             };
@@ -4387,7 +4482,7 @@ html[data-toolbar-visible] #toolbar-trigger {
               window.alert("Source files (except html) can be executed directly in this browser because: ".concat(getBrowserSupportMessage({
                 featuresReport: featuresReport,
                 customCompilerPatterns: customCompilerPatterns,
-                pluginRequiredNameArray: pluginRequiredNameArray,
+                missingFeatureNames: missingFeatureNames,
                 inlineImportMapIntoHTML: inlineImportMapIntoHTML
               })));
             };
@@ -4397,7 +4492,7 @@ html[data-toolbar-visible] #toolbar-trigger {
               window.alert("Source files can be executed directly in this browser because: ".concat(getBrowserSupportMessage({
                 featuresReport: featuresReport,
                 customCompilerPatterns: customCompilerPatterns,
-                pluginRequiredNameArray: pluginRequiredNameArray,
+                missingFeatureNames: missingFeatureNames,
                 inlineImportMapIntoHTML: inlineImportMapIntoHTML
               })));
             };
@@ -4435,7 +4530,7 @@ html[data-toolbar-visible] #toolbar-trigger {
         var missingOnly = _ref3.missingOnly,
             featuresReport = _ref3.featuresReport,
             customCompilerPatterns = _ref3.customCompilerPatterns,
-            pluginRequiredNameArray = _ref3.pluginRequiredNameArray,
+            missingFeatureNames = _ref3.missingFeatureNames,
             inlineImportMapIntoHTML = _ref3.inlineImportMapIntoHTML;
         var parts = [];
 
@@ -4467,14 +4562,14 @@ html[data-toolbar-visible] #toolbar-trigger {
           parts.push("top level await is not supported");
         }
 
-        var pluginRequiredCount = pluginRequiredNameArray.length;
+        var missingFeatureCount = missingFeatureNames.length;
 
-        if (pluginRequiredCount === 0) {
+        if (missingFeatureCount === 0) {
           if (!missingOnly) {
-            parts.push("all plugins are natively supported");
+            parts.push("all features are natively supported");
           }
         } else {
-          parts.push("".concat(pluginRequiredCount, " plugins are mandatory: ").concat(pluginRequiredNameArray));
+          parts.push("".concat(missingFeatureCount, " features are missing: ").concat(missingFeatureNames));
         }
 
         var customCompilerCount = customCompilerPatterns.length;
@@ -4915,7 +5010,7 @@ html[data-toolbar-visible] #toolbar-trigger {
   };
 });
 
-//# sourceMappingURL=toolbar.main_a5ef2c60.js.map</script>
+//# sourceMappingURL=toolbar.main2_6c1b3d82.js.map</script>
   
 
 </body></html>

package/dist/toolbar_injector/asset-manifest.json

@@ -1,5 +1,5 @@
 {
   ".jsenv/build/best/src/internal/dev_server/toolbar/jsenv-logo.svg": "assets/jsenv-logo_188b9ca6.svg",
-  "toolbar_injector.js": "toolbar_injector_4f9c19e5.js",
-  "toolbar_injector.js.map": "toolbar_injector_4f9c19e5.js.map"
+  "toolbar_injector.js": "toolbar_injector_4a48bc53.js",
+  "toolbar_injector.js.map": "toolbar_injector_4a48bc53.js.map"
 }

package/dist/toolbar_injector/{toolbar_injector_4f9c19e5.js → toolbar_injector_4a48bc53.js}

@@ -746,7 +746,7 @@
     return then ? value.then(then) : value;
   }
 
-  var TOOLBAR_BUILD_RELATIVE_URL = "dist/toolbar/toolbar_412abb83.html";
+  var TOOLBAR_BUILD_RELATIVE_URL = "dist/toolbar/toolbar_04ba410c.html";
 
   function _call(body, then, direct) {
     if (direct) {
@@ -970,4 +970,4 @@
 
 })();
 
-//# sourceMappingURL=toolbar_injector_4f9c19e5.js.map
+//# sourceMappingURL=toolbar_injector_4a48bc53.js.map

package/dist/toolbar_injector/{toolbar_injector_4f9c19e5.js.map → toolbar_injector_4a48bc53.js.map}

@@ -1,6 +1,6 @@
 {
   "version": 3,
-  "file": "toolbar_injector_4f9c19e5.js",
+  "file": "toolbar_injector_4a48bc53.js",
   "sources": [
     "../../helpers/babel/typeof/typeof.js",
     "../../helpers/babel/defineProperty/defineProperty.js",
@@ -25,7 +25,7 @@
     "import { fetchUrl } from \"./fetch-browser.js\"\n\nexport const fetchJson = async (url, options = {}) => {\n  const response = await fetchUrl(url, options)\n  const object = await response.json()\n  return object\n}\n",
     "import { fetchJson } from \"../../browser_utils/fetchJson.js\"\n\nexport const fetchExploringJson = async ({ signal } = {}) => {\n  try {\n    const exploringInfo = await fetchJson(\"/.jsenv/exploring.json\", {\n      signal,\n    })\n    return exploringInfo\n  } catch (e) {\n    if (signal && signal.aborted && e.name === \"AbortError\") {\n      throw e\n    }\n    throw new Error(\n      `Cannot communicate with exploring server due to a network error\n--- error stack ---\n${e.stack}`,\n    )\n  }\n}\n",
     "export const updateIframeOverflowOnParentWindow = () => {\n  if (!window.parent) {\n    // can happen while parent iframe reloads\n    return\n  }\n\n  const aTooltipIsOpened =\n    document.querySelector(\"[data-tooltip-visible]\") ||\n    document.querySelector(\"[data-tooltip-auto-visible]\")\n  const settingsAreOpened = document.querySelector(\"#settings[data-active]\")\n\n  if (aTooltipIsOpened || settingsAreOpened) {\n    enableIframeOverflowOnParentWindow()\n  } else {\n    disableIframeOverflowOnParentWindow()\n  }\n}\n\nlet iframeOverflowEnabled = false\nconst enableIframeOverflowOnParentWindow = () => {\n  if (iframeOverflowEnabled) return\n  iframeOverflowEnabled = true\n\n  const iframe = getToolbarIframe()\n  const transitionDuration = iframe.style.transitionDuration\n  setStyles(iframe, { \"height\": \"100%\", \"transition-duration\": \"0ms\" })\n  if (transitionDuration) {\n    setTimeout(() => {\n      setStyles(iframe, { \"transition-duration\": transitionDuration })\n    })\n  }\n}\n\nconst disableIframeOverflowOnParentWindow = () => {\n  if (!iframeOverflowEnabled) return\n  iframeOverflowEnabled = false\n\n  const iframe = getToolbarIframe()\n  const transitionDuration = iframe.style.transitionDuration\n  setStyles(iframe, { \"height\": \"40px\", \"transition-duration\": \"0ms\" })\n  if (transitionDuration) {\n    setTimeout(() => {\n      setStyles(iframe, { \"transition-duration\": transitionDuration })\n    })\n  }\n}\n\nexport const getToolbarIframe = () => {\n  const iframes = Array.from(window.parent.document.querySelectorAll(\"iframe\"))\n  return iframes.find((iframe) => iframe.contentWindow === window)\n}\n\nexport const forceHideElement = (element) => {\n  element.setAttribute(\"data-force-hide\", \"\")\n}\n\nexport const removeForceHideElement = (element) => {\n  element.removeAttribute(\"data-force-hide\")\n}\n\nexport const setStyles = (element, styles) => {\n  const elementStyle = element.style\n  const restoreStyles = Object.keys(styles).map((styleName) => {\n    let restore\n    if (styleName in elementStyle) {\n      const currentStyle = elementStyle[styleName]\n      restore = () => {\n        elementStyle[styleName] = currentStyle\n      }\n    } else {\n      restore = () => {\n        delete elementStyle[styleName]\n      }\n    }\n\n    elementStyle[styleName] = styles[styleName]\n\n    return restore\n  })\n  return () => {\n    restoreStyles.forEach((restore) => restore())\n  }\n}\n\nexport const setAttributes = (element, attributes) => {\n  Object.keys(attributes).forEach((name) => {\n    element.setAttribute(name, attributes[name])\n  })\n}\n\nexport const getDocumentScroll = () => {\n  return {\n    x: document.documentElement.scrollLeft,\n    y: document.documentElement.scrollTop,\n  }\n}\n\nexport const toolbarSectionIsActive = (element) => {\n  return element.hasAttribute(\"data-active\")\n}\n\nexport const activateToolbarSection = (element) => {\n  element.setAttribute(\"data-active\", \"\")\n}\n\nexport const deactivateToolbarSection = (element) => {\n  element.removeAttribute(\"data-active\")\n}\n",
-    "import { fetchExploringJson } from \"@jsenv/core/src/internal/dev_server/exploring/fetchExploringJson.js\"\nimport { setAttributes, setStyles } from \"./util/dom.js\"\n\n// eslint-disable-next-line no-undef\nconst TOOLBAR_BUILD_RELATIVE_URL = \"dist/toolbar/toolbar_412abb83.html\"\nconst jsenvLogoSvgUrl = new URL(\"./jsenv-logo.svg\", import.meta.url)\n\nconst injectToolbar = async () => {\n  await new Promise((resolve) => {\n    if (window.requestIdleCallback) {\n      window.requestIdleCallback(resolve)\n    } else {\n      window.requestAnimationFrame(resolve)\n    }\n  })\n\n  const { jsenvDirectoryRelativeUrl } = await fetchExploringJson()\n  const jsenvDirectoryServerUrl = resolveUrl(\n    jsenvDirectoryRelativeUrl,\n    document.location.origin,\n  )\n\n  const placeholder = getToolbarPlaceholder()\n\n  const iframe = document.createElement(\"iframe\")\n  setAttributes(iframe, {\n    tabindex: -1,\n    // sandbox: \"allow-forms allow-modals allow-pointer-lock allow-popups allow-presentation allow-same-origin allow-scripts allow-top-navigation-by-user-activation\",\n    // allow: \"accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; microphone; midi; payment; vr\",\n    allowtransparency: true,\n  })\n  setStyles(iframe, {\n    \"position\": \"fixed\",\n    \"zIndex\": 1000,\n    \"bottom\": 0,\n    \"left\": 0,\n    \"width\": \"100%\",\n    \"height\": 0,\n    /* ensure toolbar children are not focusable when hidden */\n    \"visibility\": \"hidden\",\n    \"transition-duration\": \"300ms\",\n    \"transition-property\": \"height, visibility\",\n    \"border\": \"none\",\n  })\n  const iframeLoadedPromise = iframeToLoadedPromise(iframe)\n  const jsenvToolbarHtmlServerUrl = resolveUrl(\n    TOOLBAR_BUILD_RELATIVE_URL,\n    jsenvDirectoryServerUrl,\n  )\n  // set iframe src BEFORE putting it into the DOM (prevent firefox adding an history entry)\n  iframe.setAttribute(\"src\", jsenvToolbarHtmlServerUrl)\n  placeholder.parentNode.replaceChild(iframe, placeholder)\n\n  await iframeLoadedPromise\n  iframe.removeAttribute(\"tabindex\")\n\n  const div = document.createElement(\"div\")\n  div.innerHTML = `\n<div id=\"jsenv-toolbar-trigger\">\n  <svg id=\"jsenv-toolbar-trigger-icon\">\n    <use xlink:href=\"${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>`\n  const toolbarTrigger = div.firstElementChild\n  iframe.parentNode.appendChild(toolbarTrigger)\n\n  let timer\n  toolbarTrigger.onmouseenter = () => {\n    toolbarTrigger.setAttribute(\"data-animate\", \"\")\n    timer = setTimeout(expandToolbarTrigger, 500)\n  }\n  toolbarTrigger.onmouseleave = () => {\n    clearTimeout(timer)\n    collapseToolbarTrigger()\n  }\n  toolbarTrigger.onfocus = () => {\n    toolbarTrigger.removeAttribute(\"data-animate\")\n    expandToolbarTrigger()\n  }\n  toolbarTrigger.onblur = () => {\n    toolbarTrigger.removeAttribute(\"data-animate\")\n    clearTimeout(timer)\n    collapseToolbarTrigger()\n  }\n  toolbarTrigger.onclick = () => {\n    sendCommandToToolbar(iframe, \"showToolbar\")\n  }\n\n  const showToolbarTrigger = () => {\n    toolbarTrigger.style.display = \"block\"\n  }\n\n  const hideToolbarTrigger = () => {\n    toolbarTrigger.style.display = \"none\"\n  }\n\n  const expandToolbarTrigger = () => {\n    toolbarTrigger.setAttribute(\"data-expanded\", \"\")\n  }\n\n  const collapseToolbarTrigger = () => {\n    toolbarTrigger.removeAttribute(\"data-expanded\", \"\")\n  }\n\n  hideToolbarTrigger()\n  addToolbarEventCallback(iframe, \"toolbar-visibility-change\", (visible) => {\n    if (visible) {\n      hideToolbarTrigger()\n    } else {\n      showToolbarTrigger()\n    }\n  })\n  addToolbarEventCallback(iframe, \"toolbar_ready\", () => {\n    sendCommandToToolbar(iframe, \"renderToolbar\")\n  })\n\n  return iframe\n}\n\nconst addToolbarEventCallback = (iframe, eventName, callback) => {\n  const messageEventCallback = (messageEvent) => {\n    const { data } = messageEvent\n    if (typeof data !== \"object\") {\n      return\n    }\n    const { __jsenv__ } = data\n    if (!__jsenv__) {\n      return\n    }\n    if (__jsenv__.event !== eventName) {\n      return\n    }\n    callback(__jsenv__.data)\n  }\n\n  window.addEventListener(\"message\", messageEventCallback, false)\n  return () => {\n    window.removeEventListener(\"message\", messageEventCallback, false)\n  }\n}\n\nconst sendCommandToToolbar = (iframe, command, ...args) => {\n  iframe.contentWindow.postMessage(\n    {\n      __jsenv__: {\n        command,\n        args,\n      },\n    },\n    window.origin,\n  )\n}\n\nconst getToolbarPlaceholder = () => {\n  const placeholder = queryPlaceholder()\n  if (placeholder) {\n    if (document.body.contains(placeholder)) {\n      return placeholder\n    }\n    // otherwise iframe would not be visible because in <head>\n    console.warn(\n      \"element with [data-jsenv-toolbar-placeholder] must be inside document.body\",\n    )\n    return createTooolbarPlaceholder()\n  }\n  return createTooolbarPlaceholder()\n}\n\nconst queryPlaceholder = () => {\n  return document.querySelector(\"[data-jsenv-toolbar-placeholder]\")\n}\n\nconst createTooolbarPlaceholder = () => {\n  const placeholder = document.createElement(\"span\")\n  document.body.appendChild(placeholder)\n  return placeholder\n}\n\nconst iframeToLoadedPromise = (iframe) => {\n  return new Promise((resolve) => {\n    const onload = () => {\n      iframe.removeEventListener(\"load\", onload, true)\n      resolve()\n    }\n    iframe.addEventListener(\"load\", onload, true)\n  })\n}\n\nconst resolveUrl = (url, baseUrl) => String(new URL(url, baseUrl))\n\nif (document.readyState === \"complete\") {\n  injectToolbar()\n} else {\n  window.addEventListener(\"load\", injectToolbar)\n}\n"
+    "import { fetchExploringJson } from \"@jsenv/core/src/internal/dev_server/exploring/fetchExploringJson.js\"\nimport { setAttributes, setStyles } from \"./util/dom.js\"\n\n// eslint-disable-next-line no-undef\nconst TOOLBAR_BUILD_RELATIVE_URL = \"dist/toolbar/toolbar_04ba410c.html\"\nconst jsenvLogoSvgUrl = new URL(\"./jsenv-logo.svg\", import.meta.url)\n\nconst injectToolbar = async () => {\n  await new Promise((resolve) => {\n    if (window.requestIdleCallback) {\n      window.requestIdleCallback(resolve)\n    } else {\n      window.requestAnimationFrame(resolve)\n    }\n  })\n\n  const { jsenvDirectoryRelativeUrl } = await fetchExploringJson()\n  const jsenvDirectoryServerUrl = resolveUrl(\n    jsenvDirectoryRelativeUrl,\n    document.location.origin,\n  )\n\n  const placeholder = getToolbarPlaceholder()\n\n  const iframe = document.createElement(\"iframe\")\n  setAttributes(iframe, {\n    tabindex: -1,\n    // sandbox: \"allow-forms allow-modals allow-pointer-lock allow-popups allow-presentation allow-same-origin allow-scripts allow-top-navigation-by-user-activation\",\n    // allow: \"accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; microphone; midi; payment; vr\",\n    allowtransparency: true,\n  })\n  setStyles(iframe, {\n    \"position\": \"fixed\",\n    \"zIndex\": 1000,\n    \"bottom\": 0,\n    \"left\": 0,\n    \"width\": \"100%\",\n    \"height\": 0,\n    /* ensure toolbar children are not focusable when hidden */\n    \"visibility\": \"hidden\",\n    \"transition-duration\": \"300ms\",\n    \"transition-property\": \"height, visibility\",\n    \"border\": \"none\",\n  })\n  const iframeLoadedPromise = iframeToLoadedPromise(iframe)\n  const jsenvToolbarHtmlServerUrl = resolveUrl(\n    TOOLBAR_BUILD_RELATIVE_URL,\n    jsenvDirectoryServerUrl,\n  )\n  // set iframe src BEFORE putting it into the DOM (prevent firefox adding an history entry)\n  iframe.setAttribute(\"src\", jsenvToolbarHtmlServerUrl)\n  placeholder.parentNode.replaceChild(iframe, placeholder)\n\n  await iframeLoadedPromise\n  iframe.removeAttribute(\"tabindex\")\n\n  const div = document.createElement(\"div\")\n  div.innerHTML = `\n<div id=\"jsenv-toolbar-trigger\">\n  <svg id=\"jsenv-toolbar-trigger-icon\">\n    <use xlink:href=\"${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>`\n  const toolbarTrigger = div.firstElementChild\n  iframe.parentNode.appendChild(toolbarTrigger)\n\n  let timer\n  toolbarTrigger.onmouseenter = () => {\n    toolbarTrigger.setAttribute(\"data-animate\", \"\")\n    timer = setTimeout(expandToolbarTrigger, 500)\n  }\n  toolbarTrigger.onmouseleave = () => {\n    clearTimeout(timer)\n    collapseToolbarTrigger()\n  }\n  toolbarTrigger.onfocus = () => {\n    toolbarTrigger.removeAttribute(\"data-animate\")\n    expandToolbarTrigger()\n  }\n  toolbarTrigger.onblur = () => {\n    toolbarTrigger.removeAttribute(\"data-animate\")\n    clearTimeout(timer)\n    collapseToolbarTrigger()\n  }\n  toolbarTrigger.onclick = () => {\n    sendCommandToToolbar(iframe, \"showToolbar\")\n  }\n\n  const showToolbarTrigger = () => {\n    toolbarTrigger.style.display = \"block\"\n  }\n\n  const hideToolbarTrigger = () => {\n    toolbarTrigger.style.display = \"none\"\n  }\n\n  const expandToolbarTrigger = () => {\n    toolbarTrigger.setAttribute(\"data-expanded\", \"\")\n  }\n\n  const collapseToolbarTrigger = () => {\n    toolbarTrigger.removeAttribute(\"data-expanded\", \"\")\n  }\n\n  hideToolbarTrigger()\n  addToolbarEventCallback(iframe, \"toolbar-visibility-change\", (visible) => {\n    if (visible) {\n      hideToolbarTrigger()\n    } else {\n      showToolbarTrigger()\n    }\n  })\n  addToolbarEventCallback(iframe, \"toolbar_ready\", () => {\n    sendCommandToToolbar(iframe, \"renderToolbar\")\n  })\n\n  return iframe\n}\n\nconst addToolbarEventCallback = (iframe, eventName, callback) => {\n  const messageEventCallback = (messageEvent) => {\n    const { data } = messageEvent\n    if (typeof data !== \"object\") {\n      return\n    }\n    const { __jsenv__ } = data\n    if (!__jsenv__) {\n      return\n    }\n    if (__jsenv__.event !== eventName) {\n      return\n    }\n    callback(__jsenv__.data)\n  }\n\n  window.addEventListener(\"message\", messageEventCallback, false)\n  return () => {\n    window.removeEventListener(\"message\", messageEventCallback, false)\n  }\n}\n\nconst sendCommandToToolbar = (iframe, command, ...args) => {\n  iframe.contentWindow.postMessage(\n    {\n      __jsenv__: {\n        command,\n        args,\n      },\n    },\n    window.origin,\n  )\n}\n\nconst getToolbarPlaceholder = () => {\n  const placeholder = queryPlaceholder()\n  if (placeholder) {\n    if (document.body.contains(placeholder)) {\n      return placeholder\n    }\n    // otherwise iframe would not be visible because in <head>\n    console.warn(\n      \"element with [data-jsenv-toolbar-placeholder] must be inside document.body\",\n    )\n    return createTooolbarPlaceholder()\n  }\n  return createTooolbarPlaceholder()\n}\n\nconst queryPlaceholder = () => {\n  return document.querySelector(\"[data-jsenv-toolbar-placeholder]\")\n}\n\nconst createTooolbarPlaceholder = () => {\n  const placeholder = document.createElement(\"span\")\n  document.body.appendChild(placeholder)\n  return placeholder\n}\n\nconst iframeToLoadedPromise = (iframe) => {\n  return new Promise((resolve) => {\n    const onload = () => {\n      iframe.removeEventListener(\"load\", onload, true)\n      resolve()\n    }\n    iframe.addEventListener(\"load\", onload, true)\n  })\n}\n\nconst resolveUrl = (url, baseUrl) => String(new URL(url, baseUrl))\n\nif (document.readyState === \"complete\") {\n  injectToolbar()\n} else {\n  window.addEventListener(\"load\", injectToolbar)\n}\n"
   ],
   "names": [
     "nativeTypeOf",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/core",
-  "version": "25.0.0-alpha.0",
+  "version": "25.0.0-alpha.1",
   "description": "Tool to develop, test and build js projects",
   "license": "MIT",
   "repository": {
@@ -11,8 +11,7 @@
     "node": ">=14.9.0"
   },
   "publishConfig": {
-    "access": "public",
-    "registry": "https://registry.npmjs.org"
+    "access": "public"
   },
   "type": "module",
   "exports": {
@@ -35,11 +34,13 @@
     "test": "node --experimental-import-meta-resolve ./script/test/test.js",
     "test-with-coverage": "npm run test -- --coverage",
     "dev": "node ./script/dev/start_dev_server.js",
+    "start_file_server": "node ./script/dev/start_file_server.js",
     "performances": "node --expose-gc ./script/performance/generate_performance_report.js --log --once",
     "file-size": "node ./script/file_size/file_size.mjs --log",
     "prettier": "prettier --write .",
     "playwright-install": "npx playwright install-deps && npx playwright install",
     "packages-install": "node ./script/packages/packages_install.js",
+    "certificate-install": "node ./script/dev/install_certificate_authority.mjs",
     "prepublishOnly": "npm run build"
   },
   "optionalDependencies": {
@@ -136,4 +137,4 @@
     "redux": "4.1.2",
     "rollup-plugin-import-assert": "1.1.1"
   }
-}
+}

package/readme.md

@@ -1,12 +1,8 @@
 # jsenv [![npm package](https://img.shields.io/npm/v/@jsenv/core.svg?logo=npm&label=package)](https://www.npmjs.com/package/@jsenv/core) [![github main worflow](https://github.com/jsenv/jsenv-core/workflows/main/badge.svg)](https://github.com/jsenv/jsenv-core/actions?workflow=main) [![codecov coverage](https://codecov.io/gh/jsenv/jsenv-core/branch/master/graph/badge.svg)](https://codecov.io/gh/jsenv/jsenv-core)
 
-_@jsenv/core_ was first created to write tests that could be executed in different browsers AND Node.js. In the end it became a tool covering the core needs of a JavaScript project:
+_@jsenv/core_ is a quick start pack to launch a js project.
 
-- A test runner to execute test files
-- A development server
-- A build tool to optimize files for production
-
-Jsenv integrates naturally with standard html, css and js. It can be configured to work with React and JSX.
+You don't have to pick a JavaScript framework: jsenv integrates naturally with standard HTML, CSS and JS. It provides what you need from the beginning: a dev server, a build tool and a test "framework", all in one.
 
 # Test runner overview
 
@@ -251,6 +247,12 @@ To read more about jsenv build tool, check [jsenv build documentation](./docs/bu
 
 # About
 
+Jsenv was first created to write tests that could be executed in different runtimes. It has naturally evolved to cover the core needs of a JavaScript project:
+
+- A development server
+- A test runner to execute test files
+- A build tool to optimize files for production
+
 Jsenv relies on standard web features. Each standard listed below is potentially supported natively by the browser. When browser supports all of them, jsenv will use source files without modification. Otherwise, the files are compiled to be executable in the browser.
 
 - `<script type="module">`
@@ -260,7 +262,7 @@ Jsenv relies on standard web features. Each standard listed below is potentially
 - dynamic imports
 - import assertions
 
-## When to use it
+## When to use it?
 
 Amongst other use cases, the ease of use and flexibility of jsenv makes it a great tool to start and learn web development.
 
@@ -286,7 +288,7 @@ An overview of the main dependencies used by _@jsenv/core_.
 
 ## Name
 
-The name "jsenv" stands for JavaScript environments. This is because the original purpose of jsenv was to bring closer two JavaScript runtimes: web browsers and Node.js. This aspect is not highlighted in the documentation but it exists.
+The name "jsenv" stands for JavaScript environments. This is because the original purpose of jsenv was to bring closer two JavaScript runtimes: web browsers and Node.js.
 
 Maybe "jsenv" should be written "JSEnv"? That makes typing the name too complex:
 
@@ -362,86 +364,17 @@ module.exports = {
 }
 ```
 
-## CommonJS
-
-CommonJS module format rely on `module.exports` and `require`. It was invented by Node.js and is not standard JavaScript. If your code or one of your dependency uses it, it requires some configuration. The jsenv config below makes jsenv compatible with a package named _"whatever"_ that would be written in CommonJS.
-
-_jsenv.config.mjs to use code written in CommonJS_:
-
-```js
-import { commonJsToJavaScriptModule } from "@jsenv/core"
-
-export const customCompilers = {
-  "./node_modules/whatever/index.js": commonJsToJavaScriptModule,
-}
-```
-
-## React
-
-When your code imports react, it needs to be configured as shown below.
-
-_jsenv.config.mjs for react:_
-
-```js
-import { commonJsToJavaScriptModule } from "@jsenv/core"
-
-// "react" and "react-dom" are written in commonJs, they
-// must be converted to javascript modules
-// see https://github.com/jsenv/jsenv-core/blob/master/docs/shared-parameters.md#customCompilers
-export const customCompilers = {
-  "./node_modules/react/index.js": commonJsToJavaScriptModule,
-  "./node_modules/react-dom/index.js": (options) => {
-    return commonJsToJavaScriptModule({ ...options, external: ["react"] })
-  },
-}
-```
-
-You must also add an [importmap](https://github.com/WICG/import-maps#import-maps) file in your html to remap react imports.
-
-```html
-<script type="importmap">
-  {
-    "imports": {
-      "react": "./node_modules/react/index.js",
-      "react-dom": "./node_modules/react-dom/index.js"
-    }
-  }
-</script>
-```
-
-The import mappings can be generated programmatically, you can use https://github.com/jsenv/importmap-node-module to do that.
-
-## JSX
-
-If you want to use jsx, you need [@babel/plugin-transform-react-jsx](https://babeljs.io/docs/en/next/babel-plugin-transform-react-jsx.html) in your babel config file.
-
-```console
-npm i --save-dev @babel/plugin-transform-react-jsx
-```
-
-_babel.config.cjs for JSX_:
-
-```js
-module.exports = {
-  presets: ["@jsenv/babel-preset"],
-  plugins: [
-    [
-      "@babel/plugin-transform-react-jsx",
-      {
-        pragma: "React.createElement",
-        pragmaFrag: "React.Fragment",
-      },
-    ],
-  ],
-}
-```
-
 # See also
 
-| Link                                                                                                                     | Description                                                         |
-| ------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------- |
-| [@jsenv/template-pwa](https://github.com/jsenv/jsenv-template-pwa)                                                       | GitHub repository template for a progressive web application        |
-| [@jsenv/template-node-package](https://github.com/jsenv/jsenv-template-node-package)                                     | GitHub repository template for a node package                       |
-| [@jsenv/assert](https://github.com/jsenv/assert)                                                                         | Test anything using one assertion                                   |
-| [I am too lazy for a test framework](https://medium.com/@DamienMaillard/i-am-too-lazy-for-a-test-framework-ca08d216ee05) | Article presenting a straightforward testing experience             |
-| [Jsenv compile server](./docs/jsenv-compile-server.md)                                                                   | Documentation about progressive compilation with a filesystem cache |
+| Link                                                                                 | Description                                                               |
+| ------------------------------------------------------------------------------------ | ------------------------------------------------------------------------- |
+| [Browser support](./docs/config/browser_support.md)                                  | Document how to configure browser support                                 |
+| [Web workers](./docs/config/web_workers.md)                                          | Document how to use web workers                                           |
+| [React](./docs/config/react.md)                                                      | Document how to enable react/preact and JSX                               |
+| [CommonJS modules](./docs/config/commonjs.md)                                        | Document how to use code written in CommonJS                              |
+| [TypeScript (Experimental)](./docs/config/typescript.md)                             | Document how to enable TypeScript                                         |
+| [@jsenv/template-pwa](https://github.com/jsenv/jsenv-template-pwa)                   | GitHub repository template for a progressive web application              |
+| [@jsenv/template-node-package](https://github.com/jsenv/jsenv-template-node-package) | GitHub repository template for a node package                             |
+| [@jsenv/assert](https://github.com/jsenv/assert)                                     | NPM package to write assertions                                           |
+| [I am too lazy for a test framework](shorturl.at/rFY39)                              | Article presenting a straightforward testing experience                   |
+| [Jsenv compile server](./docs/jsenv-compile-server.md)                               | Documentation about jsenv progressive compilation with a filesystem cache |