@jsenv/plugin-supervisor 1.7.3 → 1.7.5

package/dist/js/supervisor.js

@@ -983,11 +983,11 @@ window.__supervisor__ = (() => {
             const {
               trace = {}
             } = cause;
-            const preferCause = cause.code === "MODULE_NOT_FOUND" || cause.code === "PROTOCOL_NOT_SUPPORTED";
+            const preferCause = cause.code === "MODULE_NOT_FOUND" || cause.code === "PROTOCOL_NOT_SUPPORTED" || cause.code === "PARSE_ERROR";
             const dataToRender = preferCause ? cause : exception;
             root.querySelector(".text").innerHTML = stringifyStack({
               codeFrame: trace.codeFrame ? generateClickableText(trace.codeFrame) : "",
-              name: dataToRender.name,
+              name: cause.parseErrorSourceType === "css" ? "CSSSyntaxError" : dataToRender.name,
               message: preferCause ? generateClickableText(cause.reason) : dataToRender.message ? generateClickableText(dataToRender.message) : "",
               stackTrace: dataToRender.stackTrace ? generateClickableText(dataToRender.stackTrace) : ""
             });
@@ -1136,7 +1136,7 @@ window.__supervisor__ = (() => {
       if (customElements && !customElements.get(JSENV_ERROR_OVERLAY_TAGNAME)) {
         customElements.define(JSENV_ERROR_OVERLAY_TAGNAME, JsenvErrorOverlay);
       }
-      const overlayCSS = "\n  :host {\n    position: fixed;\n    z-index: 99999;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    overflow-y: scroll;\n    margin: 0;\n    background: rgba(0, 0, 0, 0.66);\n  }\n  \n  .backdrop {\n    position: absolute;\n    left: 0;\n    right: 0;\n    top: 0;\n    bottom: 0;\n  }\n  \n  .overlay {\n    position: relative;\n    background: rgba(0, 0, 0, 0.95);\n    width: 800px;\n    margin: 30px auto;\n    padding: 25px 40px;\n    padding-top: 0;\n    overflow: hidden; /* for h1 margins */\n    border-radius: 4px 8px;\n    box-shadow: 0 20px 40px rgb(0 0 0 / 30%), 0 15px 12px rgb(0 0 0 / 20%);\n    box-sizing: border-box;\n    font-family: monospace;\n    direction: ltr;\n  }\n  \n  h1 {\n    color: red;\n    text-align: center;\n  }\n  \n  pre {\n    overflow: auto;\n    max-width: 100%;\n    /* padding is nice + prevents scrollbar from hiding the text behind it */\n    /* does not work nicely on firefox though https://bugzilla.mozilla.org/show_bug.cgi?id=748518 */\n    padding: 20px; \n  }\n  \n  .tip {\n    border-top: 1px solid #999;\n    padding-top: 12px;\n  }\n  \n  [data-theme=\"dark\"] {\n    color: #999;\n  }\n  [data-theme=\"dark\"] pre {\n    background: #111;\n    border: 1px solid #333;\n    color: #eee;\n  }\n  \n  [data-theme=\"light\"] {\n    color: #EEEEEE;\n  }\n  [data-theme=\"light\"] pre {\n    background: #1E1E1E;\n    border: 1px solid white;\n    color: #EEEEEE;\n  }\n  \n  pre a {\n    color: inherit;\n  }";
+      const overlayCSS = /* css */"\n        :host {\n          position: fixed;\n          z-index: 99999;\n          top: 0;\n          left: 0;\n          width: 100%;\n          height: 100%;\n          /* overflow-y: scroll; */\n          margin: 0;\n          background: rgba(0, 0, 0, 0.66);\n        }\n\n        .backdrop {\n          position: absolute;\n          left: 0;\n          right: 0;\n          top: 0;\n          bottom: 0;\n        }\n\n        .overlay {\n          position: relative;\n          background: rgba(0, 0, 0, 0.95);\n          width: 800px;\n          max-width: 100vw;\n          margin: 30px auto;\n          padding: 25px 40px;\n          padding-top: 0;\n          overflow: hidden; /* for h1 margins */\n          border-radius: 4px 8px;\n          box-shadow:\n            0 20px 40px rgb(0 0 0 / 30%),\n            0 15px 12px rgb(0 0 0 / 20%);\n          box-sizing: border-box;\n          font-family: monospace;\n          direction: ltr;\n        }\n\n        h1 {\n          color: red;\n          text-align: center;\n        }\n\n        pre {\n          overflow: auto;\n          max-width: 100%;\n          /* padding is nice + prevents scrollbar from hiding the text behind it */\n          /* does not work nicely on firefox though https://bugzilla.mozilla.org/show_bug.cgi?id=748518 */\n          padding: 20px;\n        }\n\n        .tip {\n          border-top: 1px solid #999;\n          padding-top: 12px;\n        }\n\n        [data-theme=\"dark\"] {\n          color: #999;\n        }\n        [data-theme=\"dark\"] pre {\n          background: #111;\n          border: 1px solid #333;\n          color: #eee;\n        }\n\n        [data-theme=\"light\"] {\n          color: #eeeeee;\n        }\n        [data-theme=\"light\"] pre {\n          background: #1e1e1e;\n          border: 1px solid white;\n          color: #eeeeee;\n        }\n\n        pre a {\n          color: inherit;\n        }\n      ";
     }
     supervisor.createException = createException;
     supervisor.reportException = exception => {

package/dist/jsenv_plugin_supervisor.js

@@ -921,6 +921,7 @@ const jsenvPluginSupervisor = ({
           name: errorCausingRuntimeError.name,
           message: errorCausingRuntimeError.message,
           reason: errorCausingRuntimeError.reason,
+          parseErrorSourceType: errorCausingRuntimeError.parseErrorSourceType,
           stack: errorBaseUrl ? "stack mocked for snapshot" : errorCausingRuntimeError.stack,
           trace: errorCausingRuntimeError.trace,
           isJsenvCookingError: errorCausingRuntimeError.isJsenvCookingError
@@ -979,10 +980,20 @@ const jsenvPluginSupervisor = ({
               contentType: "text/javascript",
               content: textContent
             });
-            for (const key of Object.keys(htmlUrlInfo.contentInjections)) {
-              const value = htmlUrlInfo.contentInjections[key];
-              if (htmlUrlInfo.context.isPlaceholderInjection(value)) {
-                inlineScriptReference.urlInfo.contentInjections[key] = value;
+            const htmlContentInjections = htmlUrlInfo.contentInjections;
+            const {
+              isPlaceholderInjection,
+              INJECTIONS
+            } = htmlUrlInfo.context;
+            for (const key of Object.keys(htmlContentInjections)) {
+              const injection = htmlUrlInfo.contentInjections[key];
+              if (isPlaceholderInjection(injection)) {
+                inlineScriptReference.urlInfo.contentInjections[key] = injection;
+                // ideally we should mark injection as optional only if it's
+                // hapenning for inline content
+                // but for now we'll just mark all html injections as optional
+                // when there is an inline script
+                htmlContentInjections[key] = INJECTIONS.optional(injection);
               }
             }
             return inlineScriptReference.generatedSpecifier;

package/package.json

@@ -1,15 +1,16 @@
 {
   "name": "@jsenv/plugin-supervisor",
-  "version": "1.7.3",
-  "license": "MIT",
+  "version": "1.7.5",
   "repository": {
     "type": "git",
     "url": "https://github.com/jsenv/core",
     "directory": "packages/internal/plugin-supervisor"
   },
-  "publishConfig": {
-    "access": "public"
-  },
+  "license": "MIT",
+  "sideEffects": [
+    "./src/client/supervisor.js",
+    "./dist/js/supervisor.js"
+  ],
   "type": "module",
   "exports": {
     ".": {
@@ -25,23 +26,22 @@
     "/src/",
     "/dist/"
   ],
-  "sideEffects": [
-    "./src/client/supervisor.js",
-    "./dist/js/supervisor.js"
-  ],
   "scripts": {
     "build": "node ./scripts/build.mjs",
     "prepublishOnly": "npm run build"
   },
   "dependencies": {
-    "@jsenv/ast": "6.7.6",
-    "@jsenv/sourcemap": "1.3.9"
+    "@jsenv/ast": "6.7.8",
+    "@jsenv/sourcemap": "1.3.10"
   },
   "devDependencies": {
-    "@jsenv/urls": "../../tooling/urls",
-    "@jsenv/snapshot": "../../tooling/snapshot",
+    "@jsenv/core": "../../../",
     "@jsenv/filesystem": "../../backend/filesystem",
     "@jsenv/humanize": "../../tooling/humanize",
-    "@jsenv/core": "../../../"
+    "@jsenv/snapshot": "../../tooling/snapshot",
+    "@jsenv/urls": "../../tooling/urls"
+  },
+  "publishConfig": {
+    "access": "public"
   }
 }

package/src/client/supervisor.js

@@ -984,13 +984,17 @@ window.__supervisor__ = (() => {
             const { trace = {} } = cause;
             const preferCause =
               cause.code === "MODULE_NOT_FOUND" ||
-              cause.code === "PROTOCOL_NOT_SUPPORTED";
+              cause.code === "PROTOCOL_NOT_SUPPORTED" ||
+              cause.code === "PARSE_ERROR";
             const dataToRender = preferCause ? cause : exception;
             root.querySelector(".text").innerHTML = stringifyStack({
               codeFrame: trace.codeFrame
                 ? generateClickableText(trace.codeFrame)
                 : "",
-              name: dataToRender.name,
+              name:
+                cause.parseErrorSourceType === "css"
+                  ? "CSSSyntaxError"
+                  : dataToRender.name,
               message: preferCause
                 ? generateClickableText(cause.reason)
                 : dataToRender.message
@@ -1158,81 +1162,85 @@ window.__supervisor__ = (() => {
         customElements.define(JSENV_ERROR_OVERLAY_TAGNAME, JsenvErrorOverlay);
       }
 
-      const overlayCSS = `
-  :host {
-    position: fixed;
-    z-index: 99999;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    overflow-y: scroll;
-    margin: 0;
-    background: rgba(0, 0, 0, 0.66);
-  }
-  
-  .backdrop {
-    position: absolute;
-    left: 0;
-    right: 0;
-    top: 0;
-    bottom: 0;
-  }
-  
-  .overlay {
-    position: relative;
-    background: rgba(0, 0, 0, 0.95);
-    width: 800px;
-    margin: 30px auto;
-    padding: 25px 40px;
-    padding-top: 0;
-    overflow: hidden; /* for h1 margins */
-    border-radius: 4px 8px;
-    box-shadow: 0 20px 40px rgb(0 0 0 / 30%), 0 15px 12px rgb(0 0 0 / 20%);
-    box-sizing: border-box;
-    font-family: monospace;
-    direction: ltr;
-  }
-  
-  h1 {
-    color: red;
-    text-align: center;
-  }
-  
-  pre {
-    overflow: auto;
-    max-width: 100%;
-    /* padding is nice + prevents scrollbar from hiding the text behind it */
-    /* does not work nicely on firefox though https://bugzilla.mozilla.org/show_bug.cgi?id=748518 */
-    padding: 20px; 
-  }
-  
-  .tip {
-    border-top: 1px solid #999;
-    padding-top: 12px;
-  }
-  
-  [data-theme="dark"] {
-    color: #999;
-  }
-  [data-theme="dark"] pre {
-    background: #111;
-    border: 1px solid #333;
-    color: #eee;
-  }
-  
-  [data-theme="light"] {
-    color: #EEEEEE;
-  }
-  [data-theme="light"] pre {
-    background: #1E1E1E;
-    border: 1px solid white;
-    color: #EEEEEE;
-  }
-  
-  pre a {
-    color: inherit;
-  }`;
+      const overlayCSS = /* css */ `
+        :host {
+          position: fixed;
+          z-index: 99999;
+          top: 0;
+          left: 0;
+          width: 100%;
+          height: 100%;
+          /* overflow-y: scroll; */
+          margin: 0;
+          background: rgba(0, 0, 0, 0.66);
+        }
+
+        .backdrop {
+          position: absolute;
+          left: 0;
+          right: 0;
+          top: 0;
+          bottom: 0;
+        }
+
+        .overlay {
+          position: relative;
+          background: rgba(0, 0, 0, 0.95);
+          width: 800px;
+          max-width: 100vw;
+          margin: 30px auto;
+          padding: 25px 40px;
+          padding-top: 0;
+          overflow: hidden; /* for h1 margins */
+          border-radius: 4px 8px;
+          box-shadow:
+            0 20px 40px rgb(0 0 0 / 30%),
+            0 15px 12px rgb(0 0 0 / 20%);
+          box-sizing: border-box;
+          font-family: monospace;
+          direction: ltr;
+        }
+
+        h1 {
+          color: red;
+          text-align: center;
+        }
+
+        pre {
+          overflow: auto;
+          max-width: 100%;
+          /* padding is nice + prevents scrollbar from hiding the text behind it */
+          /* does not work nicely on firefox though https://bugzilla.mozilla.org/show_bug.cgi?id=748518 */
+          padding: 20px;
+        }
+
+        .tip {
+          border-top: 1px solid #999;
+          padding-top: 12px;
+        }
+
+        [data-theme="dark"] {
+          color: #999;
+        }
+        [data-theme="dark"] pre {
+          background: #111;
+          border: 1px solid #333;
+          color: #eee;
+        }
+
+        [data-theme="light"] {
+          color: #eeeeee;
+        }
+        [data-theme="light"] pre {
+          background: #1e1e1e;
+          border: 1px solid white;
+          color: #eeeeee;
+        }
+
+        pre a {
+          color: inherit;
+        }
+      `;
     }
 
     supervisor.createException = createException;

package/src/jsenv_plugin_supervisor.js

@@ -187,6 +187,8 @@ export const jsenvPluginSupervisor = ({
                   name: errorCausingRuntimeError.name,
                   message: errorCausingRuntimeError.message,
                   reason: errorCausingRuntimeError.reason,
+                  parseErrorSourceType:
+                    errorCausingRuntimeError.parseErrorSourceType,
                   stack: errorBaseUrl
                     ? `stack mocked for snapshot`
                     : errorCausingRuntimeError.stack,
@@ -257,10 +259,19 @@ export const jsenvPluginSupervisor = ({
                   contentType: "text/javascript",
                   content: textContent,
                 });
-              for (const key of Object.keys(htmlUrlInfo.contentInjections)) {
-                const value = htmlUrlInfo.contentInjections[key];
-                if (htmlUrlInfo.context.isPlaceholderInjection(value)) {
-                  inlineScriptReference.urlInfo.contentInjections[key] = value;
+              const htmlContentInjections = htmlUrlInfo.contentInjections;
+              const { isPlaceholderInjection, INJECTIONS } =
+                htmlUrlInfo.context;
+              for (const key of Object.keys(htmlContentInjections)) {
+                const injection = htmlUrlInfo.contentInjections[key];
+                if (isPlaceholderInjection(injection)) {
+                  inlineScriptReference.urlInfo.contentInjections[key] =
+                    injection;
+                  // ideally we should mark injection as optional only if it's
+                  // hapenning for inline content
+                  // but for now we'll just mark all html injections as optional
+                  // when there is an inline script
+                  htmlContentInjections[key] = INJECTIONS.optional(injection);
                 }
               }
               return inlineScriptReference.generatedSpecifier;