@jsenv/core 27.0.0-alpha.24 → 27.0.0-alpha.27

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/core",
-  "version": "27.0.0-alpha.24",
+  "version": "27.0.0-alpha.27",
   "description": "Tool to develop, test and build js projects",
   "license": "MIT",
   "repository": {
@@ -11,7 +11,8 @@
     "node": ">=16.13.0"
   },
   "publishConfig": {
-    "access": "public"
+    "access": "public",
+    "registry": "https://registry.npmjs.org"
   },
   "type": "module",
   "imports": {},
@@ -66,7 +67,7 @@
     "@jsenv/node-esm-resolution": "0.0.4",
     "@jsenv/server": "12.6.1",
     "@jsenv/uneval": "1.6.0",
-    "@jsenv/utils": "1.4.1",
+    "@jsenv/utils": "1.4.2",
     "construct-style-sheets-polyfill": "3.1.0",
     "cssnano": "5.1.7",
     "cssnano-preset-default": "5.2.7",
@@ -110,4 +111,4 @@
     "redux": "4.1.2",
     "rollup": "2.70.1"
   }
-}
+}

package/src/build/build.js

@@ -349,10 +349,30 @@ ${Object.keys(rawGraph.urlInfos).join("\n")}`,
           //   - injecting "?as_js_classic" for the first time
           //   - injecting "?as_js_classic" because the parentUrl has it
           if (reference.original) {
+            const referenceOriginalUrl = reference.original.url
+            let originalBuildUrl
+            if (urlIsInsideOf(referenceOriginalUrl, buildDirectoryUrl)) {
+              originalBuildUrl = referenceOriginalUrl
+            } else {
+              originalBuildUrl = Object.keys(rawUrls).find(
+                (key) => rawUrls[key] === referenceOriginalUrl,
+              )
+            }
+            let rawUrl
+            if (urlIsInsideOf(reference.url, buildDirectoryUrl)) {
+              // rawUrl = rawUrls[reference.url] || reference.url
+              const originalBuildUrl =
+                buildUrlRedirections[referenceOriginalUrl]
+              rawUrl = originalBuildUrl
+                ? rawUrls[originalBuildUrl]
+                : reference.url
+            } else {
+              rawUrl = reference.url
+            }
             // the url info do not exists yet (it will be created after this "normalize" hook)
             // And the content will be generated when url is cooked by url graph loader.
             // Here we just want to reserve an url for that file
-            const buildUrl = buildUrlsGenerator.generate(reference.url, {
+            const buildUrl = buildUrlsGenerator.generate(rawUrl, {
               urlInfo: {
                 data: {
                   ...reference.data,
@@ -364,15 +384,8 @@ ${Object.keys(rawGraph.urlInfos).join("\n")}`,
                 filename: reference.filename,
               },
             })
-            const originalUrl = reference.original.url
-            const originalBuildUrl = urlIsInsideOf(
-              reference.url,
-              buildDirectoryUrl,
-            )
-              ? originalUrl
-              : Object.keys(rawUrls).find((key) => rawUrls[key] === originalUrl)
             buildUrlRedirections[originalBuildUrl] = buildUrl
