@jsenv/core 25.0.1 → 25.2.1

package/src/internal/compiling/createCompiledFileService.js

@@ -38,7 +38,9 @@ export const createCompiledFileService = ({
   logger,
 
   projectDirectoryUrl,
+  jsenvDirectoryRelativeUrl,
   outDirectoryRelativeUrl,
+  jsenvRemoteDirectory,
 
   runtimeSupport,
   babelPluginMap,
@@ -89,12 +91,9 @@ export const createCompiledFileService = ({
 
   const importmapInfos = {}
 
-  return (request, { pushResponse, redirectRequest }) => {
+  return async (request, { pushResponse, redirectRequest }) => {
     const { origin, ressource } = request
-    // we use "ressourceToPathname" to remove eventual query param from the url
-    // Without this a pattern like "**/*.js" would not match "file.js?t=1"
-    // This would result in file not being compiled when they should
-    const requestUrl = `${origin}${ressourceToPathname(ressource)}`
+    const requestUrl = `${origin}${ressource}`
 
     const requestCompileInfo = serverUrlToCompileInfo(requestUrl, {
       outDirectoryRelativeUrl,
@@ -140,8 +139,6 @@ export const createCompiledFileService = ({
     }
 
     const originalFileRelativeUrl = afterCompileId
-    projectFileRequestedCallback(originalFileRelativeUrl, request)
-
     const originalFileUrl = `${projectDirectoryUrl}${originalFileRelativeUrl}`
     const compileDirectoryRelativeUrl = `${outDirectoryRelativeUrl}${compileId}/`
     const compileDirectoryUrl = resolveDirectoryUrl(
@@ -152,23 +149,22 @@ export const createCompiledFileService = ({
       originalFileRelativeUrl,
       compileDirectoryUrl,
     )
-
     const compiler = getCompiler({ originalFileUrl, compileMeta })
     // no compiler -> serve original file
-    // we don't redirect otherwise it complexify ressource tracking
-    // and url resolution
+    // we redirect "internally" (we dont send 304 to the browser)
+    // to keep ressource tracking and url resolution simple
     if (!compiler) {
       return redirectRequest({
         pathname: `/${originalFileRelativeUrl}`,
       })
     }
-
     // compile this if needed
     const compileResponsePromise = compileFile({
       compileServerOperation,
       logger,
 
       projectDirectoryUrl,
+      jsenvRemoteDirectory,
       originalFileUrl,
       compiledFileUrl,
 
@@ -181,14 +177,16 @@ export const createCompiledFileService = ({
         return compiler({
           logger,
 
-          code,
-          url: originalFileUrl,
-          compiledUrl: compiledFileUrl,
           projectDirectoryUrl,
+          jsenvRemoteDirectory,
           compileServerOrigin: request.origin,
+          jsenvDirectoryRelativeUrl,
           outDirectoryRelativeUrl,
-          compileId,
+          url: originalFileUrl,
+          compiledUrl: compiledFileUrl,
           request,
+
+          compileId,
           babelPluginMap: shakeBabelPluginMap({
             babelPluginMap,
             missingFeatureNames: groupMap[compileId].missingFeatureNames,
@@ -204,6 +202,7 @@ export const createCompiledFileService = ({
           topLevelAwait,
           prependSystemJs,
 
+          code,
           sourcemapMethod,
           sourcemapExcludeSources,
           jsenvEventSourceClientInjection,
@@ -238,6 +237,14 @@ const canAvoidSystemJs = ({
 }
 
 const getCompiler = ({ originalFileUrl, compileMeta }) => {
+  // we remove eventual query param from the url
+  // Without this a pattern like "**/*.js" would not match "file.js?t=1"
+  // This would result in file not being compiled when they should
+  // Ideally we would do a first pass with the query param and a second without
+  const urlObject = new URL(originalFileUrl)
+  urlObject.search = ""
+  originalFileUrl = urlObject.href
+
   const { jsenvCompiler, customCompiler } = urlToMeta({
     url: originalFileUrl,
     structuredMetaMap: compileMeta,
@@ -307,12 +314,3 @@ const contentTypeExtensions = {
   "application/importmap+json": ".importmap",
   // "text/css": ".css",
 }
-
-const ressourceToPathname = (ressource) => {
-  const searchSeparatorIndex = ressource.indexOf("?")
-  const pathname =
-    searchSeparatorIndex === -1
-      ? ressource
-      : ressource.slice(0, searchSeparatorIndex)
-  return pathname
-}

package/src/internal/compiling/html_source_file_service.js

@@ -41,7 +41,7 @@ import {
   removeHtmlNodeAttribute,
   getHtmlNodeTextNode,
   setHtmlNodeText,
-  getUniqueNameForInlineHtmlNode,
+  getIdForInlineHtmlNode,
 } from "./compileHtml.js"
 import { jsenvCoreDirectoryUrl } from "../jsenvCoreDirectoryUrl.js"
 
@@ -121,8 +121,8 @@ export const createTransformHtmlSourceFileService = ({
       jsenvScriptInjection,
       jsenvEventSourceClientInjection,
       jsenvToolbarInjection,
-      onInlineModuleScript: ({ scriptContent, scriptIdentifier }) => {
-        const inlineScriptUrl = resolveUrl(scriptIdentifier, fileUrl)
+      onInlineModuleScript: ({ scriptContent, scriptSpecifier }) => {
+        const inlineScriptUrl = resolveUrl(scriptSpecifier, fileUrl)
         htmlInlineScriptMap.set(inlineScriptUrl, {
           htmlFileUrl: fileUrl,
           scriptContent,
@@ -232,35 +232,35 @@ const transformHTMLSourceFile = async ({
     const { scripts } = parseHtmlAstRessources(htmlAst)
     scripts.forEach((script) => {
       const typeAttribute = getHtmlNodeAttributeByName(script, "type")
+      const type = typeAttribute ? typeAttribute.value : ""
       const srcAttribute = getHtmlNodeAttributeByName(script, "src")
-
-      // remote
-      if (typeAttribute && typeAttribute.value === "module" && srcAttribute) {
+      const src = srcAttribute ? srcAttribute.value : ""
+      if (type === "module" && src) {
         removeHtmlNodeAttribute(script, srcAttribute)
+        // Ideally jsenv should take into account eventual
+        // "integrity" and "crossorigin" attribute during "executeFileUsingDynamicImport"
         setHtmlNodeText(
           script,
           `window.__jsenv__.executeFileUsingDynamicImport(${JSON.stringify(
-            srcAttribute.value,
+            src,
           )})`,
         )
         return
       }
-      // inline
       const textNode = getHtmlNodeTextNode(script)
-      if (typeAttribute && typeAttribute.value === "module" && textNode) {
-        const scriptIdentifier = getUniqueNameForInlineHtmlNode(
-          script,
-          scripts,
-          `${urlToFilename(fileUrl)}__inline__[id].js`,
-        )
+      if (type === "module" && textNode) {
+        const scriptId = getIdForInlineHtmlNode(script, scripts)
+        const scriptSpecifier = `${urlToFilename(
+          fileUrl,
+        )}__inline__${scriptId}.js`
         onInlineModuleScript({
           scriptContent: textNode.value,
-          scriptIdentifier,
+          scriptSpecifier,
         })
         setHtmlNodeText(
           script,
           `window.__jsenv__.executeFileUsingDynamicImport(${JSON.stringify(
-            `./${scriptIdentifier}`,
+            `./${scriptSpecifier}`,
           )})`,
         )
         return
@@ -275,7 +275,8 @@ const transformHTMLSourceFile = async ({
     projectDirectoryUrl,
   })
 
-  return stringifyHtmlAst(htmlAst)
+  const htmlTransformed = stringifyHtmlAst(htmlAst)
+  return htmlTransformed
 }
 
 const visitImportmapScripts = async ({
@@ -315,14 +316,12 @@ const visitImportmapScripts = async ({
           )
           return
         }
-
         const importMapContent = await importMapResponse.json()
         const importMapInlined = moveImportMap(
           importMapContent,
           importMapUrl,
           htmlFileUrl,
         )
-
         replaceHtmlNode(
           importmapScript,
           `<script type="importmap">${JSON.stringify(

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

@@ -1,7 +1,6 @@
 // https://github.com/babel/babel/blob/99f4f6c3b03c7f3f67cf1b9f1a21b80cfd5b0224/packages/babel-core/src/tools/build-external-helpers.js
 // the list of possible helpers:
 // https://github.com/babel/babel/blob/99f4f6c3b03c7f3f67cf1b9f1a21b80cfd5b0224/packages/babel-helpers/src/helpers.js#L13
-import { fileSystemPathToUrl } from "@jsenv/filesystem"
 import { require } from "../../require.js"
 
 const babelHelperNameInsideJsenvCoreArray = [
@@ -113,13 +112,14 @@ export const babelHelperNameToImportSpecifier = (babelHelperName) => {
   return `${babelHelperAbstractScope}${babelHelperName}/${babelHelperName}.js`
 }
 
-export const filePathToBabelHelperName = (filePath) => {
-  const fileUrl = fileSystemPathToUrl(filePath)
-
+export const babelHelperNameFromUrl = (url) => {
+  if (!url.startsWith("file://")) {
+    return null
+  }
   const babelHelperPrefix = "core/helpers/babel/"
-  if (fileUrl.includes(babelHelperPrefix)) {
-    const afterBabelHelper = fileUrl.slice(
-      fileUrl.indexOf(babelHelperPrefix) + babelHelperPrefix.length,
+  if (url.includes(babelHelperPrefix)) {
+    const afterBabelHelper = url.slice(
+      url.indexOf(babelHelperPrefix) + babelHelperPrefix.length,
     )
     const babelHelperName = afterBabelHelper.slice(
       0,
@@ -127,11 +127,9 @@ export const filePathToBabelHelperName = (filePath) => {
     )
     return babelHelperName
   }
-
-  if (fileUrl.includes(babelHelperAbstractScope)) {
-    const afterBabelHelper = fileUrl.slice(
-      fileUrl.indexOf(babelHelperAbstractScope) +
-        babelHelperAbstractScope.length,
+  if (url.includes(babelHelperAbstractScope)) {
+    const afterBabelHelper = url.slice(
+      url.indexOf(babelHelperAbstractScope) + babelHelperAbstractScope.length,
     )
     const babelHelperName = afterBabelHelper.slice(
       0,
@@ -139,7 +137,6 @@ export const filePathToBabelHelperName = (filePath) => {
     )
     return babelHelperName
   }
-
   return null
 }
 

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

@@ -1,6 +1,8 @@
+import { fileSystemPathToUrl } from "@jsenv/filesystem"
+
 import { require } from "../../require.js"
 import {
-  filePathToBabelHelperName,
+  babelHelperNameFromUrl,
   babelHelperNameToImportSpecifier,
 } from "./babelHelper.js"
 
@@ -37,7 +39,7 @@ export const babelPluginBabelHelpersAsJsenvImports = (api) => {
         const babelHelperImportSpecifier =
           babelHelperNameToImportSpecifier(name)
 
-        if (filePathToBabelHelperName(filePath) === name) {
+        if (babelHelperNameFromUrl(fileSystemPathToUrl(filePath)) === name) {
           return undefined
         }
 

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

@@ -6,18 +6,17 @@ import {
   getMinimalBabelPluginMap,
   babelPluginsFromBabelPluginMap,
 } from "@jsenv/core/src/internal/compiling/babel_plugins.js"
+import { babelPluginProxyExternalImports } from "@jsenv/core/src/internal/compiling/babel_plugin_proxy_external_imports.js"
 import { babelPluginImportMetadata } from "@jsenv/core/src/internal/compiling/babel_plugin_import_metadata.js"
 
 import { ansiToHTML } from "./ansiToHTML.js"
 import { babelPluginRegeneratorRuntimeAsJsenvImport } from "./babel_plugin_regenerator_runtime_as_jsenv_import.js"
 import { babelPluginBabelHelpersAsJsenvImports } from "./babel_plugin_babel_helpers_as_jsenv_imports.js"
 import { babelPluginSystemJsPrepend } from "./babel_plugin_systemjs_prepend.js"
-import { filePathToBabelHelperName } from "./babelHelper.js"
+import { babelHelperNameFromUrl } from "./babelHelper.js"
 
 export const jsenvTransform = async ({
-  code,
-  map, // optional
-  ast, // optional
+  jsenvRemoteDirectory,
   url,
   relativeUrl, // optional
 
@@ -25,16 +24,18 @@ export const jsenvTransform = async ({
   moduleOutFormat,
   importMetaFormat = moduleOutFormat,
   topLevelAwait,
-
   babelHelpersInjectionAsImport,
   prependSystemJs,
   transformGenerator,
   regeneratorRuntimeImportPath,
+
   sourcemapEnabled,
+  ast, // optional
+  map, // optional
+  code,
 }) => {
   const transformModulesSystemJs = require("@babel/plugin-transform-modules-systemjs")
   const proposalDynamicImport = require("@babel/plugin-proposal-dynamic-import")
-
   const inputPath = computeInputPath(url)
 
   // https://babeljs.io/docs/en/options
@@ -60,7 +61,7 @@ export const jsenvTransform = async ({
     },
   }
 
-  const babelHelperName = filePathToBabelHelperName(inputPath)
+  const babelHelperName = babelHelperNameFromUrl(url)
   // to prevent typeof circular dependency
   if (babelHelperName === "typeof") {
     const babelPluginMapWithoutTransformTypeOf = { ...babelPluginMap }
@@ -146,6 +147,14 @@ export const jsenvTransform = async ({
           ],
         }
       : {}),
+    ...(jsenvRemoteDirectory
+      ? {
+          "proxy-external-imports": [
+            babelPluginProxyExternalImports,
+            { jsenvRemoteDirectory },
+          ],
+        }
+      : {}),
     "import-metadata": [babelPluginImportMetadata],
   }
   if (moduleOutFormat === "systemjs") {

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

@@ -3,10 +3,9 @@ import { urlToRelativeUrl } from "@jsenv/filesystem"
 import { jsenvTransform } from "./jsenvTransform.js"
 
 export const transformJs = async ({
-  code,
-  map,
-  url,
   projectDirectoryUrl,
+  jsenvRemoteDirectory,
+  url,
 
   babelPluginMap,
   moduleOutFormat = "esmodule",
@@ -16,6 +15,9 @@ export const transformJs = async ({
   topLevelAwait,
   transformGenerator = true,
   sourcemapEnabled = true,
+
+  map,
+  code,
 }) => {
   if (typeof projectDirectoryUrl !== "string") {
     throw new TypeError(
@@ -40,12 +42,14 @@ export const transformJs = async ({
   }
 
   const transformResult = await jsenvTransform({
-    code,
-    map,
     url,
     relativeUrl: url.startsWith(projectDirectoryUrl)
       ? urlToRelativeUrl(url, projectDirectoryUrl)
       : undefined,
+    projectDirectoryUrl,
+    jsenvRemoteDirectory,
+    code,
+    map,
 
     babelPluginMap,
     moduleOutFormat,