@jsenv/core 23.8.3 → 23.8.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/core",
-  "version": "23.8.3",
+  "version": "23.8.9",
   "description": "Tool to develop, test and build js projects",
   "license": "MIT",
   "repository": {
@@ -67,10 +67,10 @@
     "@c88/v8-coverage": "0.1.1",
     "@jsenv/abort": "4.1.1",
     "@jsenv/filesystem": "2.5.1",
-    "@jsenv/importmap": "1.1.0",
+    "@jsenv/importmap": "1.2.0",
     "@jsenv/log": "1.4.0",
     "@jsenv/logger": "4.0.1",
-    "@jsenv/server": "10.0.9",
+    "@jsenv/server": "10.0.11",
     "@jsenv/uneval": "1.6.0",
     "@jsenv/workers": "1.2.0",
     "@rollup/plugin-commonjs": "21.0.0",
@@ -121,11 +121,11 @@
     "@babel/preset-env": "7.15.8",
     "@jsenv/assert": "2.3.2",
     "@jsenv/babel-preset": "./packages/jsenv-babel-preset",
-    "@jsenv/eslint-config": "16.0.8",
+    "@jsenv/eslint-config": "16.0.9",
     "@jsenv/github-release-package": "1.2.3",
-    "@jsenv/https-local": "1.0.2",
+    "@jsenv/https-local": "1.0.3",
     "@jsenv/importmap-eslint-resolver": "5.1.2",
-    "@jsenv/importmap-node-module": "2.4.1",
+    "@jsenv/importmap-node-module": "2.7.0",
     "@jsenv/package-publish": "1.6.2",
     "@jsenv/performance-impact": "2.2.1",
     "@jsenv/prettier-check-project": "5.6.1",

package/src/internal/{runtime/createBrowserRuntime → browser-launcher}/displayErrorInDocument.js

@@ -1,3 +1,5 @@
+/* eslint-env browser */
+
 export const displayErrorInDocument = (error) => {
   const title = "An error occured"
   let theme

package/src/internal/{runtime/createBrowserRuntime → browser-launcher}/displayErrorNotification.js

@@ -1,3 +1,4 @@
+/* eslint-env browser */
 const { Notification } = window
 
 const displayErrorNotificationNotAvailable = () => {}

package/src/internal/browser-launcher/executeHtmlFile.js

@@ -186,6 +186,14 @@ const executeSource = async ({
         coverage,
       }
     })
+  } else {
+    transformResult = composeTransformer(transformResult, (result) => {
+      const { namespace: fileExecutionResultMap } = result
+      Object.keys(fileExecutionResultMap).forEach((fileRelativeUrl) => {
+        delete fileExecutionResultMap[fileRelativeUrl].coverage
+      })
+      return result
+    })
   }
 
   const fileClientUrl = resolveUrl(fileRelativeUrl, `${compileServerOrigin}/`)

package/src/internal/browser-launcher/jsenv-browser-system.js

@@ -7,6 +7,9 @@ import { fetchUrl } from "../browser-utils/fetch-browser.js"
 import { fetchAndEvalUsingFetch } from "../browser-utils/fetchAndEvalUsingFetch.js"
 import { memoize } from "../memoize.js"
 
