@jsenv/core 22.4.0 → 23.0.0

package/src/internal/toolbar/eventsource/toolbar.eventsource.js

@@ -18,8 +18,13 @@ export const initToolbarEventSource = ({
   executedFileRelativeUrl,
   livereloading,
 }) => {
+  const getLivereloadCallback = (originalFileProjectRelativeUrl) => {
+    const callbacks = window.parent.__jsenv__.livereloadingCallbacks
+    return callbacks[originalFileProjectRelativeUrl]
+  }
+
   removeForceHideElement(document.querySelector("#eventsource-indicator"))
-  connectEventSource(executedFileRelativeUrl)
+  connectEventSource({ executedFileRelativeUrl, getLivereloadCallback })
   livereloadingAvailableOnServer = livereloading
   if (!livereloadingAvailableOnServer) {
     disableLivereloadSetting()
@@ -54,11 +59,18 @@ let eventSourceHooks = {}
 let eventSourceConnection
 let connectionReadyPromise
 
-const handleFileChange = (file, type) => {
-  latestChangeMap[file] = type
+const handleFileChange = ({ file, eventType, livereloadCallback }) => {
+  latestChangeMap[file] = eventType
   updateEventSourceIndicator()
+
   if (shouldLivereload()) {
-    if (
+    if (livereloadCallback) {
+      livereloadCallback({
+        file,
+        latestChangeMap,
+        reloadPage,
+      })
+    } else if (
       file.endsWith(".css") ||
       file.endsWith(".scss") ||
       file.endsWith(".sass")
@@ -109,7 +121,10 @@ const reloadChanges = () => {
   }
 }
 
-const connectEventSource = (executedFileRelativeUrl) => {
+const connectEventSource = ({
+  executedFileRelativeUrl,
+  getLivereloadCallback,
+}) => {
   updateEventSourceIndicator()
   connectionReadyPromise = createPromiseAndHooks()
 
@@ -117,13 +132,25 @@ const connectEventSource = (executedFileRelativeUrl) => {
     executedFileRelativeUrl,
     {
       onFileModified: (file) => {
-        handleFileChange(file, "modified")
+        handleFileChange({
+          file,
+          eventType: "modified",
+          livereloadCallback: getLivereloadCallback(file),
+        })
       },
       onFileRemoved: (file) => {
-        handleFileChange(file, "removed")
+        handleFileChange({
+          file,
+          eventType: "removed",
+          livereloadCallback: getLivereloadCallback(file),
+        })
       },
       onFileAdded: (file) => {
-        handleFileChange(file, "added")
+        handleFileChange({
+          file,
+          eventType: "added",
+          livereloadCallback: getLivereloadCallback(file),
+        })
       },
       onConnecting: ({ cancel }) => {
         eventSourceState = "connecting"

package/src/internal/toolbar/toolbar.main.js

@@ -80,7 +80,10 @@ const renderToolbar = async () => {
   renderCompilationInToolbar({ compileGroup })
   // this might become active but we need to detect this somehow
   deactivateToolbarSection(document.querySelector("#file-list-link"))
-  initToolbarEventSource({ executedFileRelativeUrl, livereloading })
+  initToolbarEventSource({
+    executedFileRelativeUrl,
+    livereloading,
+  })
 
   // if user click enter or space quickly while closing toolbar
   // it will cancel the closing
@@ -188,13 +191,13 @@ const getCompileGroup = ({
   outDirectoryRelativeUrl,
   compileServerOrigin,
 }) => {
-  const outDirectoryRemoteUrl = String(
+  const outDirectoryServerUrl = String(
     new URL(outDirectoryRelativeUrl, compileServerOrigin),
   )
-  if (urlIsInsideOf(executedFileCompiledUrl, outDirectoryRemoteUrl)) {
+  if (urlIsInsideOf(executedFileCompiledUrl, outDirectoryServerUrl)) {
     const afterCompileDirectory = urlToRelativeUrl(
       executedFileCompiledUrl,
-      outDirectoryRemoteUrl,
+      outDirectoryServerUrl,
     )
     const slashIndex = afterCompileDirectory.indexOf("/")
     const fileRelativeUrl = afterCompileDirectory.slice(slashIndex + 1)

package/src/internal/url_utils.js

@@ -0,0 +1,33 @@
+import { urlToOrigin, urlToRessource, urlToExtension } from "@jsenv/filesystem"
+
+export const setUrlExtension = (url, extension) => {
+  const origin = urlToOrigin(url)
+  const currentExtension = urlToExtension(url)
+  const ressource = urlToRessource(url)
+  const [pathname, search] = ressource.split("?")
+  const pathnameWithoutExtension = currentExtension
+    ? pathname.slice(0, -currentExtension.length)
+    : pathname
+  const newPathname = `${pathnameWithoutExtension}${extension}`
+  return `${origin}${newPathname}${search ? `?${search}` : ""}`
+}
+
+export const getUrlSearchParamsDescriptor = (url) => {
+  const urlObject = new URL(url)
+  const { searchParams } = urlObject
+  const searchParamsDescriptor = {}
+  Array.from(searchParams.keys()).forEach((key) => {
+    const value = searchParams.getAll(key)
+    searchParamsDescriptor[key] = value.length === 1 ? value[0] : value
+  })
+  return searchParamsDescriptor
+}
+
+export const setUrlSearchParamsDescriptor = (url, searchParamsDescriptor) => {
+  const urlObject = new URL(url)
+  const { searchParams } = urlObject
+  Object.keys(searchParamsDescriptor).forEach((key) => {
+    searchParams.set(key, searchParamsDescriptor[key])
+  })
+  return String(urlObject)
+}

package/src/internal/url_utils.test.js

@@ -0,0 +1,39 @@
+import { assert } from "@jsenv/assert"
+
+import { setUrlExtension } from "./url_utils.js"
+
+{
+  const actual = setUrlExtension(`http://example.com/file.jsx`, ".js")
+  const expected = "http://example.com/file.js"
+  assert({ actual, expected })
+}
+
+{
+  const actual = setUrlExtension(`http://example.com/file.mjsx?foo=bar`, ".js")
+  const expected = "http://example.com/file.js?foo=bar"
+  assert({ actual, expected })
+}
+
+{
+  const actual = setUrlExtension(`http://example.com/file.?foo=bar`, ".js")
+  const expected = "http://example.com/file.js?foo=bar"
+  assert({ actual, expected })
+}
+
+{
+  const actual = setUrlExtension(`http://example.com/file?foo=bar`, ".js")
+  const expected = "http://example.com/file.js?foo=bar"
+  assert({ actual, expected })
+}
+
+{
+  const actual = setUrlExtension(`http://example.com/file.js?foo=bar`, ".")
+  const expected = "http://example.com/file.?foo=bar"
+  assert({ actual, expected })
+}
+
+{
+  const actual = setUrlExtension(`http://example.com/file.js?foo=bar`, "")
+  const expected = "http://example.com/file?foo=bar"
+  assert({ actual, expected })
+}

package/src/jsonToJavaScriptModule.js

@@ -0,0 +1,12 @@
+export const jsonToJavaScriptModule = async ({ code, url }) => {
+  const codeAsJson = JSON.stringify(code)
+
+  return {
+    compiledSource: `export default ${codeAsJson}`,
+    contentType: "application/javascript",
+    sources: [url],
+    sourcesContent: [code],
+    assets: [],
+    assetsContent: [],
+  }
+}

package/src/launchBrowser.js

@@ -5,11 +5,12 @@ import {
   createCancellationToken,
   createStoppableOperation,
 } from "@jsenv/cancellation"
+import { createDetailedMessage } from "@jsenv/logger"
 import { teardownSignal } from "@jsenv/node-signals"
 
 import { trackRessources } from "./internal/trackRessources.js"
 import { fetchUrl } from "./internal/fetchUrl.js"
-import { validateResponseStatusIsOk } from "./internal/validateResponseStatusIsOk.js"
+import { validateResponse } from "./internal/response_validation.js"
 import { trackPageToNotify } from "./internal/browser-launcher/trackPageToNotify.js"
 import { createSharing } from "./internal/browser-launcher/createSharing.js"
 import { executeHtmlFile } from "./internal/browser-launcher/executeHtmlFile.js"
@@ -20,8 +21,11 @@ import {
 } from "./playwright_browser_versions.js"
 
 const chromiumSharing = createSharing()
-
-export const launchChromium = async ({
+export const chromiumRuntime = {
+  name: "chromium",
+  version: PLAYWRIGHT_CHROMIUM_VERSION,
+}
+chromiumRuntime.launch = async ({
   browserServerLogLevel,
   cancellationToken = createCancellationToken(),
   chromiumExecutablePath,
@@ -91,9 +95,11 @@ export const launchChromium = async ({
       cancellationToken,
       ignoreHttpsError: true,
     })
-    const { valid, message } = await validateResponseStatusIsOk(browserResponse)
-    if (!valid) {
-      throw new Error(message)
+    const { isValid, message, details } = await validateResponse(
+      browserResponse,
+    )
+    if (!isValid) {
+      throw new Error(createDetailedMessage(message, details))
     }
 
     const browserResponseObject = JSON.parse(browserResponse.body)
@@ -103,8 +109,6 @@ export const launchChromium = async ({
 
   return {
     browser,
-    runtimeName: "chromium",
-    runtimeVersion: PLAYWRIGHT_CHROMIUM_VERSION,
     stop: ressourceTracker.cleanup,
     ...browserToRuntimeHooks(browser, {
       browserServerLogLevel,
@@ -124,16 +128,21 @@ export const launchChromium = async ({
     }),
   }
 }
-
-export const launchChromiumTab = (namedArgs) =>
-  launchChromium({
-    share: true,
-    ...namedArgs,
-  })
+export const chromiumTabRuntime = {
+  ...chromiumRuntime,
+  launch: (params) =>
+    chromiumRuntime.launch({
+      shared: true,
+      ...params,
+    }),
+}
 
 const firefoxSharing = createSharing()
-
-export const launchFirefox = async ({
+export const firefoxRuntime = {
+  name: "firefox",
+  version: PLAYWRIGHT_FIREFOX_VERSION,
+}
+firefoxRuntime.launch = async ({
   cancellationToken = createCancellationToken(),
   firefoxExecutablePath,
   browserServerLogLevel,
@@ -179,8 +188,6 @@ export const launchFirefox = async ({
 
   return {
     browser,
-    runtimeName: "firefox",
-    runtimeVersion: PLAYWRIGHT_FIREFOX_VERSION,
     stop: ressourceTracker.cleanup,
     ...browserToRuntimeHooks(browser, {
       browserServerLogLevel,
@@ -199,16 +206,21 @@ export const launchFirefox = async ({
     }),
   }
 }
-
-export const launchFirefoxTab = (namedArgs) =>
-  launchFirefox({
-    share: true,
-    ...namedArgs,
-  })
+export const firefoxTabRuntime = {
+  ...firefoxRuntime,
+  launch: (params) =>
+    firefoxRuntime.launch({
+      shared: true,
+      ...params,
+    }),
+}
 
 const webkitSharing = createSharing()
-
-export const launchWebkit = async ({
+export const webkitRuntime = {
+  name: "webkit",
+  version: PLAYWRIGHT_WEBKIT_VERSION,
+}
+webkitRuntime.launch = async ({
   browserServerLogLevel,
   cancellationToken = createCancellationToken(),
   webkitExecutablePath,
@@ -254,8 +266,7 @@ export const launchWebkit = async ({
 
   return {
     browser,
-    runtimeName: "webkit",
-    runtimeVersion: PLAYWRIGHT_WEBKIT_VERSION,
+
     stop: ressourceTracker.cleanup,
     ...browserToRuntimeHooks(browser, {
       browserServerLogLevel,
@@ -274,12 +285,14 @@ export const launchWebkit = async ({
     }),
   }
 }
-
-export const launchWebkitTab = (namedArgs) =>
-  launchWebkit({
-    share: true,
-    ...namedArgs,
-  })
+export const webkitTabRuntime = {
+  ...webkitRuntime,
+  launch: (params) =>
+    webkitRuntime.launch({
+      shared: true,
+      ...params,
+    }),
+}
 
 const launchBrowser = async (
   browserName,
@@ -437,5 +450,8 @@ const isTargetClosedError = (error) => {
   if (error.message.match(/Protocol error \(.*?\): Browser.*?closed/)) {
     return true
   }
+  if (error.message.includes("browserContext.close: Browser closed")) {
+    return true
+  }
   return false
 }

package/src/launchNode.js

@@ -1,6 +1,5 @@
 /* eslint-disable import/max-dependencies */
-import { Script } from "vm"
-
+import { Script } from "node:vm"
 import cuid from "cuid"
 import { loggerToLogLevel } from "@jsenv/logger"
 import { createCancellationToken } from "@jsenv/cancellation"
@@ -17,7 +16,11 @@ import { escapeRegexpSpecialCharacters } from "./internal/escapeRegexpSpecialCha
 import { createControllableNodeProcess } from "./internal/node-launcher/createControllableNodeProcess.js"
 import { v8CoverageFromNodeV8Directory } from "./internal/executing/coverage/v8CoverageFromNodeV8Directory.js"
 
-export const launchNode = async ({
+export const nodeRuntime = {
+  name: "node",
+  version: process.version.slice(1),
+}
+nodeRuntime.launch = async ({
   logger,
   logProcessCommand,
   cancellationToken = createCancellationToken(),

package/src/requireUsingChildProcess.js

@@ -18,41 +18,45 @@ export const requireUsingChildProcess = async (
   const result = await launchAndExecute({
     stopAfterExecute: true,
     fileRelativeUrl: String(fileUrl),
-    launch: async () => {
-      const controllableNodeProcess = await createControllableNodeProcess({
-        logLevel,
-        debugPort,
-        debugMode,
-        debugModeInheritBreak,
-        env,
-        commandLineOptions,
-        stdin,
-        stdout,
-        stderr,
-      })
+    runtime: {
+      name: "node",
+      version: process.version.slice(1),
+      launch: async () => {
+        const controllableNodeProcess = await createControllableNodeProcess({
+          logLevel,
+          debugPort,
+          debugMode,
+          debugModeInheritBreak,
+          env,
+          commandLineOptions,
+          stdin,
+          stdout,
+          stderr,
+        })
 
-      return {
-        ...controllableNodeProcess,
-        execute: async () => {
-          try {
-            const namespace =
-              await controllableNodeProcess.requestActionOnChildProcess({
-                actionType: "execute-using-require",
-                actionParams: { fileUrl },
-              })
+        return {
+          ...controllableNodeProcess,
+          execute: async () => {
+            try {
+              const namespace =
+                await controllableNodeProcess.requestActionOnChildProcess({
+                  actionType: "execute-using-require",
+                  actionParams: { fileUrl },
+                })
 
-            return {
-              status: "ok",
-              namespace,
+              return {
+                status: "ok",
+                namespace,
+              }
+            } catch (e) {
+              return {
+                status: "errored",
+                error: e,
+              }
             }
-          } catch (e) {
-            return {
-              status: "errored",
-              error: e,
-            }
-          }
-        },
-      }
+          },
+        }
+      },
     },
   })
   if (result.status === "errored") {

package/src/startExploring.js

@@ -54,6 +54,7 @@ export const startExploring = async ({
   compileServerPrivateKey,
   customCompilers,
   livereloadWatchConfig,
+  jsenvDirectoryClean,
 }) => {
   const jsenvStartExploringFunction = async ({ jsenvCancellationToken }) => {
     cancellationToken = composeCancellationToken(
@@ -117,6 +118,7 @@ export const startExploring = async ({
       babelPluginMap,
       runtimeSupport: runtimeSupportDuringDev,
       livereloadWatchConfig,
+      jsenvDirectoryClean,
     })
 
     return compileServer
@@ -145,6 +147,19 @@ const createRedirectFilesService = ({ projectDirectoryUrl }) => {
     projectDirectoryUrl,
   )
 
+  // unfortunately browser resolves sourcemap to url before redirection (not after).
+  // It means browser tries to load source map from "/.jsenv/jsenv-toolbar.js.map"
+  // we could also inline sourcemap but it's not yet possible
+  // inside buildProject
+  const jsenvExploringIndexSourcemapInfo = {
+    pathForBrowser: `/.jsenv/jsenv_exploring_index.js.map`,
+    pathForServer: `/${jsenvExploringJsBuildRelativeUrlForProject}.map`,
+  }
+  const jsenvToolbarSourcemapInfo = {
+    pathForBrowser: `/.jsenv/jsenv_toolbar.js.map`,
+    pathForServer: `/${jsenvToolbarJsBuildRelativeUrlForProject}.map`,
+  }
+
   return (request) => {
     // exploring redirection
     if (request.ressource === "/") {
@@ -176,6 +191,14 @@ const createRedirectFilesService = ({ projectDirectoryUrl }) => {
         },
       }
     }
+    if (request.ressource === jsenvExploringIndexSourcemapInfo.pathForBrowser) {
+      return {
+        status: 307,
+        headers: {
+          location: `${request.origin}${jsenvExploringIndexSourcemapInfo.pathForServer}`,
+        },
+      }
+    }
 
     // toolbar
     if (request.ressource === "/.jsenv/toolbar.main.js") {
@@ -187,20 +210,11 @@ const createRedirectFilesService = ({ projectDirectoryUrl }) => {
         },
       }
     }
-    // unfortunately browser don't resolve sourcemap to url after redirection
-    // but to url before. It means browser tries to load source map from
-    // "/.jsenv/jsenv-toolbar.js.map"
-    // we could also inline sourcemap but it's not yet possible
-    // inside buildProject
-    if (
-      request.ressource ===
-      `/.jsenv/${jsenvToolbarJsFileInfo.sourcemapFilename}`
-    ) {
-      const jsenvToolbarJsBuildSourcemapServerUrl = `${request.origin}/${jsenvToolbarJsBuildRelativeUrlForProject}.map`
+    if (request.ressource === jsenvToolbarSourcemapInfo.pathForBrowser) {
       return {
         status: 307,
         headers: {
-          location: jsenvToolbarJsBuildSourcemapServerUrl,
+          location: `${request.origin}${jsenvToolbarSourcemapInfo.pathForServer}`,
         },
       }
     }

package/src/internal/building/transformImportMetaUrlReferences.js

@@ -1,71 +0,0 @@
-import { resolveUrl } from "@jsenv/filesystem"
-
-import { referenceToCodeForRollup } from "./ressource_builder.js"
-
-export const transformImportMetaUrlReferences = async ({
-  url,
-  // importerUrl,
-  code,
-  ast,
-  ressourceBuilder,
-  markBuildRelativeUrlAsUsedByJs,
-}) => {
-  const { default: MagicString } = await import("magic-string")
-  const magicString = new MagicString(code)
-
-  const { asyncWalk } = await import("estree-walker")
-
-  await asyncWalk(ast, {
-    enter: async (node) => {
-      if (!isNewUrlImportMetaUrl(node)) {
-        return
-      }
-      const relativeUrl = node.arguments[0].value
-
-      const ressourceUrl = resolveUrl(relativeUrl, url)
-
-      const reference = await ressourceBuilder.createReferenceFoundInJsModule({
-        jsUrl: url,
-        ...(node.loc
-          ? {
-              jsLine: node.loc.start.line,
-              jsColumn: node.loc.start.column,
-            }
-          : {}),
-
-        ressourceSpecifier: ressourceUrl,
-      })
-      if (reference) {
-        magicString.overwrite(
-          node.start,
-          node.end,
-          referenceToCodeForRollup(reference),
-        )
-        markBuildRelativeUrlAsUsedByJs(reference.ressource.buildRelativeUrl)
-      }
-    },
-  })
-
-  const codeOutput = magicString.toString()
-  const map = magicString.generateMap({ hires: true })
-
-  return {
-    code: codeOutput,
-    map,
-  }
-}
-
-const isNewUrlImportMetaUrl = (node) => {
-  return (
-    node.type === "NewExpression" &&
-    node.callee.type === "Identifier" &&
-    node.callee.name === "URL" &&
-    node.arguments.length === 2 &&
-    node.arguments[0].type === "Literal" &&
-    typeof node.arguments[0].value === "string" &&
-    node.arguments[1].type === "MemberExpression" &&
-    node.arguments[1].object.type === "MetaProperty" &&
-    node.arguments[1].property.type === "Identifier" &&
-    node.arguments[1].property.name === "url"
-  )
-}

package/src/internal/runtime/resolveBrowserGroup.js

@@ -1,5 +0,0 @@
-import { detectBrowser } from "./detectBrowser/detectBrowser.js"
-import { resolveGroup } from "./resolveGroup.js"
-
-export const resolveBrowserGroup = (groupMap) =>
-  resolveGroup(detectBrowser(), groupMap)

package/src/internal/runtime/resolveNodeGroup.js

@@ -1,5 +0,0 @@
-import { detectNode } from "./detectNode/detectNode.js"
-import { resolveGroup } from "./resolveGroup.js"
-
-export const resolveNodeGroup = (groupMap) =>
-  resolveGroup(detectNode(), groupMap)