@jsenv/core 27.5.3 → 27.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/core",
-  "version": "27.5.3",
+  "version": "27.7.0",
   "description": "Tool to develop, test and build js projects",
   "license": "MIT",
   "author": {
@@ -73,8 +73,8 @@
     "@jsenv/integrity": "0.0.1",
     "@jsenv/log": "3.1.0",
     "@jsenv/node-esm-resolution": "0.1.0",
-    "@jsenv/server": "13.0.0",
-    "@jsenv/sourcemap": "1.0.2",
+    "@jsenv/server": "13.1.0",
+    "@jsenv/sourcemap": "1.0.4",
     "@jsenv/uneval": "1.6.0",
     "@jsenv/url-meta": "7.0.0",
     "@jsenv/urls": "1.2.7",
@@ -109,7 +109,7 @@
     "eslint-plugin-html": "7.0.0",
     "eslint-plugin-import": "2.26.0",
     "eslint-plugin-react": "7.30.1",
-    "playwright": "1.23.4",
+    "playwright": "1.24.1",
     "prettier": "2.7.1"
   }
 }

package/src/build/build.js

@@ -47,6 +47,20 @@ import { createVersionGenerator } from "./version_generator.js"
 import { injectServiceWorkerUrls } from "./inject_service_worker_urls.js"
 import { resyncRessourceHints } from "./resync_ressource_hints.js"
 