-            rawUrls[buildUrl] = reference.url
+            rawUrls[buildUrl] = rawUrl
             return buildUrl
           }
           if (reference.isInline) {
@@ -811,7 +824,6 @@ ${Object.keys(finalGraph.urlInfos).join("\n")}`,
     finalGraph,
     rawUrls,
     buildUrls,
-    buildUrlRedirections,
   })
   const cleanupActions = []
   GRAPH.forEach(finalGraph, (urlInfo) => {

package/src/build/resync_ressource_hints.js

@@ -1,21 +1,24 @@
+/*
+ * Update <link rel="preload"> and friends after build (once we know everything)
+ *
+ * - Used to remove ressource hint targeting an url that is no longer used:
+ *   - Happens because of import assertions transpilation (file is inlined into JS)
+ */
+
 import {
   parseHtmlString,
   visitHtmlAst,
   stringifyHtmlAst,
   getHtmlNodeAttributeByName,
-  assignHtmlNodeAttributes,
   removeHtmlNode,
 } from "@jsenv/utils/html_ast/html_ast.js"
 
 import { GRAPH } from "./graph_utils.js"
 
-// update ressource hint that where targeting a file that has changed during build
-// (happens for import assertions and file modified by "?as_js_classic")
 export const resyncRessourceHints = async ({
   finalGraphKitchen,
   finalGraph,
   buildUrls,
-  buildUrlRedirections,
 }) => {
   const ressourceHintActions = []
   GRAPH.forEach(finalGraph, (urlInfo) => {
@@ -40,24 +43,6 @@ export const resyncRessourceHints = async ({
           removeHtmlNode(linkNode)
           return
         }
-        const buildUrlRedirected = buildUrlRedirections[buildUrl]
-        if (buildUrlRedirected) {
-          const urlInfoRedirected = finalGraph.getUrlInfo(buildUrlRedirected)
-          hrefAttribute.value = urlInfoRedirected.data.buildUrlSpecifier
-
-          if (
-            urlInfo.type === "js_module" &&
-            urlInfoRedirected.type === "js_classic"
-          ) {
-            const relAttribute = getHtmlNodeAttributeByName(linkNode, "rel")
-            if (relAttribute && relAttribute.value === "modulepreload") {
-              assignHtmlNodeAttributes(linkNode, {
-                rel: "preload",
-                as: "script",
-              })
-            }
-          }
-        }
       }
       visitHtmlAst(htmlAst, (node) => {
         if (node.nodeName !== "link") {

package/src/omega/kitchen.js

@@ -451,7 +451,7 @@ export const createKitchen = ({
           currentUrlInfo !== newUrlInfo &&
           currentUrlInfo.dependents.size === 0
         ) {
-          delete context.urlGraph.urlInfos[currentReference.url]
+          context.urlGraph.deleteUrlInfo(currentReference.url)
         }
         return [nextReference, newUrlInfo]
       },

package/src/omega/url_graph/url_graph_report.js

@@ -22,7 +22,7 @@ const createUrlGraphReport = (urlGraph) => {
     html: 0,
     css: 0,
     js: 0,
-    assets: 0,
+    other: 0,
     sourcemaps: 0,
     total: 0,
   }
@@ -31,7 +31,7 @@ const createUrlGraphReport = (urlGraph) => {
     css: 0,
     js: 0,
     sourcemaps: 0,
-    assets: 0,
+    other: 0,
     total: 0,
   }
   Object.keys(urlInfos).forEach((url) => {
@@ -81,8 +81,8 @@ const createUrlGraphReport = (urlGraph) => {
       sizeGroups.js += urlContentSize
       return
     }
-    countGroups.assets++
-    sizeGroups.assets += urlContentSize
+    countGroups.other++
+    sizeGroups.other += urlContentSize
     return
   })
   return {
@@ -90,7 +90,7 @@ const createUrlGraphReport = (urlGraph) => {
     css: { count: countGroups.css, size: sizeGroups.css },
     js: { count: countGroups.js, size: sizeGroups.js },
     sourcemaps: { count: countGroups.sourcemaps, size: sizeGroups.sourcemaps },
-    assets: { count: countGroups.assets, size: sizeGroups.assets },
+    other: { count: countGroups.other, size: sizeGroups.other },
     total: { count: countGroups.total, size: sizeGroups.total },
   }
 }
@@ -108,10 +108,10 @@ const determineCategory = (urlInfo) => {
   if (urlInfo.type === "js_module" || urlInfo.type === "js_classic") {
     return "js"
   }
-  return "assets"
+  return "other"
 }
 
-const createRepartitionMessage = ({ html, css, js, assets }) => {
+const createRepartitionMessage = ({ html, css, js, other }) => {
   const parts = []
   if (html.count) {
     parts.push(
@@ -141,10 +141,10 @@ const createRepartitionMessage = ({ html, css, js, assets }) => {
   //     } (${byteAsFileSize(sourcemaps.size)})`,
   //   )
   // }
-  if (assets.count) {
+  if (other.count) {
     parts.push(
-      `${ANSI.color(`assets:`, ANSI.GREY)} ${assets.count} (${byteAsFileSize(
-        assets.size,
+      `${ANSI.color(`other:`, ANSI.GREY)} ${other.count} (${byteAsFileSize(
+        other.size,
       )})`,
     )
   }

package/src/omega/url_graph.js

@@ -4,7 +4,16 @@ import { urlToRelativeUrl } from "@jsenv/filesystem"
 export const createUrlGraph = () => {
   const urlInfos = {}
   const getUrlInfo = (url) => urlInfos[url]
-  const deleteUrlInfo = (url) => delete urlInfos[url]
+  const deleteUrlInfo = (url) => {
+    const urlInfo = urlInfos[url]
+    if (urlInfo) {
+      delete urlInfos[url]
+      if (urlInfo.sourcemapReference) {
+        deleteUrlInfo(urlInfo.sourcemapReference.url)
+      }
+    }
+  }
+
   const reuseOrCreateUrlInfo = (url) => {
     const existingUrlInfo = urlInfos[url]
     if (existingUrlInfo) return existingUrlInfo

package/src/plugins/transpilation/as_js_classic/jsenv_plugin_as_js_classic.js

@@ -15,11 +15,12 @@ import { createRequire } from "node:module"
 import { readFileSync, urlToFilename } from "@jsenv/filesystem"
 
 import { requireBabelPlugin } from "@jsenv/babel-plugins"
-
 import { applyBabelPlugins } from "@jsenv/utils/js_ast/apply_babel_plugins.js"
 import { injectQueryParams } from "@jsenv/utils/urls/url_utils.js"
 import { createMagicSource } from "@jsenv/utils/sourcemap/magic_source.js"
 import { composeTwoSourcemaps } from "@jsenv/utils/sourcemap/sourcemap_composition_v3.js"
+
+import { fetchOriginalUrlInfo } from "../fetch_original_url_info.js"
 import { babelPluginTransformImportMetaUrl } from "./helpers/babel_plugin_transform_import_meta_url.js"
 import { jsenvPluginScriptTypeModuleAsClassic } from "./jsenv_plugin_script_type_module_as_classic.js"
 import { jsenvPluginWorkersTypeModuleAsClassic } from "./jsenv_plugin_workers_type_module_as_classic.js"
@@ -48,13 +49,16 @@ const asJsClassic = ({ systemJsInjection, systemJsClientFileUrl }) => {
     appliesDuring: "*",
     // forward ?as_js_classic to referenced urls
     normalizeUrl: (reference, context) => {
-      if (reference.isInline) {
-        if (reference.contentType !== "text/javascript") {
-          // We want to propagate transformation of js module to js classic
-          // so we don't want to propagate when the reference is not js:
-          // - ignore "string" in `JSON.parse(string)` for instance
-          return null
-        }
+      // We want to propagate transformation of js module to js classic
+      // but only for import specifier (static/dynamic import + re-export)
+      // All other references won't get the ?as_js_classic
+      // otherwise we could try to transform inline ressources, specifiers inside new URL(). ...
+      if (
+        reference.type !== "js_import_export" &&
+        reference.subtype !== "system_register_arg" &&
+        reference.subtype !== "system_import_arg"
+      ) {
+        return null
       }
       const parentUrlInfo = context.urlGraph.getUrlInfo(reference.parentUrl)
       if (
@@ -70,28 +74,18 @@ const asJsClassic = ({ systemJsInjection, systemJsClientFileUrl }) => {
       return urlTransformed
     },
     fetchUrlContent: async (urlInfo, context) => {
-      const urlObject = new URL(urlInfo.url)
-      const { searchParams } = urlObject
-      if (!searchParams.has("as_js_classic")) {
-        return null
-      }
-      searchParams.delete("as_js_classic")
-      const originalUrl = urlObject.href
-      const originalReference = {
-        ...(context.reference.original || context.reference),
+      const originalUrlInfo = await fetchOriginalUrlInfo({
+        urlInfo,
+        context,
+        searchParam: "as_js_classic",
         // override the expectedType to "js_module"
         // because when there is ?as_js_classic it means the underlying ressource
         // is a js_module
         expectedType: "js_module",
-      }
-      originalReference.url = originalUrl
-      const originalUrlInfo = context.urlGraph.reuseOrCreateUrlInfo(
-        originalReference.url,
-      )
-      await context.fetchUrlContent({
-        reference: originalReference,
-        urlInfo: originalUrlInfo,
       })
+      if (!originalUrlInfo) {
+        return null
+      }
       const isJsEntryPoint =
         // in general html files are entry points
         // but during build js can be sepcified as an entry point

package/src/plugins/transpilation/as_js_classic/jsenv_plugin_script_type_module_as_classic.js

@@ -2,7 +2,8 @@ import {
   getHtmlNodeAttributeByName,
   getHtmlNodeTextNode,
   parseHtmlString,
-  removeHtmlNodeAttribute,
+  removeHtmlNodeAttributeByName,
+  assignHtmlNodeAttributes,
   stringifyHtmlAst,
   visitHtmlAst,
   htmlNodePosition,
@@ -30,51 +31,163 @@ export const jsenvPluginScriptTypeModuleAsClassic = ({
           return null
         }
         const htmlAst = parseHtmlString(urlInfo.content)
-        const actions = []
-        const jsModuleUrlInfos = []
-        const visitScriptTypeModule = (node) => {
+        const preloadAsScriptNodes = []
+        const modulePreloadNodes = []
+        const moduleScriptNodes = []
+        const classicScriptNodes = []
+        const visitLinkNodes = (node) => {
+          if (node.nodeName !== "link") {
+            return
+          }
+          const relAttribute = getHtmlNodeAttributeByName(node, "rel")
+          const rel = relAttribute ? relAttribute.value : undefined
+          if (rel === "modulepreload") {
+            modulePreloadNodes.push(node)
+            return
+          }
+          if (rel === "preload") {
+            const asAttribute = getHtmlNodeAttributeByName(node, "as")
+            const as = asAttribute ? asAttribute.value : undefined
+            if (as === "script") {
+              preloadAsScriptNodes.push(node)
+            }
+            return
+          }
+        }
+        const visitScriptNodes = (node) => {
           if (node.nodeName !== "script") {
             return
           }
           const typeAttribute = getHtmlNodeAttributeByName(node, "type")
-          if (!typeAttribute || typeAttribute.value !== "module") {
+          const type = typeAttribute ? typeAttribute.value : undefined
+          if (type === "module") {
+            moduleScriptNodes.push(node)
+            return
+          }
+          if (type === undefined || type === "text/javascript") {
+            classicScriptNodes.push(node)
             return
           }
-          const srcAttribute = getHtmlNodeAttributeByName(node, "src")
+        }
+        visitHtmlAst(htmlAst, (node) => {
+          visitLinkNodes(node)
+          visitScriptNodes(node)
+        })
+
+        const classicScriptUrls = []
+        const moduleScriptUrls = []
+        classicScriptNodes.forEach((classicScriptNode) => {
+          const srcAttribute = getHtmlNodeAttributeByName(
+            classicScriptNode,
+            "src",
+          )
+          if (srcAttribute) {
+            const url = new URL(srcAttribute.value, urlInfo.url).href
+            classicScriptUrls.push(url)
+          }
+        })
+        moduleScriptNodes.forEach((moduleScriptNode) => {
+          const srcAttribute = getHtmlNodeAttributeByName(
+            moduleScriptNode,
+            "src",
+          )
+          if (srcAttribute) {
+            const url = new URL(srcAttribute.value, urlInfo.url).href
+            moduleScriptUrls.push(url)
+          }
+        })
+
+        const jsModuleUrls = []
+        const getReferenceAsJsClassic = async (reference) => {
+          const [newReference, newUrlInfo] = context.referenceUtils.update(
+            reference,
+            {
+              expectedType: "js_classic",
+              specifier: injectQueryParamsIntoSpecifier(reference.specifier, {
+                as_js_classic: "",
+              }),
+              filename: generateJsClassicFilename(reference.url),
+            },
+          )
+          const jsModuleUrl = newUrlInfo.url
+          if (!jsModuleUrls.includes(jsModuleUrl)) {
+            jsModuleUrls.push(newUrlInfo.url)
+            // during dev it means js modules will be cooked before server sends the HTML
+            // it's ok because:
+            // - during dev script_type_module are supported (dev use a recent browser)
+            // - even if browser is not supported it still works it's jus a bit slower
+            //   because it needs to decide if systemjs will be injected or not
+            await context.cook({
+              reference: newReference,
+              urlInfo: newUrlInfo,
+            })
+          }
+          return [newReference, newUrlInfo]
+        }
+        const actions = []
+        preloadAsScriptNodes.forEach((preloadAsScriptNode) => {
+          const hrefAttribute = getHtmlNodeAttributeByName(
+            preloadAsScriptNode,
+            "href",
+          )
+          const href = hrefAttribute.value
+          const url = new URL(href, urlInfo.url).href
+          const expectedScriptType = moduleScriptUrls.includes(url)
+            ? "module"
+            : "classic"
+          // keep in mind:
+          // when the url is not referenced by a <script type="module">
+          // we assume we want to preload "classic" but it might not be the case
+          // but it's unlikely to happen and people should use "modulepreload" in that case anyway
+          if (expectedScriptType === "module") {
+            actions.push(async () => {
+              const [newReference] = await getReferenceAsJsClassic(
+                context.referenceUtils.findByGeneratedSpecifier(href),
+              )
+              assignHtmlNodeAttributes(preloadAsScriptNode, {
+                href: newReference.generatedSpecifier,
+              })
+              removeHtmlNodeAttributeByName(preloadAsScriptNode, "crossorigin")
+            })
+          }
+        })
+        modulePreloadNodes.forEach((modulePreloadNode) => {
+          const hrefAttribute = getHtmlNodeAttributeByName(
+            modulePreloadNode,
+            "href",
+          )
+          const href = hrefAttribute.value
+          actions.push(async () => {
+            const [newReference] = await getReferenceAsJsClassic(
+              context.referenceUtils.findByGeneratedSpecifier(href),
+            )
+            assignHtmlNodeAttributes(modulePreloadNode, {
+              rel: "preload",
+              as: "script",
+              href: newReference.generatedSpecifier,
+            })
+          })
+        })
+        moduleScriptNodes.forEach((moduleScriptNode) => {
+          const srcAttribute = getHtmlNodeAttributeByName(
+            moduleScriptNode,
+            "src",
+          )
           if (srcAttribute) {
             actions.push(async () => {
               const specifier = srcAttribute.value
-              const reference =
-                context.referenceUtils.findByGeneratedSpecifier(specifier)
-              const [newReference, newUrlInfo] = context.referenceUtils.update(
-                reference,
-                {
-                  expectedType: "js_classic",
-                  specifier: injectQueryParamsIntoSpecifier(specifier, {
-                    as_js_classic: "",
-                  }),
-                  filename: generateJsClassicFilename(reference.url),
-                },
+              const [newReference] = await getReferenceAsJsClassic(
+                context.referenceUtils.findByGeneratedSpecifier(specifier),
               )
-              removeHtmlNodeAttribute(node, typeAttribute)
+              removeHtmlNodeAttributeByName(moduleScriptNode, "type")
               srcAttribute.value = newReference.generatedSpecifier
-              // during dev it means js modules will be cooked before server sends the HTML
-              // it's ok because:
-              // - during dev script_type_module are supported (dev use a recent browser)
-              // - even if browser is not supported it still works it's jus a bit slower
-              //   because it needs to decide if systemjs will be injected or not
-              await context.cook({
-                reference: newReference,
-                urlInfo: newUrlInfo,
-              })
-              jsModuleUrlInfos.push(newUrlInfo)
             })
             return
           }
-          const textNode = getHtmlNodeTextNode(node)
+          const textNode = getHtmlNodeTextNode(moduleScriptNode)
           actions.push(async () => {
             const { line, column, lineEnd, columnEnd, isOriginal } =
-              htmlNodePosition.readNodePosition(node, {
+              htmlNodePosition.readNodePosition(moduleScriptNode, {
                 preferOriginal: true,
               })
             let inlineScriptUrl = generateInlineContentUrl({
@@ -86,7 +199,7 @@ export const jsenvPluginScriptTypeModuleAsClassic = ({
               columnEnd,
             })
             const [inlineReference] = context.referenceUtils.foundInline({
-              node,
+              node: moduleScriptNode,
               type: "script_src",
               expectedType: "js_module",
               // we remove 1 to the line because imagine the following html:
@@ -99,39 +212,26 @@ export const jsenvPluginScriptTypeModuleAsClassic = ({
               contentType: "application/javascript",
               content: textNode.value,
             })
-            const [newReference, newUrlInfo] = context.referenceUtils.update(
+            const [, newUrlInfo] = await getReferenceAsJsClassic(
               inlineReference,
-              {
-                expectedType: "js_classic",
-                specifier: injectQueryParamsIntoSpecifier(inlineScriptUrl, {
-                  as_js_classic: "",
-                }),
-                filename: generateJsClassicFilename(inlineReference.url),
-              },
             )
-            await context.cook({
-              reference: newReference,
-              urlInfo: newUrlInfo,
-            })
-            removeHtmlNodeAttribute(node, typeAttribute)
-            setHtmlNodeGeneratedText(node, {
+            removeHtmlNodeAttributeByName(moduleScriptNode, "type")
+            setHtmlNodeGeneratedText(moduleScriptNode, {
               generatedText: newUrlInfo.content,
               generatedBy: "jsenv:script_type_module_as_classic",
             })
-            jsModuleUrlInfos.push(newUrlInfo)
           })
-        }
-        visitHtmlAst(htmlAst, (node) => {
-          visitScriptTypeModule(node)
         })
+
         if (actions.length === 0) {
           return null
         }
         await Promise.all(actions.map((action) => action()))
         if (systemJsInjection) {
-          const needsSystemJs = jsModuleUrlInfos.some(
-            (jsModuleUrlInfo) =>
-              jsModuleUrlInfo.data.jsClassicFormat === "system",
+          const needsSystemJs = jsModuleUrls.some(
+            (jsModuleUrl) =>
+              context.urlGraph.getUrlInfo(jsModuleUrl).data.jsClassicFormat ===
+              "system",
           )
           if (needsSystemJs) {
             const [systemJsReference] = context.referenceUtils.inject({

package/src/plugins/transpilation/as_js_classic/jsenv_plugin_workers_type_module_as_classic.js

@@ -25,6 +25,7 @@ export const jsenvPluginWorkersTypeModuleAsClassic = ({
           babelPluginMetadataWorkerMentions,
           {
             workersToTranspile,
+            isJsModule: urlInfo.type === "js_module",
           },
         ],
       ],
@@ -101,7 +102,10 @@ const getWorkersToTranspile = (urlInfo, context) => {
   return { worker, serviceWorker, sharedWorker }
 }
 
-const babelPluginMetadataWorkerMentions = (_, { workersToTranspile }) => {
+const babelPluginMetadataWorkerMentions = (
+  _,
+  { workersToTranspile, isJsModule },
+) => {
   return {
     name: "metadata-worker-mentions",
     visitor: {
@@ -110,7 +114,9 @@ const babelPluginMetadataWorkerMentions = (_, { workersToTranspile }) => {
         const visitors = {
           NewExpression: (path) => {
             if (workersToTranspile.worker || workersToTranspile.sharedWorker) {
-              const mentions = analyzeNewWorkerOrNewSharedWorker(path)
+              const mentions = analyzeNewWorkerOrNewSharedWorker(path, {
+                isJsModule,
+              })
               if (mentions) {
                 workerMentions.push(...mentions)
               }

package/src/plugins/transpilation/fetch_original_url_info.js

@@ -0,0 +1,30 @@
+export const fetchOriginalUrlInfo = async ({
+  urlInfo,
+  context,
+  searchParam,
+  expectedType,
+}) => {
+  const urlObject = new URL(urlInfo.url)
+  const { searchParams } = urlObject
+  if (!searchParams.has(searchParam)) {
+    return null
+  }
+  searchParams.delete(searchParam)
+  const originalUrl = urlObject.href
+  const originalReference = {
+    ...(context.reference.original || context.reference),
+    expectedType,
+  }
+  originalReference.url = originalUrl
+  const originalUrlInfo = context.urlGraph.reuseOrCreateUrlInfo(
+    originalReference.url,
+  )
+  await context.fetchUrlContent({
+    reference: originalReference,
+    urlInfo: originalUrlInfo,
+  })
+  if (originalUrlInfo.dependents.size === 0) {
+    context.urlGraph.deleteUrlInfo(originalUrlInfo.url)
+  }
+  return originalUrlInfo
+}

package/src/plugins/transpilation/import_assertions/jsenv_plugin_import_assertions.js

@@ -5,6 +5,7 @@ import { createMagicSource } from "@jsenv/utils/sourcemap/magic_source.js"
 import { injectQueryParamsIntoSpecifier } from "@jsenv/utils/urls/url_utils.js"
 import { JS_QUOTES } from "@jsenv/utils/string/js_quotes.js"
 
+import { fetchOriginalUrlInfo } from "../fetch_original_url_info.js"
 import { babelPluginMetadataImportAssertions } from "./helpers/babel_plugin_metadata_import_assertions.js"
 
 export const jsenvPluginImportAssertions = () => {
@@ -95,125 +96,106 @@ const jsenvPluginAsModules = () => {
   const asJsonModule = {
     name: `jsenv:as_json_module`,
     appliesDuring: "*",
-    fetchUrlContent: (urlInfo, context) => {
-      return fetchOriginalUrl({
+    fetchUrlContent: async (urlInfo, context) => {
+      const originalUrlInfo = await fetchOriginalUrlInfo({
         urlInfo,
         context,
         searchParam: "as_json_module",
-        convertToJsModule: (urlInfo) => {
-          // here we could `export default ${jsonText}`:
-          // but js engine are optimized to recognize JSON.parse
-          // and use a faster parsing strategy
-          return `export default JSON.parse(${JSON.stringify(
-            urlInfo.content.trim(),
-          )})`
-        },
+        expectedType: "json",
       })
+      if (!originalUrlInfo) {
+        return null
+      }
+      const jsonText = JSON.stringify(originalUrlInfo.content.trim())
+      return {
+        type: "js_module",
+        contentType: "text/javascript",
+        // here we could `export default ${jsonText}`:
+        // but js engine are optimized to recognize JSON.parse
+        // and use a faster parsing strategy
+        content: `export default JSON.parse(${jsonText})`,
+      }
     },
   }
 
   const asCssModule = {
     name: `jsenv:as_css_module`,
     appliesDuring: "*",
-    fetchUrlContent: (urlInfo, context) => {
-      return fetchOriginalUrl({
+    fetchUrlContent: async (urlInfo, context) => {
+      const originalUrlInfo = await fetchOriginalUrlInfo({
         urlInfo,
         context,
         searchParam: "as_css_module",
-        convertToJsModule: (urlInfo) => {
-          const cssText = JS_QUOTES.escapeSpecialChars(urlInfo.content, {
-            // If template string is choosen and runtime do not support template literals
-            // it's ok because "jsenv:new_inline_content" plugin executes after this one
-            // and convert template strings into raw strings
-            canUseTemplateString: true,
-          })
-          return `import { InlineContent } from ${JSON.stringify(
-            inlineContentClientFileUrl,
-          )}
-    
-const inlineContent = new InlineContent(${cssText}, { type: "text/css" })
-const stylesheet = new CSSStyleSheet()
-stylesheet.replaceSync(inlineContent.text)
-export default stylesheet`
-        },
+        expectedType: "css",
+      })
+      if (!originalUrlInfo) {
+        return null
+      }
+      const cssText = JS_QUOTES.escapeSpecialChars(originalUrlInfo.content, {
+        // If template string is choosen and runtime do not support template literals
+        // it's ok because "jsenv:new_inline_content" plugin executes after this one
+        // and convert template strings into raw strings
+        canUseTemplateString: true,
       })
+      return {
+        type: "js_module",
+        contentType: "text/javascript",
+        content: `import { InlineContent } from ${JSON.stringify(
+          inlineContentClientFileUrl,
+        )}
+  
+  const inlineContent = new InlineContent(${cssText}, { type: "text/css" })
+  const stylesheet = new CSSStyleSheet()
+  stylesheet.replaceSync(inlineContent.text)
+  export default stylesheet`,
+      }
     },
   }
 
   const asTextModule = {
     name: `jsenv:as_text_module`,
     appliesDuring: "*",
-    fetchUrlContent: (urlInfo, context) => {
-      return fetchOriginalUrl({
+    fetchUrlContent: async (urlInfo, context) => {
+      const originalUrlInfo = await fetchOriginalUrlInfo({
         urlInfo,
         context,
         searchParam: "as_text_module",
-        convertToJsModule: (urlInfo) => {
-          const textPlain = JS_QUOTES.escapeSpecialChars(urlInfo.content, {
-            // If template string is choosen and runtime do not support template literals
-            // it's ok because "jsenv:new_inline_content" plugin executes after this one
-            // and convert template strings into raw strings
-            canUseTemplateString: true,
-          })
-          return `import { InlineContent } from ${JSON.stringify(
-            inlineContentClientFileUrl,
-          )}
-    
-const inlineContent = new InlineContent(${textPlain}, { type: "text/plain" })
-export default inlineContent.text`
-        },
+        expectedType: "text",
+      })
+      if (!originalUrlInfo) {
+        return null
+      }
+      const textPlain = JS_QUOTES.escapeSpecialChars(urlInfo.content, {
+        // If template string is choosen and runtime do not support template literals
+        // it's ok because "jsenv:new_inline_content" plugin executes after this one
+        // and convert template strings into raw strings
+        canUseTemplateString: true,
       })
+      return {
+        type: "js_module",
+        contentType: "text/javascript",
+        content: `import { InlineContent } from ${JSON.stringify(
+          inlineContentClientFileUrl,
+        )}
+  
+const inlineContent = new InlineContent(${textPlain}, { type: "text/plain" })
+export default inlineContent.text`,
+      }
     },
   }
 
   return [asJsonModule, asCssModule, asTextModule]
 }
 
-const fetchOriginalUrl = async ({
-  urlInfo,
-  context,
-  searchParam,
-  expectedType,
-  convertToJsModule,
-}) => {
-  const urlObject = new URL(urlInfo.url)
-  const { searchParams } = urlObject
-  if (!searchParams.has(searchParam)) {
-    return null
-  }
-  searchParams.delete(searchParam)
-  const originalUrl = urlObject.href
-  const originalReference = {
-    ...(context.reference.original || context.reference),
-    expectedType,
-  }
-  originalReference.url = originalUrl
-  const originalUrlInfo = context.urlGraph.reuseOrCreateUrlInfo(
-    originalReference.url,
-  )
-  await context.fetchUrlContent({
-    reference: originalReference,
-    urlInfo: originalUrlInfo,
-  })
-  return {
-    type: "js_module",
-    contentType: "text/javascript",
-    content: convertToJsModule(originalUrlInfo, context),
-  }
-}
-
 const importAsInfos = {
   json: {
     searchParam: "as_json_module",
-    expectedType: "json",
   },
   css: {
     searchParam: "as_css_module",
-    expectedType: "css",
   },
   text: {
     searchParam: "as_text_module",
-    expectedType: "text",
   },
 }
 

package/src/plugins/url_references/js/js_urls.js

@@ -18,10 +18,7 @@ export const parseAndTransformJsUrls = async (urlInfo, context) => {
   const isWebWorker = isWebWorkerUrlInfo(urlInfo)
   const { metadata } = await applyBabelPlugins({
     babelPlugins: [
-      [
-        babelPluginMetadataJsUrlMentions,
-        { isJsModule, isWebWorker, searchSystemJs: !isJsModule },
-      ],
+      [babelPluginMetadataJsUrlMentions, { isJsModule, isWebWorker }],
     ],
     urlInfo,
   })
@@ -67,10 +64,7 @@ export const parseAndTransformJsUrls = async (urlInfo, context) => {
  * https://github.com/mjackson/babel-plugin-import-visitor
  *
  */
-const babelPluginMetadataJsUrlMentions = (
-  _,
-  { isJsModule, isWebWorker, searchSystemJs },
-) => {
+const babelPluginMetadataJsUrlMentions = (_, { isJsModule, isWebWorker }) => {
   return {
     name: "metadata-js-mentions",
     visitor: {
@@ -112,17 +106,16 @@ const babelPluginMetadataJsUrlMentions = (
           },
           NewExpression: (path) => {
             callStaticAnalyzers(path, [
-              analyzeNewWorkerOrNewSharedWorker,
-              analyzeNewUrlCall,
+              (path) => analyzeNewWorkerOrNewSharedWorker(path, { isJsModule }),
+              (path) => analyzeNewUrlCall(path, { isJsModule }),
             ])
           },
         }
         const callExpressionStaticAnalysers = [
-          ...(isJsModule ? [analyzeImportCall] : []),
+          ...(isJsModule
+            ? [analyzeImportCall]
+            : [analyzeSystemRegisterCall, analyzeSystemImportCall]),
           ...(isWebWorker ? [analyzeImportScriptCalls] : []),
-          ...(searchSystemJs
-            ? [analyzeSystemRegisterCall, analyzeSystemImportCall]
-            : []),
           analyzeServiceWorkerRegisterCall,
         ]
         visitors.CallExpression = (path) => {