@jsenv/core 24.2.1 → 24.3.3

package/src/internal/browser_launcher/browser_runtime_report.js

@@ -0,0 +1,75 @@
+export const getBrowserRuntimeReport = async ({
+  page,
+  coverageHandledFromOutside,
+  runtime,
+  compileServerId,
+}) => {
+  const cache = cacheFromParams({
+    runtime,
+    compileServerId,
+    coverageHandledFromOutside,
+  })
+  const entry = cache.read()
+  if (entry) {
+    return entry
+  }
+  const browserRuntimeFeaturesReport = await page.evaluate(
+    /* istanbul ignore next */
+    async ({ coverageHandledFromOutside }) => {
+      // eslint-disable-next-line no-undef
+      await window.readyPromise
+
+      // eslint-disable-next-line no-undef
+      return window.scanBrowserRuntimeFeatures({
+        coverageHandledFromOutside,
+        failFastOnFeatureDetection: true,
+      })
+    },
+    { coverageHandledFromOutside },
+  )
+  cache.write(browserRuntimeFeaturesReport)
+  return browserRuntimeFeaturesReport
+}
+
+let currentCacheParams
+let currentCacheValue
+const cacheFromParams = ({
+  runtime,
+  compileServerId,
+  coverageHandledFromOutside,
+}) => {
+  const params = {
+    compileServerId,
+    coverageHandledFromOutside,
+  }
+  const runtimeLabel = `${runtime.name}/${runtime.version}`
+
+  if (!currentCacheParams) {
+    currentCacheParams = params
+    currentCacheValue = {}
+    return {
+      read: () => null,
+      write: (value) => {
+        currentCacheValue[runtimeLabel] = value
+      },
+    }
+  }
+
+  if (JSON.stringify(currentCacheParams) !== JSON.stringify(params)) {
+    return {
+      read: () => null,
+      write: (value) => {
+        currentCacheParams = params
+        currentCacheValue = {}
+        currentCacheValue[runtimeLabel] = value
+      },
+    }
+  }
+
+  return {
+    read: () => currentCacheValue[runtimeLabel],
+    write: (value) => {
+      currentCacheValue[runtimeLabel] = value
+    },
+  }
+}

package/src/internal/{browser-launcher → browser_launcher}/executeHtmlFile.js

@@ -5,18 +5,21 @@ import {
   urlToExtension,
 } from "@jsenv/filesystem"
 
-import { jsenvCompileProxyHtmlFileInfo } from "@jsenv/core/src/internal/jsenvInternalFiles.js"
+import { COMPILE_PROXY_BUILD_URL } from "@jsenv/core/dist/build_manifest.js"
 import { filterV8Coverage } from "@jsenv/core/src/internal/executing/coverage_utils/v8_coverage_from_directory.js"
 import { composeTwoFileByFileIstanbulCoverages } from "@jsenv/core/src/internal/executing/coverage_utils/istanbul_coverage_composition.js"
-import { evalSource } from "../runtime/createNodeRuntime/evalSource.js"
+import { evalSource } from "../node_runtime/evalSource.js"
 import { escapeRegexpSpecialCharacters } from "../escapeRegexpSpecialCharacters.js"