+import { displayErrorInDocument } from "./displayErrorInDocument.js"
+import { displayErrorNotification } from "./displayErrorNotification.js"
+
 const getNavigationStartTime = () => {
   try {
     return window.performance.timing.navigationStart
@@ -73,13 +76,15 @@ const executeFileUsingDynamicImport = async (
       const executionResult = {
         status: "completed",
         namespace,
+        coverage: readCoverage(),
       }
       return executionResult
     } catch (e) {
       performance.measure(`jsenv_file_import`, `jsenv_file_import_start`)
       const executionResult = {
         status: "errored",
-        exceptionSource: unevalException(e),
+        error: e,
+        coverage: readCoverage(),
       }
       onExecutionError(executionResult, { currentScript })
       return executionResult
@@ -112,16 +117,23 @@ const executeFileUsingSystemJs = (specifier) => {
   return fileExecutionResultPromise
 }
 
-const onExecutionError = (executionResult, { currentScript }) => {
-  // eslint-disable-next-line no-eval
-  const originalError = window.eval(executionResult.exceptionSource)
-  if (originalError.code === "NETWORK_FAILURE") {
+const onExecutionError = (
+  executionResult,
+  {
+    currentScript,
+    errorExposureInConsole = true,
+    errorExposureInNotification = false,
+    errorExposureInDocument = true,
+  },
+) => {
+  const error = executionResult.error
+  if (error.code === "NETWORK_FAILURE") {
     if (currentScript) {
       const errorEvent = new Event("error")
       currentScript.dispatchEvent(errorEvent)
     }
   } else {
-    const { parsingError } = originalError
+    const { parsingError } = error
     const globalErrorEvent = new Event("error")
     if (parsingError) {
       globalErrorEvent.filename = parsingError.filename
@@ -129,13 +141,26 @@ const onExecutionError = (executionResult, { currentScript }) => {
       globalErrorEvent.message = parsingError.message
       globalErrorEvent.colno = parsingError.columnNumber
     } else {
-      globalErrorEvent.filename = originalError.filename
-      globalErrorEvent.lineno = originalError.lineno
-      globalErrorEvent.message = originalError.message
-      globalErrorEvent.colno = originalError.columnno
+      globalErrorEvent.filename = error.filename
+      globalErrorEvent.lineno = error.lineno
+      globalErrorEvent.message = error.message
+      globalErrorEvent.colno = error.columnno
     }
     window.dispatchEvent(globalErrorEvent)
   }
+
+  if (errorExposureInConsole) {
+    console.error(error)
+  }
+  if (errorExposureInNotification) {
+    displayErrorNotification(error)
+  }
+  if (errorExposureInDocument) {
+    displayErrorInDocument(error)
+  }
+
+  executionResult.exceptionSource = unevalException(error)
+  delete executionResult.error
 }
 
 const getBrowserRuntime = memoize(async () => {
@@ -191,6 +216,8 @@ const getBrowserRuntime = memoize(async () => {
 
 const livereloadingCallbacks = {}
 
+const readCoverage = () => window.__coverage__
+
 window.__jsenv__ = {
   livereloadingCallbacks,
   executionResultPromise,

package/src/internal/building/buildUsingRollup.js

@@ -14,6 +14,7 @@ import {
   isNodePartOfSupportedRuntimes,
   isBrowserPartOfSupportedRuntimes,
 } from "@jsenv/core/src/internal/generateGroupMap/runtime_support.js"
+import { featuresCompatMap } from "@jsenv/core/src/internal/generateGroupMap/featuresCompatMap.js"
 import { createRuntimeCompat } from "@jsenv/core/src/internal/generateGroupMap/runtime_compat.js"
 import { createJsenvRollupPlugin } from "./createJsenvRollupPlugin.js"
 
@@ -71,16 +72,7 @@ export const buildUsingRollup = async ({
       import_assertion_type_json: true,
       import_assertion_type_css: true,
     },
-    pluginCompatMap: {
-      import_assertion_type_json: {
-        chrome: "91",
-        edge: "91",
-      },
-      import_assertion_type_css: {
-        chrome: "93",
-        edge: "93",
-      },
-    },
+    pluginCompatMap: featuresCompatMap,
   })
   const importAssertionsSupport = {
     json:

package/src/internal/compiling/compile-directory/compile-asset.js

@@ -2,6 +2,13 @@ import { urlToFilename } from "@jsenv/filesystem"
 
 export const urlIsCompilationAsset = (url) => {
   const filename = urlToFilename(url)
+
+  // sourcemap are not inside the asset folder because
+  // of https://github.com/microsoft/vscode-chrome-debug-core/issues/544
+  if (filename.endsWith(".map")) {
+    return true
+  }
+
   return filename.includes("__asset__")
 }
 

package/src/internal/compiling/compileFile.js

@@ -88,7 +88,9 @@ export const compileFile = async ({
     } = compileResult
 
     if (compileResultStatus !== "cached" && compileCacheStrategy !== "none") {
-      updateMeta({
+      // we MUST await updateMeta otherwise we might get 404
+      // when serving sourcemap files
+      await updateMeta({
         logger,
         meta,
         compileResult,
@@ -142,6 +144,7 @@ export const compileFile = async ({
         headers: {
           "content-length": Buffer.byteLength(compiledSource),
           "content-type": contentType,
+          "cache-control": "no-store",
           ...responseHeaders,
         },
         body: compiledSource,
@@ -158,12 +161,16 @@ export const compileFile = async ({
       ) {
         return {
           status: 304,
+          headers: {
+            "cache-control": "private,max-age=0,must-revalidate",
+          },
           timing,
         }
       }
       return respondUsingRAM((response) => {
         // eslint-disable-next-line dot-notation
         response.headers["etag"] = compiledEtag
+        response.headers["cache-control"] = "private,max-age=0,must-revalidate"
       })
     }
 
@@ -174,6 +181,9 @@ export const compileFile = async ({
       ) {
         return {
           status: 304,
+          headers: {
+            "cache-control": "private,max-age=0,must-revalidate",
+          },
           timing,
         }
       }
@@ -181,6 +191,7 @@ export const compileFile = async ({
         response.headers["last-modified"] = new Date(
           compiledMtime,
         ).toUTCString()
+        response.headers["cache-control"] = "private,max-age=0,must-revalidate"
       })
     }
 

package/src/internal/compiling/html_source_file_service.js

@@ -279,7 +279,6 @@ const inlineImportmapScripts = async ({ logger, htmlAst, htmlFileUrl }) => {
             },
           ),
         )
-
         return
       }
 

package/src/internal/compiling/js-compilation-service/jsenvTransform.js

@@ -206,7 +206,9 @@ export const jsenvTransform = async ({
         ...(moduleOutFormat === "systemjs"
           ? {
               "proposal-dynamic-import": [proposalDynamicImport],
-              "transform-modules-systemjs": [transformModulesSystemJs],
+              ...(moduleOutFormat === "systemjs"
+                ? { "transform-modules-systemjs": [transformModulesSystemJs] }
+                : {}),
             }
           : {}),
       }),

package/src/internal/compiling/jsenvCompilerForHtml.js

@@ -1,10 +1,13 @@
 import { resolveUrl, urlToRelativeUrl } from "@jsenv/filesystem"
+import { moveImportMap, composeTwoImportMaps } from "@jsenv/importmap"
+import { createDetailedMessage } from "@jsenv/logger"
 
 import {
   jsenvBrowserSystemFileInfo,
   jsenvToolbarHtmlFileInfo,
   jsenvToolbarInjectorFileInfo,
 } from "@jsenv/core/src/internal/jsenvInternalFiles.js"
+import { fetchUrl } from "@jsenv/core/src/internal/fetchUrl.js"
 import { getDefaultImportMap } from "@jsenv/core/src/internal/import-resolution/importmap-default.js"
 import {
   setJavaScriptSourceMappingUrl,
@@ -26,11 +29,10 @@ import {
   replaceHtmlNode,
 } from "./compileHtml.js"
 import { generateCompiledFileAssetUrl } from "./compile-directory/compile-asset.js"
-import { composeTwoImportMaps } from "@jsenv/importmap"
 
 export const compileHtml = async ({
   // cancellationToken,
-  // logger,
+  logger,
   // request,
   code,
   url,
@@ -89,17 +91,29 @@ export const compileHtml = async ({
 
   let hasImportmap = false
   const inlineScriptsContentMap = {}
+  const importmapsToInline = []
   scripts.forEach((script) => {
     const typeAttribute = getHtmlNodeAttributeByName(script, "type")
     const srcAttribute = getHtmlNodeAttributeByName(script, "src")
 
     // importmap
     if (typeAttribute && typeAttribute.value === "importmap") {
+      hasImportmap = true
+
       if (srcAttribute) {
-        hasImportmap = true
-        typeAttribute.value = "jsenv-importmap"
+        if (moduleOutFormat === "systemjs") {
+          typeAttribute.value = "jsenv-importmap"
+          return // no need to inline
+        }
+
+        // we force inline because browsers supporting importmap supports only when they are inline
+        importmapsToInline.push({
+          script,
+          src: srcAttribute.value,
+        })
         return
       }
+
       const defaultImportMap = getDefaultImportMap({
         importMapFileUrl: compiledUrl,
         projectDirectoryUrl,
@@ -107,40 +121,51 @@ export const compileHtml = async ({
       })
       const inlineImportMap = JSON.parse(getHtmlNodeTextNode(script).value)
       const mappings = composeTwoImportMaps(defaultImportMap, inlineImportMap)
-      hasImportmap = true
-      typeAttribute.value = "jsenv-importmap"
+      if (moduleOutFormat === "systemjs") {
+        typeAttribute.value = "jsenv-importmap"
+      }
       setHtmlNodeText(script, JSON.stringify(mappings, null, "  "))
       return
     }
 
+    // remote module script
     if (typeAttribute && typeAttribute.value === "module" && srcAttribute) {
-      removeHtmlNodeAttribute(script, typeAttribute)
+      if (moduleOutFormat === "systemjs") {
+        removeHtmlNodeAttribute(script, typeAttribute)
+      }
       removeHtmlNodeAttribute(script, srcAttribute)
+      const src = srcAttribute.value
+      const jsenvMethod =
+        moduleOutFormat === "systemjs"
+          ? "executeFileUsingSystemJs"
+          : "executeFileUsingDynamicImport"
       setHtmlNodeText(
         script,
-        `window.__jsenv__.executeFileUsingSystemJs(${JSON.stringify(
-          srcAttribute.value,
-        )})`,
+        `window.__jsenv__.${jsenvMethod}(${JSON.stringify(src)})`,
       )
       return
     }
-    // inline
+
+    // inline module script
     const textNode = getHtmlNodeTextNode(script)
     if (typeAttribute && typeAttribute.value === "module" && textNode) {
+      if (moduleOutFormat === "systemjs") {
+        removeHtmlNodeAttribute(script, typeAttribute)
+      }
+      removeHtmlNodeAttribute(script, srcAttribute)
       const scriptAssetUrl = generateCompiledFileAssetUrl(
         compiledUrl,
         getUniqueNameForInlineHtmlNode(script, scripts, `[id].js`),
       )
       const specifier = `./${urlToRelativeUrl(scriptAssetUrl, compiledUrl)}`
       inlineScriptsContentMap[specifier] = textNode.value
-
-      removeHtmlNodeAttribute(script, typeAttribute)
-      removeHtmlNodeAttribute(script, srcAttribute)
+      const jsenvMethod =
+        moduleOutFormat === "systemjs"
+          ? "executeFileUsingSystemJs"
+          : "executeFileUsingDynamicImport"
       setHtmlNodeText(
         script,
-        `window.__jsenv__.executeFileUsingSystemJs(${JSON.stringify(
-          specifier,
-        )})`,
+        `window.__jsenv__.${jsenvMethod}(${JSON.stringify(specifier)})`,
       )
       htmlDependencies.push({
         htmlNode: script,
@@ -149,17 +174,18 @@ export const compileHtml = async ({
       return
     }
   })
+
   if (hasImportmap === false) {
     const defaultImportMap = getDefaultImportMap({
       importMapFileUrl: compiledUrl,
       projectDirectoryUrl,
       compileDirectoryRelativeUrl: `${outDirectoryRelativeUrl}${compileId}/`,
     })
-
     manipulateHtmlAst(htmlAst, {
       scriptInjections: [
         {
-          type: "jsenv-importmap",
+          type:
+            moduleOutFormat === "systemjs" ? "jsenv-importmap" : "importmap",
           // in case there is no importmap, force the presence
           // so that '@jsenv/core/' are still remapped
           text: JSON.stringify(defaultImportMap, null, "  "),
@@ -168,6 +194,46 @@ export const compileHtml = async ({
     })
   }
 
+  await Promise.all(
+    importmapsToInline.map(async ({ script, src }) => {
+      const importMapUrl = resolveUrl(src, url)
+      const importMapResponse = await fetchUrl(importMapUrl)
+      if (importMapResponse.status !== 200) {
+        logger.warn(
+          createDetailedMessage(
+            importMapResponse.status === 404
+              ? `Cannot inline importmap script because file cannot be found.`
+              : `Cannot inline importmap script due to unexpected response status (${importMapResponse.status}).`,
+            {
+              "importmap script src": src,
+              "importmap url": importMapUrl,
+              "html url": url,
+            },
+          ),
+        )
+        return
+      }
+
+      const importMapContent = await importMapResponse.json()
+      const importMapInlined = moveImportMap(
+        importMapContent,
+        importMapUrl,
+        url,
+      )
+      replaceHtmlNode(
+        script,
+        `<script type="importmap">${JSON.stringify(
+          importMapInlined,
+          null,
+          "  ",
+        )}</script>`,
+        {
+          attributesToIgnore: ["src"],
+        },
+      )
+    }),
+  )
+
   const htmlAfterTransformation = stringifyHtmlAst(htmlAst)
 
   let assets = []

package/src/internal/compiling/startCompileServer.js

@@ -33,6 +33,8 @@ import { isBrowserPartOfSupportedRuntimes } from "@jsenv/core/src/internal/gener
 import { loadBabelPluginMapFromFile } from "./load_babel_plugin_map_from_file.js"
 import { extractSyntaxBabelPluginMap } from "./babel_plugins.js"
 import { generateGroupMap } from "../generateGroupMap/generateGroupMap.js"
+import { featuresCompatMap } from "@jsenv/core/src/internal/generateGroupMap/featuresCompatMap.js"
+import { createRuntimeCompat } from "@jsenv/core/src/internal/generateGroupMap/runtime_compat.js"
 import {
   jsenvCompileProxyFileInfo,
   sourcemapMainFileInfo,
@@ -69,8 +71,8 @@ export const startCompileServer = async ({
 
   // js compile options
   transformTopLevelAwait = true,
-  moduleOutFormat = "systemjs",
-  importMetaFormat = moduleOutFormat,
+  moduleOutFormat,
+  importMetaFormat,
   env = {},
   processEnvNodeEnv = process.env.NODE_ENV,
   replaceProcessEnvNodeEnv = true,
@@ -219,6 +221,15 @@ export const startCompileServer = async ({
     ...babelPluginMap,
   }
 
+  if (moduleOutFormat === undefined) {
+    moduleOutFormat = canAvoidSystemJs({ runtimeSupport })
+      ? "esmodule"
+      : "systemjs"
+  }
+  if (importMetaFormat === undefined) {
+    importMetaFormat = moduleOutFormat
+  }
+
   const serverStopCallbackList = createCallbackListNotifiedOnce()
 
   let projectFileRequestedCallback = () => {}
@@ -589,24 +600,33 @@ const setupServerSentEventsForLivereload = ({
     ...livereloadWatchConfig,
     [jsenvDirectoryRelativeUrl]: false,
   }
-  const unregisterDirectoryLifecyle = registerDirectoryLifecycle(
-    projectDirectoryUrl,
-    {
-      watchDescription,
-      updated: ({ relativeUrl }) => {
-        projectFileModified.notify(relativeUrl)
-      },
-      removed: ({ relativeUrl }) => {
-        projectFileRemoved.notify(relativeUrl)
-      },
-      added: ({ relativeUrl }) => {
-        projectFileAdded.notify(relativeUrl)
+
+  // wait 100ms to actually start watching
+  // otherwise server starting is delayed by the filesystem scan done in
+  // registerDirectoryLifecycle
+  const timeout = setTimeout(() => {
+    const unregisterDirectoryLifecyle = registerDirectoryLifecycle(
+      projectDirectoryUrl,
+      {
+        watchDescription,
+        updated: ({ relativeUrl }) => {
+          projectFileModified.notify(relativeUrl)
+        },
+        removed: ({ relativeUrl }) => {
+          projectFileRemoved.notify(relativeUrl)
+        },
+        added: ({ relativeUrl }) => {
+          projectFileAdded.notify(relativeUrl)
+        },
+        keepProcessAlive: false,
+        recursive: true,
       },
-      keepProcessAlive: false,
-      recursive: true,
-    },
-  )
-  serverStopCallbackList.add(unregisterDirectoryLifecyle)
+    )
+    serverStopCallbackList.add(unregisterDirectoryLifecyle)
+  }, 100)
+  serverStopCallbackList.add(() => {
+    clearTimeout(timeout)
+  })
 
   const getDependencySet = (mainRelativeUrl) => {
     if (trackerMap.has(mainRelativeUrl)) {
@@ -1040,6 +1060,20 @@ const createCompileProxyService = ({ projectDirectoryUrl }) => {
   }
 }
 
+const canAvoidSystemJs = ({ runtimeSupport }) => {
+  const runtimeCompatMap = createRuntimeCompat({
+    runtimeSupport,
+    pluginMap: {
+      module: true,
+      importmap: true,
+      import_assertion_type_json: true,
+      import_assertion_type_css: true,
+    },
+    pluginCompatMap: featuresCompatMap,
+  })
+  return runtimeCompatMap.pluginRequiredNameArray.length === 0
+}
+
 const readPackage = (packagePath) => {
   const buffer = readFileSync(packagePath)
   const string = String(buffer)

package/src/internal/executing/coverage/reportToCoverage.js

@@ -118,7 +118,13 @@ export const reportToCoverage = async (
       fileByFileCoverage,
       babelPluginMap,
     })
-    Object.assign(fileByFileCoverage, missingFileByFileCoverage)
+    Object.assign(
+      fileByFileCoverage,
+      normalizeFileByFileCoveragePaths(
+        missingFileByFileCoverage,
+        projectDirectoryUrl,
+      ),
+    )
   }
 
   return fileByFileCoverage

package/src/internal/generateGroupMap/featuresCompatMap.js

@@ -0,0 +1,29 @@
+// https://github.com/babel/babel/blob/master/packages/babel-compat-data/data/native-modules.json#L1
+
+export const featuresCompatMap = {
+  module: {
+    edge: "16",
+    firefox: "60",
+    chrome: "61",
+    safari: "10.1",
+    opera: "48",
+    ios: "10.3",
+    android: "61",
+    samsung: "8.2",
+  },
+  // https://caniuse.com/import-maps
+  importmap: {
+    edge: "89",
+    chrome: "89",
+    opera: "76",
+    samsung: "15",
+  },
+  import_assertion_type_json: {
+    chrome: "91",
+    edge: "91",
+  },
+  import_assertion_type_css: {
+    chrome: "93",
+    edge: "93",
+  },
+}

package/src/internal/generateGroupMap/jsenvBabelPluginCompatMap.js

@@ -443,14 +443,7 @@ jsenvBabelPluginCompatMap["global-this-as-jsenv-import"] = {
   node: "12",
 }
 
-// jsenvBabelPluginCompatMap["transform-import-assertion-json"] = {
-//   chrome: "91",
-//   edge: "91",
-// }
-// jsenvBabelPluginCompatMap["transform-import-assertion-css"] = {
-//   chrome: "93",
-//   edge: "93",
-// }
+// needs support for both json and css
 jsenvBabelPluginCompatMap["transform-import-assertions"] = {
   chrome: "93",
   edge: "93",