@jsenv/plugin-supervisor 1.4.16 → 1.5.1

package/dist/js/supervisor.js

@@ -504,11 +504,11 @@ window.__supervisor__ = (() => {
         },
         meta: null,
         site: {
+          ownerSite: null,
           isInline: null,
           url: null,
           line: null,
-          column: null,
-          originalUrl: null
+          column: null
         }
       };
       const writeBasicProperties = () => {
@@ -674,9 +674,38 @@ window.__supervisor__ = (() => {
           line,
           column
         });
-        if (fileUrlSite.isInline && exception.name === "SyntaxError" && exception.code !== DYNAMIC_IMPORT_EXPORT_MISSING) {
-          // syntax error on inline script need line-1 for some reason
-          fileUrlSite.line = fileUrlSite.line - 1;
+        const decreaseLine = () => {
+          const {
+            ownerSite
+          } = fileUrlSite;
+          if (ownerSite) {
+            if (typeof ownerSite.line === "number") {
+              ownerSite.line = fileUrlSite.ownerSite.line - 1;
+            }
+          }
+          if (typeof fileUrlSite.line === "number") {
+            fileUrlSite.line = fileUrlSite.line - 1;
+          }
+        };
+        if (fileUrlSite.isInline) {
+          // chrome
+          if (Error.captureStackTrace && !isWebkitOrSafari) {
+            if (exception.name === "SyntaxError") {
+              // syntax error on inline script need line-1 for some reason
+              decreaseLine();
+            }
+          }
+          // firefox and webkit
+          else if (exception.name === "SyntaxError") {
+            if (exception.code === DYNAMIC_IMPORT_EXPORT_MISSING || exception.code === DYNAMIC_IMPORT_SYNTAX_ERROR) {
+              decreaseLine();
+            } else {
+              decreaseLine();
+              decreaseLine();
+            }
+          } else {
+            decreaseLine();
+          }
         }
         Object.assign(exception.site, fileUrlSite);
       }
@@ -753,17 +782,22 @@ window.__supervisor__ = (() => {
         const tagColumnEnd = parseInt(inlineUrlMatch[4]);
         const extension = inlineUrlMatch[5];
         url = htmlUrl;
-        line = tagLineStart + (typeof line === "number" ? line : 0);
-        line = line - 1; // sauf pour les erreur de syntaxe
-        column = tagColumnStart + (typeof column === "number" ? column : 0);
         const fileUrl = resolveFileUrl(url);
+        const ownerSiteUrl = "".concat(fileUrl, "@L").concat(tagLineStart, "C").concat(tagColumnStart, "-L").concat(tagLineEnd, "C").concat(tagColumnEnd).concat(extension);
+        const ownerSite = {
+          url: ownerSiteUrl,
+          ownerLine: tagLineStart,
+          ownerColumn: tagColumnStart,
+          inlineLine: typeof line === "number" ? line - 1 : undefined,
+          inlineColumn: column
+        };
         return {
+          ownerSite,
           isInline: true,
           serverUrl: url,
-          originalUrl: "".concat(fileUrl, "@L").concat(tagLineStart, "C").concat(tagColumnStart, "-L").concat(tagLineEnd, "C").concat(tagColumnEnd).concat(extension),
           url: fileUrl,
-          line,
-          column
+          line: typeof ownerSite.inlineLine === "number" ? ownerSite.ownerLine + ownerSite.inlineLine : ownerSite.ownerLine,
+          column: typeof ownerSite.inlineColumn === "number" ? ownerSite.inlineColumn : ownerSite.ownerColumn
         };
       }
       return {
@@ -843,7 +877,7 @@ window.__supervisor__ = (() => {
             const lineString = lineMatch[0];
             replacement = replace({
               url: match.slice(0, -lineString.length),
-              line: lineString ? parseInt(lineString) : null
+              line: parseInt(lineMatch[1])
             });
           } else {
             replacement = replace({
@@ -952,7 +986,9 @@ window.__supervisor__ = (() => {
             (async () => {
               try {
                 if (exception.code === DYNAMIC_IMPORT_FETCH_ERROR || exception.reportedBy === "script_error_event") {
-                  const response = await window.fetch("/__get_error_cause__/".concat(encodeURIComponent(exception.site.isInline ? exception.site.originalUrl : exception.site.url)));
+                  const errorCauseFile = exception.site.ownerSite ? exception.site.ownerSite.url : exception.site.url;
+                  const errorCauseAPIUrl = "/__get_error_cause__/".concat(encodeURIComponent(errorCauseFile));
+                  const response = await window.fetch(errorCauseAPIUrl);
                   if (response.status !== 200) {
                     return;
                   }
@@ -965,7 +1001,13 @@ window.__supervisor__ = (() => {
                   return;
                 }
                 if (exception.site.line !== undefined) {
-                  const urlToFetch = new URL("/__get_cause_trace__/".concat(encodeURIComponent(stringifyUrlSite(exception.site))), window.origin);
+                  const errorTraceFile = exception.site.ownerSite ? stringifyUrlSite({
+                    url: exception.site.ownerSite.url,
+                    line: exception.site.ownerSite.inlineLine,
+                    column: exception.site.ownerSite.inlineColumn
+                  }) : stringifyUrlSite(exception.site);
+                  const errorTraceAPIUrl = "/__get_cause_trace__/".concat(encodeURIComponent(errorTraceFile));
+                  const urlToFetch = new URL(errorTraceAPIUrl, window.origin);
                   if (!exception.stackSourcemapped) {
                     urlToFetch.searchParams.set("remap", "");
                   }

package/dist/jsenv_plugin_supervisor.js

@@ -4,7 +4,7 @@ import process$1 from "node:process";
 import os from "node:os";
 import tty from "node:tty";
 import "string-width";
-import { applyBabelPlugins, parseHtml, visitHtmlNodes, analyzeScriptNode, getHtmlNodeAttribute, getHtmlNodeText, injectHtmlNodeAsEarlyAsPossible, createHtmlNode, stringifyHtmlAst, getHtmlNodePosition, getUrlForContentInsideHtml, setHtmlNodeText, setHtmlNodeAttributes } from "@jsenv/ast";
+import { applyBabelPlugins, parseHtml, visitHtmlNodes, analyzeScriptNode, getHtmlNodeAttribute, getHtmlNodeText, injectJsenvScript, stringifyHtmlAst, getHtmlNodePosition, getUrlForContentInsideHtml, setHtmlNodeText, setHtmlNodeAttributes } from "@jsenv/ast";
 
 const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
 const intToChar = new Uint8Array(64); // 64 possible chars.
@@ -1140,20 +1140,19 @@ const injectSupervisorIntoHTML = async ({
   }
   // 2. Inject supervisor js file + setup call
   {
-    const setupParamsSource = stringifyParams({
-      ...supervisorOptions,
-      serverIsJsenvDevServer: webServer.isJsenvDevServer,
-      rootDirectoryUrl: webServer.rootDirectoryUrl,
-      scriptInfos
-    }, "  ");
-    injectHtmlNodeAsEarlyAsPossible(htmlAst, createHtmlNode({
-      tagName: "script",
-      textContent: "window.__supervisor__.setup({\n  ".concat(setupParamsSource, "\n});")
-    }), "jsenv:supervisor");
-    injectHtmlNodeAsEarlyAsPossible(htmlAst, createHtmlNode({
-      tagName: "script",
-      src: supervisorScriptSrc
-    }), "jsenv:supervisor");
+    injectJsenvScript(htmlAst, {
+      src: supervisorScriptSrc,
+      initCall: {
+        callee: "window.__supervisor__.setup",
+        params: {
+          ...supervisorOptions,
+          serverIsJsenvDevServer: webServer.isJsenvDevServer,
+          rootDirectoryUrl: webServer.rootDirectoryUrl,
+          scriptInfos
+        }
+      },
+      pluginName: "jsenv:supervisor"
+    });
   }
   // 3. Perform actions (transforming inline script content) and html mutations
   if (actions.length > 0) {
@@ -1165,18 +1164,6 @@ const injectSupervisorIntoHTML = async ({
     content: htmlModified
   };
 };
-const stringifyParams = (params, prefix = "") => {
-  const source = JSON.stringify(params, null, prefix);
-  if (prefix.length) {
-    // remove leading "{\n"
-    // remove leading prefix
-    // remove trailing "\n}"
-    return source.slice(2 + prefix.length, -2);
-  }
-  // remove leading "{"
-  // remove trailing "}"
-  return source.slice(1, -1);
-};
 const generateCodeToSuperviseScriptWithSrc = ({
   type,
   src
@@ -1200,6 +1187,41 @@ const jsenvPluginSupervisor = ({
   openInEditor = true,
   errorBaseUrl
 }) => {
+  const resolveUrlSite = urlWithLineAndColumn => {
+    const inlineUrlMatch = urlWithLineAndColumn.match(
+    // eslint-disable-next-line regexp/no-unused-capturing-group
+    /@L([0-9]+)C([0-9]+)-L([0-9]+)C([0-9]+)\.\w+(:([0-9]+):([0-9]+))?$/);
+    if (inlineUrlMatch) {
+      const htmlUrl = urlWithLineAndColumn.slice(0, inlineUrlMatch.index);
+      const tagLineStart = parseInt(inlineUrlMatch[1]);
+      const tagColumnStart = parseInt(inlineUrlMatch[2]);
+      // const tagLineEnd = parseInt(inlineUrlMatch[3]);
+      // const tagColumnEnd = parseInt(inlineUrlMatch[4]);
+      const inlineLine = inlineUrlMatch[6] === undefined ? undefined : parseInt(inlineUrlMatch[6]);
+      const inlineColumn = inlineUrlMatch[7] === undefined ? undefined : parseInt(inlineUrlMatch[7]);
+      return {
+        file: htmlUrl,
+        ownerLine: tagLineStart,
+        ownerColumn: tagColumnStart,
+        inlineLine,
+        inlineColumn,
+        line: inlineLine === undefined ? tagLineStart : tagLineStart + inlineLine,
+        column: inlineColumn === undefined ? tagColumnStart : inlineColumn
+      };
+    }
+    const match = urlWithLineAndColumn.match(/:([0-9]+):([0-9]+)$/);
+    if (!match) {
+      return null;
+    }
+    const file = urlWithLineAndColumn.slice(0, match.index);
+    let line = parseInt(match[1]);
+    let column = parseInt(match[2]);
+    return {
+      file,
+      line,
+      column
+    };
+  };
   return {
     name: "jsenv:supervisor",
     appliesDuring: "dev",
@@ -1209,18 +1231,19 @@ const jsenvPluginSupervisor = ({
           pathname,
           searchParams
         } = new URL(serveInfo.request.url);
-        let urlWithLineAndColumn = pathname.slice("/__get_cause_trace__/".length);
-        urlWithLineAndColumn = decodeURIComponent(urlWithLineAndColumn);
-        const match = urlWithLineAndColumn.match(/:([0-9]+):([0-9]+)$/);
-        if (!match) {
+        const urlWithLineAndColumn = decodeURIComponent(pathname.slice("/__get_cause_trace__/".length));
+        const result = resolveUrlSite(urlWithLineAndColumn);
+        if (!result) {
           return {
             status: 400,
             body: "Missing line and column in url"
           };
         }
-        const file = urlWithLineAndColumn.slice(0, match.index);
-        let line = parseInt(match[1]);
-        let column = parseInt(match[2]);
+        let {
+          file,
+          line,
+          column
+        } = result;
         const urlInfo = serveInfo.kitchen.graph.getUrlInfo(file);
         if (!urlInfo) {
           return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/plugin-supervisor",
-  "version": "1.4.16",
+  "version": "1.5.1",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -26,7 +26,7 @@
     "/dist/"
   ],
   "dependencies": {
-    "@jsenv/ast": "6.1.4",
+    "@jsenv/ast": "6.2.1",
     "@jsenv/urls": "2.2.10",
     "@jsenv/sourcemap": "1.2.13",
     "launch-editor": "2.8.0"

package/src/client/supervisor.js

@@ -458,11 +458,11 @@ window.__supervisor__ = (() => {
         },
         meta: null,
         site: {
+          ownerSite: null,
           isInline: null,
           url: null,
           line: null,
           column: null,
-          originalUrl: null,
         },
       };
 
@@ -641,13 +641,39 @@ window.__supervisor__ = (() => {
           column = parseInt(column);
         }
         const fileUrlSite = resolveUrlSite({ url, line, column });
-        if (
-          fileUrlSite.isInline &&
-          exception.name === "SyntaxError" &&
-          exception.code !== DYNAMIC_IMPORT_EXPORT_MISSING
-        ) {
-          // syntax error on inline script need line-1 for some reason
-          fileUrlSite.line = fileUrlSite.line - 1;
+        const decreaseLine = () => {
+          const { ownerSite } = fileUrlSite;
+          if (ownerSite) {
+            if (typeof ownerSite.line === "number") {
+              ownerSite.line = fileUrlSite.ownerSite.line - 1;
+            }
+          }
+          if (typeof fileUrlSite.line === "number") {
+            fileUrlSite.line = fileUrlSite.line - 1;
+          }
+        };
+        if (fileUrlSite.isInline) {
+          // chrome
+          if (Error.captureStackTrace && !isWebkitOrSafari) {
+            if (exception.name === "SyntaxError") {
+              // syntax error on inline script need line-1 for some reason
+              decreaseLine();
+            }
+          }
+          // firefox and webkit
+          else if (exception.name === "SyntaxError") {
+            if (
+              exception.code === DYNAMIC_IMPORT_EXPORT_MISSING ||
+              exception.code === DYNAMIC_IMPORT_SYNTAX_ERROR
+            ) {
+              decreaseLine();
+            } else {
+              decreaseLine();
+              decreaseLine();
+            }
+          } else {
+            decreaseLine();
+          }
         }
         Object.assign(exception.site, fileUrlSite);
       }
@@ -721,17 +747,28 @@ window.__supervisor__ = (() => {
         const tagColumnEnd = parseInt(inlineUrlMatch[4]);
         const extension = inlineUrlMatch[5];
         url = htmlUrl;
-        line = tagLineStart + (typeof line === "number" ? line : 0);
-        line = line - 1; // sauf pour les erreur de syntaxe
-        column = tagColumnStart + (typeof column === "number" ? column : 0);
         const fileUrl = resolveFileUrl(url);
+        const ownerSiteUrl = `${fileUrl}@L${tagLineStart}C${tagColumnStart}-L${tagLineEnd}C${tagColumnEnd}${extension}`;
+        const ownerSite = {
+          url: ownerSiteUrl,
+          ownerLine: tagLineStart,
+          ownerColumn: tagColumnStart,
+          inlineLine: typeof line === "number" ? line - 1 : undefined,
+          inlineColumn: column,
+        };
         return {
+          ownerSite,
           isInline: true,
           serverUrl: url,
-          originalUrl: `${fileUrl}@L${tagLineStart}C${tagColumnStart}-L${tagLineEnd}C${tagColumnEnd}${extension}`,
           url: fileUrl,
-          line,
-          column,
+          line:
+            typeof ownerSite.inlineLine === "number"
+              ? ownerSite.ownerLine + ownerSite.inlineLine
+              : ownerSite.ownerLine,
+          column:
+            typeof ownerSite.inlineColumn === "number"
+              ? ownerSite.inlineColumn
+              : ownerSite.ownerColumn,
         };
       }
       return {
@@ -819,7 +856,7 @@ window.__supervisor__ = (() => {
             const lineString = lineMatch[0];
             replacement = replace({
               url: match.slice(0, -lineString.length),
-              line: lineString ? parseInt(lineString) : null,
+              line: parseInt(lineMatch[1]),
             });
           } else {
             replacement = replace({
@@ -962,13 +999,13 @@ window.__supervisor__ = (() => {
                   exception.code === DYNAMIC_IMPORT_FETCH_ERROR ||
                   exception.reportedBy === "script_error_event"
                 ) {
-                  const response = await window.fetch(
-                    `/__get_error_cause__/${encodeURIComponent(
-                      exception.site.isInline
-                        ? exception.site.originalUrl
-                        : exception.site.url,
-                    )}`,
-                  );
+                  const errorCauseFile = exception.site.ownerSite
+                    ? exception.site.ownerSite.url
+                    : exception.site.url;
+                  const errorCauseAPIUrl = `/__get_error_cause__/${encodeURIComponent(
+                    errorCauseFile,
+                  )}`;
+                  const response = await window.fetch(errorCauseAPIUrl);
                   if (response.status !== 200) {
                     return;
                   }
@@ -981,12 +1018,17 @@ window.__supervisor__ = (() => {
                   return;
                 }
                 if (exception.site.line !== undefined) {
-                  const urlToFetch = new URL(
-                    `/__get_cause_trace__/${encodeURIComponent(
-                      stringifyUrlSite(exception.site),
-                    )}`,
-                    window.origin,
-                  );
+                  const errorTraceFile = exception.site.ownerSite
+                    ? stringifyUrlSite({
+                        url: exception.site.ownerSite.url,
+                        line: exception.site.ownerSite.inlineLine,
+                        column: exception.site.ownerSite.inlineColumn,
+                      })
+                    : stringifyUrlSite(exception.site);
+                  const errorTraceAPIUrl = `/__get_cause_trace__/${encodeURIComponent(
+                    errorTraceFile,
+                  )}`;
+                  const urlToFetch = new URL(errorTraceAPIUrl, window.origin);
                   if (!exception.stackSourcemapped) {
                     urlToFetch.searchParams.set("remap", "");
                   }

package/src/html_supervisor.js

@@ -52,8 +52,7 @@ import {
   getHtmlNodeAttribute,
   setHtmlNodeAttributes,
   analyzeScriptNode,
-  injectHtmlNodeAsEarlyAsPossible,
-  createHtmlNode,
+  injectJsenvScript,
   getHtmlNodePosition,
   getHtmlNodeText,
   setHtmlNodeText,
@@ -224,33 +223,19 @@ export const injectSupervisorIntoHTML = async (
   }
   // 2. Inject supervisor js file + setup call
   {
-    const setupParamsSource = stringifyParams(
-      {
-        ...supervisorOptions,
-        serverIsJsenvDevServer: webServer.isJsenvDevServer,
-        rootDirectoryUrl: webServer.rootDirectoryUrl,
-        scriptInfos,
+    injectJsenvScript(htmlAst, {
+      src: supervisorScriptSrc,
+      initCall: {
+        callee: "window.__supervisor__.setup",
+        params: {
+          ...supervisorOptions,
+          serverIsJsenvDevServer: webServer.isJsenvDevServer,
+          rootDirectoryUrl: webServer.rootDirectoryUrl,
+          scriptInfos,
+        },
       },
-      "  ",
-    );
-    injectHtmlNodeAsEarlyAsPossible(
-      htmlAst,
-      createHtmlNode({
-        tagName: "script",
-        textContent: `window.__supervisor__.setup({
-  ${setupParamsSource}
-});`,
-      }),
-      "jsenv:supervisor",
-    );
-    injectHtmlNodeAsEarlyAsPossible(
-      htmlAst,
-      createHtmlNode({
-        tagName: "script",
-        src: supervisorScriptSrc,
-      }),
-      "jsenv:supervisor",
-    );
+      pluginName: "jsenv:supervisor",
+    });
   }
   // 3. Perform actions (transforming inline script content) and html mutations
   if (actions.length > 0) {
@@ -263,19 +248,6 @@ export const injectSupervisorIntoHTML = async (
   };
 };
 
-const stringifyParams = (params, prefix = "") => {
-  const source = JSON.stringify(params, null, prefix);
-  if (prefix.length) {
-    // remove leading "{\n"
-    // remove leading prefix
-    // remove trailing "\n}"
-    return source.slice(2 + prefix.length, -2);
-  }
-  // remove leading "{"
-  // remove trailing "}"
-  return source.slice(1, -1);
-};
-
 const generateCodeToSuperviseScriptWithSrc = ({ type, src }) => {
   const srcEncoded = JSON.stringify(src);
   if (type === "js_module") {

package/src/jsenv_plugin_supervisor.js

@@ -20,26 +20,67 @@ export const jsenvPluginSupervisor = ({
   openInEditor = true,
   errorBaseUrl,
 }) => {
+  const resolveUrlSite = (urlWithLineAndColumn) => {
+    const inlineUrlMatch = urlWithLineAndColumn.match(
+      // eslint-disable-next-line regexp/no-unused-capturing-group
+      /@L([0-9]+)C([0-9]+)-L([0-9]+)C([0-9]+)\.\w+(:([0-9]+):([0-9]+))?$/,
+    );
+    if (inlineUrlMatch) {
+      const htmlUrl = urlWithLineAndColumn.slice(0, inlineUrlMatch.index);
+      const tagLineStart = parseInt(inlineUrlMatch[1]);
+      const tagColumnStart = parseInt(inlineUrlMatch[2]);
+      // const tagLineEnd = parseInt(inlineUrlMatch[3]);
+      // const tagColumnEnd = parseInt(inlineUrlMatch[4]);
+      const inlineLine =
+        inlineUrlMatch[6] === undefined
+          ? undefined
+          : parseInt(inlineUrlMatch[6]);
+      const inlineColumn =
+        inlineUrlMatch[7] === undefined
+          ? undefined
+          : parseInt(inlineUrlMatch[7]);
+      return {
+        file: htmlUrl,
+        ownerLine: tagLineStart,
+        ownerColumn: tagColumnStart,
+        inlineLine,
+        inlineColumn,
+        line:
+          inlineLine === undefined ? tagLineStart : tagLineStart + inlineLine,
+        column: inlineColumn === undefined ? tagColumnStart : inlineColumn,
+      };
+    }
+    const match = urlWithLineAndColumn.match(/:([0-9]+):([0-9]+)$/);
+    if (!match) {
+      return null;
+    }
+    const file = urlWithLineAndColumn.slice(0, match.index);
+    let line = parseInt(match[1]);
+    let column = parseInt(match[2]);
+    return {
+      file,
+      line,
+      column,
+    };
+  };
+
   return {
     name: "jsenv:supervisor",
     appliesDuring: "dev",
     serve: async (serveInfo) => {
       if (serveInfo.request.pathname.startsWith("/__get_cause_trace__/")) {
         const { pathname, searchParams } = new URL(serveInfo.request.url);
-        let urlWithLineAndColumn = pathname.slice(
-          "/__get_cause_trace__/".length,
+        const urlWithLineAndColumn = decodeURIComponent(
+          pathname.slice("/__get_cause_trace__/".length),
         );
-        urlWithLineAndColumn = decodeURIComponent(urlWithLineAndColumn);
-        const match = urlWithLineAndColumn.match(/:([0-9]+):([0-9]+)$/);
-        if (!match) {
+        const result = resolveUrlSite(urlWithLineAndColumn);
+        if (!result) {
           return {
             status: 400,
             body: "Missing line and column in url",
           };
         }
-        const file = urlWithLineAndColumn.slice(0, match.index);
-        let line = parseInt(match[1]);
-        let column = parseInt(match[2]);
+        let { file, line, column } = result;
         const urlInfo = serveInfo.kitchen.graph.getUrlInfo(file);
         if (!urlInfo) {
           return {
@@ -78,7 +119,6 @@ export const jsenvPluginSupervisor = ({
           }),
         };
         const causeTraceJson = JSON.stringify(causeTrace, null, "  ");
-
         return {
           status: 200,
           headers: {