@jsenv/core 30.3.6 → 30.3.8

package/dist/main.js

@@ -6905,13 +6905,18 @@ const createServerEventsDispatcher = () => {
       const firstClient = clients.shift();
       firstClient.close();
     }
-    return () => {
-      client.close();
+    const removeClient = () => {
       const index = clients.indexOf(client);
       if (index > -1) {
         clients.splice(index, 1);
       }
     };
+    client.onclose = () => {
+      removeClient();
+    };
+    return () => {
+      client.close();
+    };
   };
   return {
     addWebsocket: (websocket, request) => {
@@ -6946,6 +6951,10 @@ const createServerEventsDispatcher = () => {
       client.sendEvent({
         type: "welcome"
       });
+      websocket.onclose = () => {
+        client.onclose();
+      };
+      client.onclose = () => {};
       return addClient(client);
     },
     // we could add "addEventSource" and let clients connect using
@@ -9056,12 +9065,15 @@ ${ANSI.color(normalizedReturnValue, ANSI.YELLOW)}
           await urlInfoTransformer.applyIntermediateTransformations(urlInfo, transformReturnValue);
         });
       } catch (error) {
-        throw createTransformUrlContentError({
+        urlGraph.updateReferences(urlInfo, references); // ensure reference are updated even in case of error
+        const transformError = createTransformUrlContentError({
           pluginController,
           reference: context.reference,
           urlInfo,
           error
         });
+        urlInfo.error = transformError;
+        throw transformError;
       }
       // after "transform" all references from originalContent
       // and the one injected by plugin are known
@@ -9651,7 +9663,7 @@ const jsenvPluginReferenceExpectedTypes = () => {
     name: "jsenv:reference_expected_types",
     appliesDuring: "*",
     redirectUrl: {
-      script_src: redirectJsUrls,
+      script: redirectJsUrls,
       js_url: redirectJsUrls,
       js_import: redirectJsUrls
     }
@@ -9860,7 +9872,7 @@ const visitHtmlUrls = ({
         return;
       }
       visitAttributeAsUrlSpecifier({
-        type: "script_src",
+        type: "script",
         subtype: type,
         expectedType: type,
         node,
@@ -9945,7 +9957,7 @@ const decideLinkExpectedType = (linkMention, mentions) => {
       return "css";
     }
     if (as === "script") {
-      const firstScriptOnThisUrl = mentions.find(mentionCandidate => mentionCandidate.url === linkMention.url && mentionCandidate.type === "script_src");
+      const firstScriptOnThisUrl = mentions.find(mentionCandidate => mentionCandidate.url === linkMention.url && mentionCandidate.type === "script");
       if (firstScriptOnThisUrl) {
         return firstScriptOnThisUrl.expectedType;
       }
@@ -10176,6 +10188,28 @@ const findOriginalDirectoryReference = (urlInfo, context) => {
 const jsenvPluginHtmlInlineContent = ({
   analyzeConvertedScripts
 }) => {
+  const cookInlineContent = async ({
+    context,
+    inlineContentUrlInfo,
+    inlineContentReference
+  }) => {
+    try {
+      await context.cook(inlineContentUrlInfo, {
+        reference: inlineContentReference
+      });
+    } catch (e) {
+      if (e.code === "PARSE_ERROR") {
+        // When something like <style> or <script> contains syntax error
+        // the HTML in itself it still valid
+        // keep the syntax error and continue with the HTML
+        const messageStart = inlineContentUrlInfo.type === "css" ? `Syntax error on css declared inside <style>` : `Syntax error on js declared inside <script>`;
+        context.logger.error(`${messageStart}: ${e.cause.reasonCode}
+${e.traceMessage}`);
+      } else {
+        throw e;
+      }
+    }
+  };
   return {
     name: "jsenv:html_inline_content",
     appliesDuring: "*",
@@ -10210,7 +10244,7 @@ const jsenvPluginHtmlInlineContent = ({
             const debug = getHtmlNodeAttribute(styleNode, "jsenv-debug") !== undefined;
             const [inlineStyleReference, inlineStyleUrlInfo] = context.referenceUtils.foundInline({
               node: styleNode,
-              type: "link_href",
+              type: "style",
               expectedType: "css",
               isOriginalPosition: isOriginal,
               // we remove 1 to the line because imagine the following html:
@@ -10224,8 +10258,10 @@ const jsenvPluginHtmlInlineContent = ({
               debug
             });
             actions.push(async () => {
-              await context.cook(inlineStyleUrlInfo, {
-                reference: inlineStyleReference
+              await cookInlineContent({
+                context,
+                inlineContentUrlInfo: inlineStyleUrlInfo,
+                inlineContentReference: inlineStyleReference
               });
             });
             mutations.push(() => {
@@ -10274,7 +10310,7 @@ const jsenvPluginHtmlInlineContent = ({
             const debug = getHtmlNodeAttribute(scriptNode, "jsenv-debug") !== undefined;
             const [inlineScriptReference, inlineScriptUrlInfo] = context.referenceUtils.foundInline({
               node: scriptNode,
-              type: "script_src",
+              type: "script",
               expectedType: type,
               // we remove 1 to the line because imagine the following html:
               // <script>console.log('ok')</script>
@@ -10288,8 +10324,10 @@ const jsenvPluginHtmlInlineContent = ({
               debug
             });
             actions.push(async () => {
-              await context.cook(inlineScriptUrlInfo, {
-                reference: inlineScriptReference
+              await cookInlineContent({
+                context,
+                inlineContentUrlInfo: inlineScriptUrlInfo,
+                inlineContentReference: inlineScriptReference
               });
             });
             mutations.push(() => {
@@ -10814,7 +10852,8 @@ const jsenvPluginInlineQueryParam = () => {
       // this should be done during dev and postbuild but not build
       // so that the bundled file gets inlined and not the entry point
       "link_href": () => null,
-      "script_src": () => null,
+      "style": () => null,
+      "script": () => null,
       // if the referenced url is a worker we could use
       // https://www.oreilly.com/library/view/web-workers/9781449322120/ch04.html
       // but maybe we should rather use ?object_url
@@ -14470,7 +14509,21 @@ function default_1({
   };
 }
 
+/*
+ * When systemjs format is used by babel, it will generated UID based on
+ * the import specifier:
+ * https://github.com/babel/babel/blob/97d1967826077f15e766778c0d64711399e9a72a/packages/babel-plugin-transform-modules-systemjs/src/index.ts#L498
+ * But at this stage import specifier are absolute file urls
+ * So without minification these specifier are long and dependent
+ * on where the files are on the filesystem.
+ * This can be mitigated by minification that will rename them.
+ * But to fix this issue once and for all I have copy-pasted
+ * "@babel/plugin-transform-modules-systemjs" to introduce
+ * "generateIdentifierHint" options and prevent that from hapenning
+ */
+const TRANSFORM_MODULES_SYSTEMJS_PATH = fileURLToPath(new URL("./js/babel_plugin_transform_modules_systemjs.cjs", import.meta.url));
 const convertJsModuleToJsClassic = async ({
+  rootDirectoryUrl,
   systemJsInjection,
   systemJsClientFileUrl,
   urlInfo,
@@ -14495,7 +14548,16 @@ const convertJsModuleToJsClassic = async ({
     babelPlugins: [...(jsClassicFormat === "system" ? [
     // proposal-dynamic-import required with systemjs for babel8:
     // https://github.com/babel/babel/issues/10746
-    requireFromJsenv("@babel/plugin-proposal-dynamic-import"), requireFromJsenv("@babel/plugin-transform-modules-systemjs"), [default_1, {
+    requireFromJsenv("@babel/plugin-proposal-dynamic-import"), [
+    // eslint-disable-next-line import/no-dynamic-require
+    requireFromJsenv(TRANSFORM_MODULES_SYSTEMJS_PATH), {
+      generateIdentifierHint: key => {
+        if (key.startsWith("file://")) {
+          return urlToRelativeUrl(key, rootDirectoryUrl);
+        }
+        return key;
+      }
+    }], [default_1, {
       asyncAwait: false,
       // already handled + we might not needs it at all
       topLevelAwait: "return"
@@ -14629,6 +14691,7 @@ const jsenvPluginAsJsClassicConversion = ({
         content,
         sourcemap
       } = await convertJsModuleToJsClassic({
+        rootDirectoryUrl: context.rootDirectoryUrl,
         systemJsInjection,
         systemJsClientFileUrl,
         urlInfo,
@@ -14675,7 +14738,7 @@ const jsenvPluginAsJsClassicHtml = ({
         }
         return null;
       },
-      script_src: (reference, context) => {
+      script: (reference, context) => {
         if (context.systemJsTranspilation && reference.expectedType === "js_module") {
           return turnIntoJsClassicProxy(reference);
         }
@@ -14732,7 +14795,7 @@ const jsenvPluginAsJsClassicHtml = ({
             }
             const src = getHtmlNodeAttribute(node, "src");
             if (src) {
-              const reference = context.referenceUtils.find(ref => ref.generatedSpecifier === src && ref.type === "script_src" && ref.subtype === "js_module");
+              const reference = context.referenceUtils.find(ref => ref.generatedSpecifier === src && ref.type === "script" && ref.subtype === "js_module");
               if (!reference) {
                 return;
               }
@@ -14803,7 +14866,7 @@ const jsenvPluginAsJsClassicHtml = ({
                 });
               }
               const [systemJsReference, systemJsUrlInfo] = context.referenceUtils.inject({
-                type: "script_src",
+                type: "script",
                 expectedType: "js_classic",
                 isInline: true,
                 contentType: "text/javascript",
@@ -14973,6 +15036,7 @@ const jsenvPluginAsJsClassicLibrary = ({
         content,
         sourcemap
       } = await convertJsModuleToJsClassic({
+        rootDirectoryUrl: context.rootDirectoryUrl,
         systemJsInjection,
         systemJsClientFileUrl,
         urlInfo,
@@ -14991,18 +15055,6 @@ const jsenvPluginAsJsClassicLibrary = ({
   };
 };
 
-/*
- * Something to keep in mind:
- * When systemjs format is used by babel, it will generated UID based on
- * the import specifier:
- * https://github.com/babel/babel/blob/97d1967826077f15e766778c0d64711399e9a72a/packages/babel-plugin-transform-modules-systemjs/src/index.ts#L498
- * But at this stage import specifier are absolute file urls
- * So without minification these specifier are long and dependent
- * on where the files are on the filesystem.
- * This is mitigated by minification that will shorten them
- * But ideally babel should not generate this in the first place
- * and prefer to unique identifier based solely on the specifier basename for instance
- */
 const jsenvPluginAsJsClassic = ({
   jsClassicLibrary,
   jsClassicFallback,
@@ -15739,7 +15791,7 @@ const jsenvPluginImportmap = () => {
             columnEnd
           });
           const [inlineImportmapReference, inlineImportmapUrlInfo] = context.referenceUtils.foundInline({
-            type: "script_src",
+            type: "script",
             isOriginalPosition: isOriginal,
             specifierLine: line - 1,
             specifierColumn: column,
@@ -16874,7 +16926,8 @@ const addRelationshipWithPackageJson = ({
  * - "http_request"
  * - "entry_point"
  * - "link_href"
- * - "script_src"
+ * - "style"
+ * - "script"
  * - "a_href"
  * - "iframe_src
  * - "img_src"
@@ -17411,7 +17464,8 @@ const jsenvPluginSupervisor = ({
             columnEnd
           });
           const [inlineScriptReference] = context.referenceUtils.foundInline({
-            type: "script_src",
+            type: "script",
+            subtype: "inline",
             expectedType: type,
             isOriginalPosition: isOriginal,
             specifierLine: line - 1,
@@ -17484,7 +17538,7 @@ const jsenvPluginSupervisor = ({
           specifier: scriptTypeModuleSupervisorFileUrl
         });
         const [supervisorFileReference] = context.referenceUtils.inject({
-          type: "script_src",
+          type: "script",
           expectedType: "js_classic",
           specifier: supervisorFileUrl
         });
@@ -19464,7 +19518,7 @@ const htmlNodeCanHotReload = node => {
     return rel === "icon";
   }
   return [
-  // "script_src", // script src cannot hot reload
+  // "script", // script cannot hot reload
   "a",
   // Iframe will have their own event source client
   // and can hot reload independently
@@ -19723,7 +19777,7 @@ const jsenvPluginAutoreloadClient = () => {
       html: (htmlUrlInfo, context) => {
         const htmlAst = parseHtmlString(htmlUrlInfo.content);
         const [autoreloadClientReference] = context.referenceUtils.inject({
-          type: "script_src",
+          type: "script",
           subtype: "js_module",
           expectedType: "js_module",
           specifier: autoreloadClientFileUrl
@@ -20078,7 +20132,7 @@ const jsenvPluginRibbon = ({
         }
         const htmlAst = parseHtmlString(urlInfo.content);
         const [ribbonClientFileReference] = context.referenceUtils.inject({
-          type: "script_src",
+          type: "script",
           subtype: "js_module",
           expectedType: "js_module",
           specifier: ribbonClientFileUrl.href
@@ -21088,7 +21142,7 @@ ${ANSI.color(buildUrl, ANSI.MAGENTA)}
                 const dependentUrlInfo = rawGraph.getUrlInfo(dependent);
                 for (const reference of dependentUrlInfo.references) {
                   if (reference.url === referencedUrlInfo.url) {
-                    willAlreadyBeBundled = reference.subtype === "import_dynamic" || reference.type === "script_src";
+                    willAlreadyBeBundled = reference.subtype === "import_dynamic" || reference.type === "script";
                   }
                 }
               }
@@ -22036,7 +22090,7 @@ const jsenvPluginServerEventsClientInjection = () => {
       html: (htmlUrlInfo, context) => {
         const htmlAst = parseHtmlString(htmlUrlInfo.content);
         const [serverEventsClientFileReference] = context.referenceUtils.inject({
-          type: "script_src",
+          type: "script",
           subtype: "js_module",
           expectedType: "js_module",
           specifier: serverEventsClientFileUrl

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/core",
-  "version": "30.3.6",
+  "version": "30.3.8",
   "description": "Tool to develop, test and build js projects",
   "license": "MIT",
   "author": {
@@ -67,7 +67,7 @@
     "@c88/v8-coverage": "0.1.1",
     "@financial-times/polyfill-useragent-normaliser": "1.10.2",
     "@jsenv/abort": "4.2.4",
-    "@jsenv/ast": "3.0.1",
+    "@jsenv/ast": "3.0.2",
     "@jsenv/babel-plugins": "1.1.3",
     "@jsenv/plugin-bundling": "1.1.2",
     "@jsenv/filesystem": "4.1.9",

package/src/build/build.js

@@ -755,7 +755,7 @@ ${ANSI.color(buildUrl, ANSI.MAGENTA)}
                   if (reference.url === referencedUrlInfo.url) {
                     willAlreadyBeBundled =
                       reference.subtype === "import_dynamic" ||
-                      reference.type === "script_src"
+                      reference.type === "script"
                   }
                 }
               }

package/src/kitchen/kitchen.js

@@ -593,12 +593,15 @@ ${ANSI.color(normalizedReturnValue, ANSI.YELLOW)}
           },
         )
       } catch (error) {
-        throw createTransformUrlContentError({
+        urlGraph.updateReferences(urlInfo, references) // ensure reference are updated even in case of error
+        const transformError = createTransformUrlContentError({
           pluginController,
           reference: context.reference,
           urlInfo,
           error,
         })
+        urlInfo.error = transformError
+        throw transformError
       }
       // after "transform" all references from originalContent
       // and the one injected by plugin are known

package/src/plugins/autoreload/jsenv_plugin_autoreload_client.js

@@ -18,7 +18,7 @@ export const jsenvPluginAutoreloadClient = () => {
       html: (htmlUrlInfo, context) => {
         const htmlAst = parseHtmlString(htmlUrlInfo.content)
         const [autoreloadClientReference] = context.referenceUtils.inject({
-          type: "script_src",
+          type: "script",
           subtype: "js_module",
           expectedType: "js_module",
           specifier: autoreloadClientFileUrl,

package/src/plugins/import_meta_hot/html_hot_dependencies.js

@@ -130,7 +130,7 @@ const htmlNodeCanHotReload = (node) => {
     return rel === "icon"
   }
   return [
-    // "script_src", // script src cannot hot reload
+    // "script", // script cannot hot reload
     "a",
     // Iframe will have their own event source client
     // and can hot reload independently

package/src/plugins/importmap/jsenv_plugin_importmap.js

@@ -121,7 +121,7 @@ export const jsenvPluginImportmap = () => {
           })
           const [inlineImportmapReference, inlineImportmapUrlInfo] =
             context.referenceUtils.foundInline({
-              type: "script_src",
+              type: "script",
               isOriginalPosition: isOriginal,
               specifierLine: line - 1,
               specifierColumn: column,

package/src/plugins/inline/jsenv_plugin_html_inline_content.js

@@ -13,6 +13,33 @@ import {
 import { CONTENT_TYPE } from "@jsenv/utils/src/content_type/content_type.js"
 
 export const jsenvPluginHtmlInlineContent = ({ analyzeConvertedScripts }) => {
+  const cookInlineContent = async ({
+    context,
+    inlineContentUrlInfo,
+    inlineContentReference,
+  }) => {
+    try {
+      await context.cook(inlineContentUrlInfo, {
+        reference: inlineContentReference,
+      })
+    } catch (e) {
+      if (e.code === "PARSE_ERROR") {
+        // When something like <style> or <script> contains syntax error
+        // the HTML in itself it still valid
+        // keep the syntax error and continue with the HTML
+        const messageStart =
+          inlineContentUrlInfo.type === "css"
+            ? `Syntax error on css declared inside <style>`
+            : `Syntax error on js declared inside <script>`
+
+        context.logger.error(`${messageStart}: ${e.cause.reasonCode}
+${e.traceMessage}`)
+      } else {
+        throw e
+      }
+    }
+  }
+
   return {
     name: "jsenv:html_inline_content",
     appliesDuring: "*",
@@ -44,7 +71,7 @@ export const jsenvPluginHtmlInlineContent = ({ analyzeConvertedScripts }) => {
             const [inlineStyleReference, inlineStyleUrlInfo] =
               context.referenceUtils.foundInline({
                 node: styleNode,
-                type: "link_href",
+                type: "style",
                 expectedType: "css",
                 isOriginalPosition: isOriginal,
                 // we remove 1 to the line because imagine the following html:
@@ -58,8 +85,10 @@ export const jsenvPluginHtmlInlineContent = ({ analyzeConvertedScripts }) => {
                 debug,
               })
             actions.push(async () => {
-              await context.cook(inlineStyleUrlInfo, {
-                reference: inlineStyleReference,
+              await cookInlineContent({
+                context,
+                inlineContentUrlInfo: inlineStyleUrlInfo,
+                inlineContentReference: inlineStyleReference,
               })
             })
             mutations.push(() => {
@@ -113,7 +142,7 @@ export const jsenvPluginHtmlInlineContent = ({ analyzeConvertedScripts }) => {
             const [inlineScriptReference, inlineScriptUrlInfo] =
               context.referenceUtils.foundInline({
                 node: scriptNode,
-                type: "script_src",
+                type: "script",
                 expectedType: type,
                 // we remove 1 to the line because imagine the following html:
                 // <script>console.log('ok')</script>
@@ -127,8 +156,10 @@ export const jsenvPluginHtmlInlineContent = ({ analyzeConvertedScripts }) => {
                 debug,
               })
             actions.push(async () => {
-              await context.cook(inlineScriptUrlInfo, {
-                reference: inlineScriptReference,
+              await cookInlineContent({
+                context,
+                inlineContentUrlInfo: inlineScriptUrlInfo,
+                inlineContentReference: inlineScriptReference,
               })
             })
             mutations.push(() => {

package/src/plugins/inline/jsenv_plugin_inline_query_param.js

@@ -9,7 +9,8 @@ export const jsenvPluginInlineQueryParam = () => {
       // this should be done during dev and postbuild but not build
       // so that the bundled file gets inlined and not the entry point
       "link_href": () => null,
-      "script_src": () => null,
+      "style": () => null,
+      "script": () => null,
       // if the referenced url is a worker we could use
       // https://www.oreilly.com/library/view/web-workers/9781449322120/ch04.html
       // but maybe we should rather use ?object_url

package/src/plugins/ribbon/jsenv_plugin_ribbon.js

@@ -37,7 +37,7 @@ export const jsenvPluginRibbon = ({
         }
         const htmlAst = parseHtmlString(urlInfo.content)
         const [ribbonClientFileReference] = context.referenceUtils.inject({
-          type: "script_src",
+          type: "script",
           subtype: "js_module",
           expectedType: "js_module",
           specifier: ribbonClientFileUrl.href,

package/src/plugins/server_events/jsenv_plugin_server_events_client_injection.js

@@ -24,7 +24,7 @@ export const jsenvPluginServerEventsClientInjection = () => {
         const htmlAst = parseHtmlString(htmlUrlInfo.content)
         const [serverEventsClientFileReference] = context.referenceUtils.inject(
           {
-            type: "script_src",
+            type: "script",
             subtype: "js_module",
             expectedType: "js_module",
             specifier: serverEventsClientFileUrl,

package/src/plugins/server_events/server_events_dispatcher.js

@@ -8,13 +8,18 @@ export const createServerEventsDispatcher = () => {
       const firstClient = clients.shift()
       firstClient.close()
     }
-    return () => {
-      client.close()
+    const removeClient = () => {
       const index = clients.indexOf(client)
       if (index > -1) {
         clients.splice(index, 1)
       }
     }
+    client.onclose = () => {
+      removeClient(client)
+    }
+    return () => {
+      client.close()
+    }
   }
 
   return {
@@ -48,6 +53,10 @@ export const createServerEventsDispatcher = () => {
         },
       }
       client.sendEvent({ type: "welcome" })
+      websocket.onclose = () => {
+        client.onclose()
+      }
+      client.onclose = () => {}
       return addClient(client)
     },
     // we could add "addEventSource" and let clients connect using

package/src/plugins/supervisor/jsenv_plugin_supervisor.js

@@ -232,7 +232,8 @@ export const jsenvPluginSupervisor = ({
             columnEnd,
           })
           const [inlineScriptReference] = context.referenceUtils.foundInline({
-            type: "script_src",
+            type: "script",
+            subtype: "inline",
             expectedType: type,
             isOriginalPosition: isOriginal,
             specifierLine: line - 1,
@@ -307,7 +308,7 @@ export const jsenvPluginSupervisor = ({
             specifier: scriptTypeModuleSupervisorFileUrl,
           })
         const [supervisorFileReference] = context.referenceUtils.inject({
-          type: "script_src",
+          type: "script",
           expectedType: "js_classic",
           specifier: supervisorFileUrl,
         })