+import { getBrowserRuntimeReport } from "./browser_runtime_report.js"
 
 export const executeHtmlFile = async (
   fileRelativeUrl,
   {
+    runtime,
     executeOperation,
     projectDirectoryUrl,
     compileServerOrigin,
+    compileServerId,
     outDirectoryRelativeUrl,
     page,
 
@@ -39,7 +42,7 @@ export const executeHtmlFile = async (
   await assertFilePresence(fileUrl)
 
   const compileProxyProjectRelativeUrl = urlToRelativeUrl(
-    jsenvCompileProxyHtmlFileInfo.url,
+    COMPILE_PROXY_BUILD_URL,
     projectDirectoryUrl,
   )
   const compileProxyClientUrl = resolveUrl(
@@ -48,22 +51,16 @@ export const executeHtmlFile = async (
   )
   executeOperation.throwIfAborted()
   await page.goto(compileProxyClientUrl)
+  executeOperation.throwIfAborted()
 
   const coverageHandledFromOutside =
     coveragePlaywrightAPIAvailable && !coverageForceIstanbul
-
-  executeOperation.throwIfAborted()
-  const browserRuntimeFeaturesReport = await page.evaluate(
-    /* istanbul ignore next */
-    ({ coverageHandledFromOutside }) => {
-      // eslint-disable-next-line no-undef
-      return window.scanBrowserRuntimeFeatures({
-        coverageHandledFromOutside,
-        failFastOnFeatureDetection: true,
-      })
-    },
-    { coverageHandledFromOutside },
-  )
+  const browserRuntimeFeaturesReport = await getBrowserRuntimeReport({
+    page,
+    coverageHandledFromOutside,
+    compileServerId,
+    runtime,
+  })
 
   try {
     let executionResult

package/src/internal/{browser-launcher/jsenv-browser-system.js → browser_runtime/browser_runtime.js}

@@ -1,14 +1,14 @@
 /* eslint-env browser */
 
-import { unevalException } from "../unevalException.js"
-import { createBrowserRuntime } from "../runtime/createBrowserRuntime/createBrowserRuntime.js"
 import { installBrowserErrorStackRemapping } from "../error-stack-remapping/installBrowserErrorStackRemapping.js"
-import { fetchUrl } from "../browser-utils/fetch-browser.js"
-import { fetchAndEvalUsingFetch } from "../browser-utils/fetchAndEvalUsingFetch.js"
+import { fetchUrl } from "../browser_utils/fetch-browser.js"
+import { fetchAndEvalUsingFetch } from "../browser_utils/fetchAndEvalUsingFetch.js"
+import { unevalException } from "../unevalException.js"
 import { memoize } from "../memoize.js"
 
 import { displayErrorInDocument } from "./displayErrorInDocument.js"
 import { displayErrorNotification } from "./displayErrorNotification.js"
+import { createBrowserRuntime } from "./createBrowserRuntime.js"
 
 const getNavigationStartTime = () => {
   try {

package/src/internal/{runtime/createBrowserRuntime/createBrowserSystem.js → browser_runtime/browser_system.js}

@@ -1,6 +1,7 @@
-import { getJavaScriptModuleResponseError } from "../module-registration.js"
+/* eslint-env browser */
 
-import "../s.js"
+import { getJavaScriptModuleResponseError } from "../runtime/module-registration.js"
+import "../runtime/s.js"
 
 export const createBrowserSystem = ({
   compileServerOrigin,

package/src/internal/{runtime/createBrowserRuntime → browser_runtime}/createBrowserRuntime.js

@@ -1,12 +1,14 @@
+/* eslint-env browser */
+
 import { normalizeImportMap } from "@jsenv/importmap/src/normalizeImportMap.js"
 
 // do not use memoize from @jsenv/filesystem to avoid pulling @jsenv/filesystem code into the browser build
-import { memoize } from "../../memoize.js"
-import { fetchUrl } from "../../browser-utils/fetch-browser.js"
-import { createImportResolverForImportmap } from "../../import-resolution/import-resolver-importmap.js"
-import { measureAsyncFnPerf } from "../../perf_browser.js"
+import { fetchUrl } from "../browser_utils/fetch-browser.js"
+import { createImportResolverForImportmap } from "../import-resolution/import-resolver-importmap.js"
+import { memoize } from "../memoize.js"
+import { measureAsyncFnPerf } from "../perf_browser.js"
 
-import { createBrowserSystem } from "./createBrowserSystem.js"
+import { createBrowserSystem } from "./browser_system.js"
 import { makeNamespaceTransferable } from "./makeNamespaceTransferable.js"
 
 const memoizedCreateBrowserSystem = memoize(createBrowserSystem)

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

@@ -3,10 +3,8 @@ const { Notification } = window
 
 const displayErrorNotificationNotAvailable = () => {}
 
-const displayErrorNotificationImplementation = async (error, { icon } = {}) => {
-  const permission = await Notification.requestPermission()
-
-  if (permission === "granted") {
+const displayErrorNotificationImplementation = (error, { icon } = {}) => {
+  if (Notification.permission === "granted") {
     const notification = new Notification("An error occured", {
       lang: "en",
       body: error.stack,

package/src/internal/{runtime/createBrowserRuntime → browser_runtime}/evalSource.js

@@ -1,3 +1,5 @@
+/* eslint-env browser */
+
 export const evalSource = (code, href) => {
   // eslint-disable-next-line no-eval
   return window.eval(appendSourceURL(code, href))

package/src/internal/{browser-utils → browser_utils}/fetch-browser.js

@@ -1,3 +1,5 @@
+/* eslint-env browser */
+
 import { fetchUsingXHR } from "./fetchUsingXHR.js"
 
 const fetchNative = async (url, { mode = "cors", ...options } = {}) => {

package/src/internal/{browser-utils → browser_utils}/fetchAndEvalUsingFetch.js

@@ -1,4 +1,7 @@
+/* eslint-env browser */
+
 import { createDetailedMessage } from "@jsenv/logger"
+
 import { fetchUrl } from "./fetch-browser.js"
 
 export const fetchAndEvalUsingFetch = async (url) => {

package/src/internal/{browser-utils → browser_utils}/fetchAndEvalUsingScript.js

@@ -1,3 +1,5 @@
+/* eslint-env browser */
+
 export const fetchAndEvalUsingScript = async (src) => {
   return new Promise((resolve, reject) => {
     const script = document.createElement("script")

package/src/internal/{browser-utils → browser_utils}/fetchUsingXHR.js

@@ -1,4 +1,4 @@
-import { createDetailedMessage } from "@jsenv/logger"
+/* eslint-env browser */
 
 export const fetchUsingXHR = async (
   url,
@@ -206,9 +206,9 @@ const hasSearchParams = typeof window.URLSearchParams === "function"
 
 const createRequestError = (error, { url }) => {
   return new Error(
-    createDetailedMessage(`error during xhr request on ${url}.`, {
-      ["error stack"]: error.stack,
-    }),
+    `error during xhr request on ${url}.
+--- error stack ---
+${error.stack}`,
   )
 }
 

package/src/internal/building/buildUsingRollup.js

@@ -50,8 +50,10 @@ export const buildUsingRollup = async ({
   importPaths,
 
   urlVersioning,
+  urlVersionningForEntryPoints,
   lineBreakNormalization,
   jsConcatenation,
+  cssConcatenation,
   useImportMapToMaximizeCacheReuse,
   preserveEntrySignatures,
   treeshake,
@@ -121,8 +123,10 @@ export const buildUsingRollup = async ({
     importPaths,
 
     urlVersioning,
+    urlVersionningForEntryPoints,
     lineBreakNormalization,
     jsConcatenation,
+    cssConcatenation,
     useImportMapToMaximizeCacheReuse,
 
     minify,

package/src/internal/building/createJsenvRollupPlugin.js

@@ -12,6 +12,7 @@ import {
   urlIsInsideOf,
   normalizeStructuredMetaMap,
   urlToMeta,
+  urlToBasename,
 } from "@jsenv/filesystem"
 import { UNICODE } from "@jsenv/log"
 
@@ -72,8 +73,10 @@ export const createJsenvRollupPlugin = async ({
   importAssertionsSupport,
 
   urlVersioning,
+  urlVersionningForEntryPoints,
   lineBreakNormalization,
   jsConcatenation,
+  cssConcatenation,
   useImportMapToMaximizeCacheReuse,
 
   minify,
@@ -468,6 +471,7 @@ export const createJsenvRollupPlugin = async ({
               minifyJs,
               minifyHtml,
               minifyCssOptions,
+              cssConcatenation,
             })
           },
         },
@@ -586,9 +590,10 @@ export const createJsenvRollupPlugin = async ({
               atleastOneChunkEmitted = true
               emitChunk({
                 id: ensureRelativeUrlNotation(entryProjectRelativeUrl),
-                name: entryBuildRelativeUrl,
-                // don't hash js entry points
-                fileName: entryBuildRelativeUrl,
+                name: urlToBasename(`file:///${entryBuildRelativeUrl}`),
+                ...(urlVersionningForEntryPoints
+                  ? {}
+                  : { fileName: entryBuildRelativeUrl }),
               })
               return
             }
@@ -601,15 +606,16 @@ export const createJsenvRollupPlugin = async ({
                 `Unusual content type for entry point, got "${entryContentType}" for ${entryProjectRelativeUrl}`,
               )
             }
-            const entryUrl = resolveUrl(
-              entryProjectRelativeUrl,
-              compileServerOrigin,
-            )
+            const entryUrl =
+              entryContentType === "text/html"
+                ? resolveUrl(entryProjectRelativeUrl, compileServerOrigin)
+                : resolveUrl(entryProjectRelativeUrl, compileDirectoryRemoteUrl)
             await ressourceBuilder.createReferenceForEntryPoint({
               entryContentType,
               entryUrl,
               entryBuffer,
               entryBuildRelativeUrl,
+              urlVersionningForEntryPoints,
             })
           },
         ),
@@ -1015,6 +1021,9 @@ export const createJsenvRollupPlugin = async ({
         return id
       }
       outputOptions.entryFileNames = () => {
+        if (urlVersionningForEntryPoints) {
+          return `[name]-[hash]${outputExtension}`
+        }
         return `[name]${outputExtension}`
       }
       outputOptions.chunkFileNames = () => {
@@ -1097,7 +1106,9 @@ export const createJsenvRollupPlugin = async ({
         const file = jsChunks[fileName]
         let buildRelativeUrl
         const canBeVersioned =
-          asRollupUrl(file.url) in jsModulesFromEntry || !file.isEntry
+          asRollupUrl(file.url) in jsModulesFromEntry ||
+          urlVersionningForEntryPoints ||
+          !file.isEntry
 
         if (urlVersioning) {
           if (canBeVersioned && useImportMapToMaximizeCacheReuse) {
@@ -1133,7 +1144,6 @@ export const createJsenvRollupPlugin = async ({
           buildInlineFileContents[buildRelativeUrl] = file.code
         } else {
           markBuildRelativeUrlAsUsedByJs(buildRelativeUrl)
-          buildManifest[fileName] = buildRelativeUrl
           buildMappings[originalProjectRelativeUrl] = buildRelativeUrl
         }
       })

package/src/internal/building/css/applyPostCss.js

@@ -1,23 +1,35 @@
 import { urlToFileSystemPath } from "@jsenv/filesystem"
 
-export const applyPostCss = async (
-  cssString,
-  cssUrl,
+export const applyPostCss = async ({
+  code,
+  url,
+  map,
+  sourcemapMethod = "comment",
   plugins,
   // https://github.com/postcss/postcss#options
   options = {},
-) => {
+}) => {
   const { default: postcss } = await import("postcss")
 
-  let result
   try {
-    const cssFileUrl = urlToFileUrl(cssUrl)
-    result = await postcss(plugins).process(cssString, {
+    const cssFileUrl = urlToFileUrl(url)
+    const result = await postcss(plugins).process(code, {
       collectUrls: true,
       from: urlToFileSystemPath(cssFileUrl),
       to: urlToFileSystemPath(cssFileUrl),
+      map: {
+        annotation: sourcemapMethod === "comment",
+        inline: sourcemapMethod === "inline",
+        // https://postcss.org/api/#sourcemapoptions
+        ...(map ? { prev: JSON.stringify(map) } : {}),
+      },
       ...options,
     })
+    return {
+      code: result.css,
+      map: result.map.toJSON(),
+      postCssMessages: result.messages,
+    }
   } catch (error) {
     if (error.name === "CssSyntaxError") {
       console.error(String(error))
@@ -25,7 +37,6 @@ export const applyPostCss = async (
     }
     throw error
   }
-  return result
 }
 
 // the goal of this function is to take an url that is likely an http url

package/src/internal/building/css/moveCssUrls.js

@@ -0,0 +1,44 @@
+import { urlToRelativeUrl } from "@jsenv/filesystem"
+
+import { applyPostCss } from "./applyPostCss.js"
+import { postCssPluginUrlVisitor } from "./postcss_plugin_url_visitor.js"
+
+export const moveCssUrls = async ({
+  code,
+  from,
+  to,
+  map,
+  sourcemapMethod,
+} = {}) => {
+  const fromDirectoryUrl = new URL("./", from).href
+  const toDirectoryUrl = new URL("./", to).href
+  // same directory, nothing to do
+  if (fromDirectoryUrl === toDirectoryUrl) {
+    return { code, map }
+  }
+
+  const result = await applyPostCss({
+    code,
+    url: from,
+    map,
+    sourcemapMethod,
+    plugins: [
+      postCssPluginUrlVisitor({
+        urlVisitor: ({ specifier }) => {
+          if (specifier[0] === "#") {
+            return null
+          }
+          const url = new URL(specifier, fromDirectoryUrl).href
+          const relativeUrl = urlToRelativeUrl(url, toDirectoryUrl)
+          return relativeUrl
+        },
+      }),
+    ],
+  })
+  code = result.code
+  map = result.map
+  return {
+    code,
+    map,
+  }
+}

package/src/internal/building/css/parseCssRessource.js

@@ -1,4 +1,9 @@
-import { urlToFilename, urlToRelativeUrl, resolveUrl } from "@jsenv/filesystem"
+import {
+  urlToFilename,
+  urlToRelativeUrl,
+  resolveUrl,
+  fileSystemPathToUrl,
+} from "@jsenv/filesystem"
 
 import {
   getCssSourceMappingUrl,
@@ -7,14 +12,18 @@ import {
 import { getRessourceAsBase64Url } from "../ressource_builder_util.js"
 import { parseCssUrls } from "./parseCssUrls.js"
 import { replaceCssUrls } from "./replaceCssUrls.js"
+import { moveCssUrls } from "./moveCssUrls.js"
 
 export const parseCssRessource = async (
   cssRessource,
   { notifyReferenceFound },
-  { asProjectUrl, asOriginalUrl, minify, minifyCssOptions },
+  { asProjectUrl, asOriginalUrl, minify, minifyCssOptions, cssConcatenation },
 ) => {
   const cssString = String(cssRessource.bufferBeforeBuild)
   const cssSourcemapUrl = getCssSourceMappingUrl(cssString)
+  const url = cssRessource.url
+  let code = cssString
+  let map
   let sourcemapReference
   if (cssSourcemapUrl) {
     sourcemapReference = notifyReferenceFound({
@@ -26,6 +35,8 @@ export const parseCssRessource = async (
       referenceColumn: 0,
       isSourcemap: true,
     })
+    await sourcemapReference.ressource.getBufferAvailablePromise()
+    map = JSON.parse(String(sourcemapReference.ressource.bufferBeforeBuild))
   } else {
     sourcemapReference = notifyReferenceFound({
       contentType: "application/octet-stream",
@@ -35,20 +46,25 @@ export const parseCssRessource = async (
     })
   }
 
-  const { atImports, urlDeclarations } = await parseCssUrls(
-    cssString,
-    cssRessource.url,
-  )
-
+  const { atImports, urlDeclarations } = await parseCssUrls({
+    code,
+    url,
+  })
   const urlNodeReferenceMapping = new Map()
+  const atImportReferences = []
   atImports.forEach((atImport) => {
     const importReference = notifyReferenceFound({
       ressourceSpecifier: atImport.specifier,
       ...cssNodeToReferenceLocation(atImport.urlDeclarationNode),
     })
     urlNodeReferenceMapping.set(atImport.urlNode, importReference)
+    atImportReferences.push(importReference)
   })
   urlDeclarations.forEach((urlDeclaration) => {
+    if (urlDeclaration.specifier[0] === "#") {
+      return
+    }
+
     const urlReference = notifyReferenceFound({
       ressourceSpecifier: urlDeclaration.specifier,
       ...cssNodeToReferenceLocation(urlDeclaration.urlDeclarationNode),
@@ -56,22 +72,20 @@ export const parseCssRessource = async (
     urlNodeReferenceMapping.set(urlDeclaration.urlNode, urlReference)
   })
 
-  return async ({ getUrlRelativeToImporter, buildDirectoryUrl }) => {
+  return async ({
+    getUrlRelativeToImporter,
+    precomputeBuildRelativeUrl,
+    buildDirectoryUrl,
+  }) => {
     const sourcemapRessource = sourcemapReference.ressource
-
-    let code = cssString
-    let map = sourcemapRessource.isPlaceholder
-      ? undefined
-      : JSON.parse(String(sourcemapRessource.bufferBeforeBuild))
-
     const cssCompiledUrl = cssRessource.url
     const cssOriginalUrl = asOriginalUrl(cssCompiledUrl)
 
     const replaceCssResult = await replaceCssUrls({
-      url: map ? asProjectUrl(cssCompiledUrl) : cssOriginalUrl,
-      code: cssString,
+      url: asProjectUrl(cssCompiledUrl),
+      code,
       map,
-      getUrlReplacementValue: ({ urlNode }) => {
+      urlVisitor: ({ urlNode }) => {
         const nodeCandidates = Array.from(urlNodeReferenceMapping.keys())
         const urlNodeFound = nodeCandidates.find((urlNodeCandidate) =>
           isSameCssDocumentUrlNode(urlNodeCandidate, urlNode),
@@ -95,6 +109,42 @@ export const parseCssRessource = async (
         }
         return getUrlRelativeToImporter(cssUrlRessource)
       },
+      cssConcatenation,
+      loadCssImport: async (path) => {
+        // const cssFileUrl = asProjectUrl(url)
+        const importedCssFileUrl = fileSystemPathToUrl(path)
+        const atImportReference = atImportReferences.find(
+          (atImportReference) => {
+            return (
+              asProjectUrl(atImportReference.ressource.url) ===
+              importedCssFileUrl
+            )
+          },
+        )
+        atImportReference.inlinedCallback()
+        let code = String(atImportReference.ressource.bufferAfterBuild)
+        const moveResult = await moveCssUrls({
+          code,
+          from: resolveUrl(
+            atImportReference.ressource.buildRelativeUrl,
+            buildDirectoryUrl,
+          ),
+          to: resolveUrl(
+            precomputeBuildRelativeUrl(cssRessource),
+            buildDirectoryUrl,
+          ),
+          // moveCssUrls will change the css source code
+          // Ideally we should update the sourcemap referenced by css
+          // to target the one after css urls are moved.
+          // It means we should force sourcemap ressource to the new one
+          // until it's supported we prevent postcss from updating the
+          // sourcemap comment, othwise css would reference a sourcemap
+          // that won't by in the build directory
+          sourcemapMethod: null,
+        })
+        code = moveResult.code
+        return code
+      },
       cssMinification: minify,
       cssMinificationOptions: minifyCssOptions,
     })