+// default runtimeCompat corresponds to
+// "we can keep <script type="module"> intact":
+// so script_type_module + dynamic_import + import_meta
+export const defaultRuntimeCompat = {
+  // android: "8",
+  chrome: "64",
+  edge: "79",
+  firefox: "67",
+  ios: "12",
+  opera: "51",
+  safari: "11.3",
+  samsung: "9.2",
+}
+
 /**
  * Generate an optimized version of source files into a directory
  * @param {Object} buildParameters
@@ -85,19 +99,7 @@ export const build = async ({
   entryPoints = {},
   baseUrl = "/",
 
-  // default runtimeCompat corresponds to
-  // "we can keep <script type="module"> intact":
-  // so script_type_module + dynamic_import + import_meta
-  runtimeCompat = {
-    // android: "8",
-    chrome: "64",
-    edge: "79",
-    firefox: "67",
-    ios: "12",
-    opera: "51",
-    safari: "11.3",
-    samsung: "9.2",
-  },
+  runtimeCompat = defaultRuntimeCompat,
   plugins = [],
   sourcemaps = false,
   sourcemapsSourcesContent,

package/src/dev/start_dev_server.js

@@ -7,6 +7,7 @@ import { Abort, raceProcessTeardownEvents } from "@jsenv/abort"
 import { createLogger, loggerToLevels, createTaskLog } from "@jsenv/log"
 import { getCallerPosition } from "@jsenv/urls"
 
+import { defaultRuntimeCompat } from "@jsenv/core/src/build/build.js"
 import { createReloadableWorker } from "@jsenv/core/src/helpers/worker_reload.js"
 import { startOmegaServer } from "@jsenv/core/src/omega/omega_server.js"
 
@@ -41,16 +42,10 @@ export const startDevServer = async ({
   devServerMainFile = getCallerPosition().url,
   cooldownBetweenFileEvents,
 
-  // default runtimeCompat assume dev server will be request by recent browsers
-  // Used by "jsenv_plugin_node_runtime.js" to deactivate itself
-  // If dev server can be requested by Node.js to exec files
-  // we would add "node" to the potential runtimes. For now it's out of the scope of the dev server
-  // and "jsenv_plugin_node_runtime.js" applies only during build made for node.js
-  runtimeCompat = {
-    chrome: "100",
-    firefox: "100",
-    safari: "15.5",
-  },
+  // runtimeCompat is the runtimeCompat for the build
+  // when specified, dev server use it to warn in case
+  // code would be supported during dev but not after build
+  runtimeCompat = defaultRuntimeCompat,
   plugins = [],
   urlAnalysis = {},
   htmlSupervisor = true,
@@ -70,6 +65,8 @@ export const startDevServer = async ({
   // toolbar = false,
 
   sourcemaps = "inline",
+  sourcemapsSourcesProtocol,
+  sourcemapsSourcesContent,
   writeGeneratedFiles = true,
 }) => {
   const logger = createLogger({ logLevel })
@@ -160,6 +157,7 @@ export const startDevServer = async ({
     rootDirectoryUrl,
     scenario: "dev",
     runtimeCompat,
+
     plugins,
     urlAnalysis,
     htmlSupervisor,
@@ -171,6 +169,8 @@ export const startDevServer = async ({
     cooldownBetweenFileEvents,
     explorer,
     sourcemaps,
+    sourcemapsSourcesProtocol,
+    sourcemapsSourcesContent,
     writeGeneratedFiles,
   })
   startDevServerTask.done()

package/src/execute/runtimes/browsers/chromium.js

@@ -2,7 +2,7 @@ import { createRuntimeFromPlaywright } from "./from_playwright.js"
 
 export const chromium = createRuntimeFromPlaywright({
   browserName: "chromium",
-  browserVersion: "104.0.5112.20", // to update, check https://github.com/microsoft/playwright/releases
+  browserVersion: "104.0.5112.48", // to update, check https://github.com/microsoft/playwright/releases
   coveragePlaywrightAPIAvailable: true,
 })
 export const chromiumIsolatedTab = chromium.isolatedTab

package/src/execute/runtimes/browsers/firefox.js

@@ -2,6 +2,6 @@ import { createRuntimeFromPlaywright } from "./from_playwright.js"
 
 export const firefox = createRuntimeFromPlaywright({
   browserName: "firefox",
-  browserVersion: "100.0.2", // to update, check https://github.com/microsoft/playwright/releases
+  browserVersion: "102.0", // to update, check https://github.com/microsoft/playwright/releases
 })
 export const firefoxIsolatedTab = firefox.isolatedTab

package/src/execute/runtimes/browsers/webkit.js

@@ -2,7 +2,7 @@ import { createRuntimeFromPlaywright } from "./from_playwright.js"
 
 export const webkit = createRuntimeFromPlaywright({
   browserName: "webkit",
-  browserVersion: "15.4", // to update, check https://github.com/microsoft/playwright/releases
+  browserVersion: "16.0", // to update, check https://github.com/microsoft/playwright/releases
   ignoreErrorHook: (error) => {
     // we catch error during execution but safari throw unhandled rejection
     // in a non-deterministic way.

package/src/omega/kitchen.js

@@ -30,6 +30,9 @@ export const createKitchen = ({
   rootDirectoryUrl,
   scenario,
   runtimeCompat,
+  // during dev/test clientRuntimeCompat is a single runtime
+  // during build clientRuntimeCompat is runtimeCompat
+  clientRuntimeCompat = runtimeCompat,
   urlGraph,
   plugins,
   sourcemaps = {
@@ -37,13 +40,8 @@ export const createKitchen = ({
     test: "inline",
     build: "none",
   }[scenario],
-  sourcemapsSourcesContent = {
-    // during dev/test, chrome is able to find the sourcemap sources
-    // as long as they use file:// protocol in the sourcemap files
-    dev: false,
-    test: false,
-    build: true,
-  }[scenario],
+  sourcemapsSourcesProtocol,
+  sourcemapsSourcesContent,
   sourcemapsRelativeSources,
   writeGeneratedFiles,
 }) => {
@@ -60,6 +58,10 @@ export const createKitchen = ({
     urlGraph,
     scenario,
     runtimeCompat,
+    clientRuntimeCompat,
+    isSupportedOnCurrentClients: (feature) => {
+      return RUNTIME_COMPAT.isSupported(clientRuntimeCompat, feature)
+    },
     isSupportedOnFutureClients: (feature) => {
       return RUNTIME_COMPAT.isSupported(runtimeCompat, feature)
     },
@@ -214,12 +216,15 @@ export const createKitchen = ({
     }
   }
   kitchenContext.resolveReference = resolveReference
+
   const urlInfoTransformer = createUrlInfoTransformer({
     logger,
     urlGraph,
     sourcemaps,
+    sourcemapsSourcesProtocol,
     sourcemapsSourcesContent,
     sourcemapsRelativeSources,
+    clientRuntimeCompat,
     injectSourcemapPlaceholder: ({ urlInfo, specifier }) => {
       const sourcemapReference = createReference({
         trace: {
@@ -356,16 +361,9 @@ export const createKitchen = ({
   }
 
   const _cook = async (urlInfo, dishContext) => {
-    // during dev/test clientRuntimeCompat is a single runtime
-    // during build clientRuntimeCompat is runtimeCompat
-    const { clientRuntimeCompat = runtimeCompat } = dishContext
-    kitchenContext.isSupportedOnCurrentClients = (feature) => {
-      return RUNTIME_COMPAT.isSupported(clientRuntimeCompat, feature)
-    }
     const context = {
       ...kitchenContext,
       ...dishContext,
-      clientRuntimeCompat,
     }
     const { cookDuringCook = cook } = dishContext
     context.cook = (urlInfo, nestedDishContext) => {
@@ -772,7 +770,7 @@ const applyReferenceEffectsOnUrlInfo = (reference, urlInfo, context) => {
     }
     urlInfo.contentType = reference.contentType
     urlInfo.originalContent =
-      context === "build"
+      context.scenario === "build"
         ? urlInfo.originalContent === undefined
           ? reference.content
           : urlInfo.originalContent

package/src/omega/omega_server.js

@@ -5,6 +5,7 @@ import {
   jsenvServiceErrorHandler,
 } from "@jsenv/server"
 import { convertFileSystemErrorToResponseProperties } from "@jsenv/server/src/internal/convertFileSystemErrorToResponseProperties.js"
+import { createServerEventsDispatcher } from "@jsenv/core/src/plugins/server_events/server_events_dispatcher.js"
 
 import { createFileService } from "./server/file_service.js"
 
@@ -38,9 +39,15 @@ export const startOmegaServer = async ({
   cooldownBetweenFileEvents,
   explorer,
   sourcemaps,
+  sourcemapsSourcesProtocol,
+  sourcemapsSourcesContent,
   writeGeneratedFiles,
 }) => {
   const serverStopCallbacks = []
+  const serverEventsDispatcher = createServerEventsDispatcher()
+  serverStopCallbacks.push(() => {
+    serverEventsDispatcher.destroy()
+  })
   const server = await startServer({
     signal,
     stopOnExit: false,
@@ -77,6 +84,7 @@ export const startOmegaServer = async ({
           signal,
           logLevel,
           serverStopCallbacks,
+          serverEventsDispatcher,
 
           rootDirectoryUrl,
           scenario,
@@ -93,8 +101,15 @@ export const startOmegaServer = async ({
           cooldownBetweenFileEvents,
           explorer,
           sourcemaps,
+          sourcemapsSourcesProtocol,
+          sourcemapsSourcesContent,
           writeGeneratedFiles,
         }),
+        handleWebsocket: (websocket, { request }) => {
+          if (request.headers["sec-websocket-protocol"] === "jsenv") {
+            serverEventsDispatcher.addWebsocket(websocket, request)
+          }
+        },
       },
       {
         name: "jsenv:omega_error_handler",

package/src/omega/server/file_service.js

@@ -10,7 +10,6 @@ import { URL_META } from "@jsenv/url-meta"
 import { getCorePlugins } from "@jsenv/core/src/plugins/plugins.js"
 import { createUrlGraph } from "@jsenv/core/src/omega/url_graph.js"
 import { createKitchen } from "@jsenv/core/src/omega/kitchen.js"
-import { createServerEventsDispatcher } from "@jsenv/core/src/plugins/server_events/server_events_dispatcher.js"
 import { jsenvPluginServerEventsClientInjection } from "@jsenv/core/src/plugins/server_events/jsenv_plugin_server_events_client_injection.js"
 import { parseUserAgentHeader } from "./user_agent.js"
 
@@ -18,6 +17,7 @@ export const createFileService = ({
   signal,
   logLevel,
   serverStopCallbacks,
+  serverEventsDispatcher,
 
   rootDirectoryUrl,
   scenario,
@@ -34,17 +34,11 @@ export const createFileService = ({
   cooldownBetweenFileEvents,
   explorer,
   sourcemaps,
+  sourcemapsSourcesProtocol,
+  sourcemapsSourcesContent,
   writeGeneratedFiles,
 }) => {
   const jsenvDirectoryUrl = new URL(".jsenv/", rootDirectoryUrl).href
-  const onErrorWhileServingFileCallbacks = []
-  const onErrorWhileServingFile = (data) => {
-    onErrorWhileServingFileCallbacks.forEach(
-      (onErrorWhileServingFileCallback) => {
-        onErrorWhileServingFileCallback(data)
-      },
-    )
-  }
 
   const clientFileChangeCallbackList = []
   const clientFilesPruneCallbackList = []
@@ -113,6 +107,9 @@ export const createFileService = ({
       rootDirectoryUrl,
       scenario,
       runtimeCompat,
+      clientRuntimeCompat: {
+        [runtimeName]: runtimeVersion,
+      },
       urlGraph,
       plugins: [
         ...plugins,
@@ -134,6 +131,8 @@ export const createFileService = ({
         }),
       ],
       sourcemaps,
+      sourcemapsSourcesProtocol,
+      sourcemapsSourcesContent,
       writeGeneratedFiles,
     })
     serverStopCallbacks.push(() => {
@@ -153,10 +152,6 @@ export const createFileService = ({
       })
       const serverEventNames = Object.keys(allServerEvents)
       if (serverEventNames.length > 0) {
-        const serverEventsDispatcher = createServerEventsDispatcher()
-        serverStopCallbacks.push(() => {
-          serverEventsDispatcher.destroy()
-        })
         Object.keys(allServerEvents).forEach((serverEventName) => {
           allServerEvents[serverEventName]({
             rootDirectoryUrl,
@@ -170,41 +165,7 @@ export const createFileService = ({
             },
           })
         })
-        onErrorWhileServingFileCallbacks.push((data) => {
-          serverEventsDispatcher.dispatchToRoomsMatching(
-            {
-              type: "error_while_serving_file",
-              data,
-            },
-            (room) => {
-              // send only to page depending on this file
-              const errorFileUrl = data.url
-              const roomEntryPointUrl = new URL(
-                room.request.ressource.slice(1),
-                rootDirectoryUrl,
-              ).href
-              const isErrorRelatedToEntryPoint = Boolean(
-                urlGraph.findDependent(errorFileUrl, (dependentUrlInfo) => {
-                  return dependentUrlInfo.url === roomEntryPointUrl
-                }),
-              )
-              return isErrorRelatedToEntryPoint
-            },
-          )
-        })
-        // "unshift" because serve must come first to catch event source client request
-        kitchen.pluginController.unshiftPlugin({
-          name: "jsenv:provide_server_events",
-          serve: (request) => {
-            const { accept } = request.headers
-            if (accept && accept.includes("text/event-stream")) {
-              const room = serverEventsDispatcher.addRoom(request)
-              return room.join(request)
-            }
-            return null
-          },
-        })
-        // "push" so that event source client connection can be put as early as possible in html
+        // "pushPlugin" so that event source client connection can be put as early as possible in html
         kitchen.pluginController.pushPlugin(
           jsenvPluginServerEventsClientInjection(),
         )
@@ -286,6 +247,7 @@ export const createFileService = ({
         !urlInfo.isInline &&
         urlInfo.type !== "sourcemap"
       ) {
+        urlInfo.error = null
         urlInfo.sourcemap = null
         urlInfo.sourcemapReference = null
         urlInfo.content = null
@@ -298,9 +260,6 @@ export const createFileService = ({
       await kitchen.cook(urlInfo, {
         request,
         reference,
-        clientRuntimeCompat: {
-          [runtimeName]: runtimeVersion,
-        },
         outDirectoryUrl:
           scenario === "dev"
             ? `${rootDirectoryUrl}.jsenv/${runtimeName}@${runtimeVersion}/`
@@ -333,18 +292,9 @@ export const createFileService = ({
       )
       return response
     } catch (e) {
+      urlInfo.error = e
       const code = e.code
       if (code === "PARSE_ERROR") {
-        onErrorWhileServingFile({
-          requestedRessource: request.ressource,
-          code: "PARSE_ERROR",
-          message: e.reason,
-          url: e.url,
-          traceUrl: e.traceUrl,
-          traceLine: e.traceLine,
-          traceColumn: e.traceColumn,
-          traceMessage: e.traceMessage,
-        })
         return {
           url: reference.url,
           status: 200, // let the browser re-throw the syntax error
@@ -375,19 +325,6 @@ export const createFileService = ({
         }
       }
       if (code === "NOT_FOUND") {
-        onErrorWhileServingFile({
-          requestedRessource: request.ressource,
-          isFaviconAutoRequest:
-            request.ressource === "/favicon.ico" &&
-            reference.type === "http_request",
-          code: "NOT_FOUND",
-          message: e.reason,
-          url: e.url,
-          traceUrl: e.traceUrl,
-          traceLine: e.traceLine,
-          traceColumn: e.traceColumn,
-          traceMessage: e.traceMessage,
-        })
         return {
           url: reference.url,
           status: 404,
@@ -395,16 +332,6 @@ export const createFileService = ({
           statusMessage: e.message,
         }
       }
-      onErrorWhileServingFile({
-        requestedRessource: request.ressource,
-        code: "UNEXPECTED",
-        stack: e.stack,
-        url: e.url,
-        traceUrl: e.traceUrl,
-        traceLine: e.traceLine,
-        traceColumn: e.traceColumn,
-        traceMessage: e.traceMessage,
-      })
       return {
         url: reference.url,
         status: 500,

package/src/omega/url_graph/url_graph_load.js

@@ -7,7 +7,6 @@ export const loadUrlGraph = async ({
   startLoading,
   writeGeneratedFiles,
   outDirectoryUrl,
-  clientRuntimeCompat,
 }) => {
   if (writeGeneratedFiles && outDirectoryUrl) {
     await ensureEmptyDirectory(outDirectoryUrl)
@@ -19,7 +18,6 @@ export const loadUrlGraph = async ({
     if (promiseFromData) return promiseFromData
     const promise = _cook(urlInfo, {
       outDirectoryUrl,
-      clientRuntimeCompat,
       ...context,
     })
     promises.push(promise)

package/src/omega/url_graph/url_info_transformations.js

@@ -11,12 +11,29 @@ import {
 export const createUrlInfoTransformer = ({
   logger,
   sourcemaps,
+  sourcemapsSourcesProtocol,
   sourcemapsSourcesContent,
   sourcemapsRelativeSources,
   urlGraph,
+  clientRuntimeCompat,
   injectSourcemapPlaceholder,
   foundSourcemap,
 }) => {
+  const runtimeNames = Object.keys(clientRuntimeCompat)
+  const chromeAsSingleRuntime =
+    runtimeNames.length === 1 && runtimeNames[0] === "chrome"
+  if (sourcemapsSourcesProtocol === undefined) {
+    sourcemapsSourcesProtocol = "file:///"
+  }
+  if (sourcemapsSourcesContent === undefined) {
+    if (chromeAsSingleRuntime && sourcemapsSourcesProtocol === "file:///") {
+      // chrome is able to fetch source when referenced with "file:"
+      sourcemapsSourcesContent = false
+    } else {
+      sourcemapsSourcesContent = true
+    }
+  }
+
   const sourcemapsEnabled =
     sourcemaps === "inline" ||
     sourcemaps === "file" ||
@@ -172,6 +189,16 @@ export const createUrlInfoTransformer = ({
           return sourceRelative || "."
         })
       }
+      if (sourcemapsSourcesProtocol !== "file:///") {
+        sourcemap.sources = sourcemap.sources.map((source) => {
+          if (source.startsWith("file:///")) {
+            return `${sourcemapsSourcesProtocol}${source.slice(
+              "file:///".length,
+            )}`
+          }
+          return source
+        })
+      }
       sourcemapUrlInfo.content = JSON.stringify(sourcemap, null, "  ")
       if (!urlInfo.sourcemapIsWrong) {
         if (sourcemaps === "inline") {

package/src/omega/url_graph.js

@@ -218,6 +218,7 @@ export const createUrlGraph = ({
 
 const createUrlInfo = (url) => {
   return {
+    error: null,
     modifiedTimestamp: 0,
     contentEtag: null,
     dependsOnPackageJson: false,

package/src/plugins/autoreload/client/autoreload.js

@@ -15,6 +15,7 @@ const reloader = {
   isAutoreloadEnabled,
   setAutoreloadPreference,
   status: "idle",
+  currentExecution: null,
   onstatuschange: () => {},
   setStatus: (status) => {
     reloader.status = status
@@ -49,6 +50,7 @@ const reloader = {
       promise.then(
         () => {
           onApplied(reloadMessage)
+          reloader.currentExecution = null
         },
         (e) => {
           reloader.setStatus("failed")
@@ -61,6 +63,7 @@ const reloader = {
             `[jsenv] Hot reload failed after ${reloadMessage.reason}.
 This could be due to syntax errors or importing non-existent modules (see errors in console)`,
           )
+          reloader.currentExecution = null
         },
       )
     }
@@ -146,6 +149,10 @@ const applyHotReload = async ({ hotInstructions }) => {
           await urlHotMeta.disposeCallback()
         }
         console.log(`importing js module`)
+        reloader.currentExecution = {
+          type: "dynamic_import",
+          url: urlToFetch,
+        }
         const namespace = await reloadJsImport(urlToFetch)
         if (urlHotMeta.acceptCallback) {
           await urlHotMeta.acceptCallback(namespace)
@@ -185,10 +192,9 @@ const applyHotReload = async ({ hotInstructions }) => {
 }
 
 window.__reloader__ = reloader
-window.__server_events__.addEventCallbacks({
-  reload: ({ data }) => {
-    const reloadMessage = JSON.parse(data)
-    reloader.addMessage(reloadMessage)
+window.__server_events__.listenEvents({
+  reload: (reloadServerEvent) => {
+    reloader.addMessage(reloadServerEvent.data)
   },
 })