@jsenv/core 27.4.0 → 27.5.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/core",
-  "version": "27.4.0",
+  "version": "27.5.2",
   "description": "Tool to develop, test and build js projects",
   "license": "MIT",
   "author": {
@@ -50,6 +50,7 @@
     "performances": "node --expose-gc ./scripts/performance/generate_performance_report.mjs --log --once",
     "file-size": "node ./scripts/file_size/file_size.mjs --log",
     "start_file_server": "node ./scripts/dev/start_file_server.mjs",
+    "generate-dev-errors-snapshot-files": "node --conditions=development ./tests/dev_server/errors/generate_snapshot_files.mjs",
     "prettier": "prettier --write .",
     "playwright-install": "npx playwright install-deps && npx playwright install",
     "certificate-install": "node ./scripts/dev/install_certificate_authority.mjs",
@@ -65,32 +66,33 @@
     "@c88/v8-coverage": "0.1.1",
     "@financial-times/polyfill-useragent-normaliser": "2.0.1",
     "@jsenv/abort": "4.2.3",
-    "@jsenv/ast": "1.1.2",
+    "@jsenv/ast": "1.1.3",
     "@jsenv/babel-plugins": "1.0.6",
     "@jsenv/filesystem": "4.1.1",
     "@jsenv/importmap": "1.2.1",
     "@jsenv/integrity": "0.0.1",
     "@jsenv/log": "3.1.0",
     "@jsenv/node-esm-resolution": "0.1.0",
-    "@jsenv/server": "12.8.0",
+    "@jsenv/server": "13.0.0",
     "@jsenv/sourcemap": "1.0.2",
     "@jsenv/uneval": "1.6.0",
     "@jsenv/url-meta": "7.0.0",
     "@jsenv/urls": "1.2.7",
     "@jsenv/utils": "2.0.1",
     "acorn-import-assertions": "1.8.0",
+    "construct-style-sheets-polyfill": "3.1.0",
     "cuid": "2.1.8",
     "html-minifier": "4.0.0",
     "istanbul-lib-coverage": "3.2.0",
     "istanbul-lib-instrument": "5.2.0",
     "istanbul-lib-report": "3.0.0",
-    "istanbul-reports": "3.1.4",
+    "istanbul-reports": "3.1.5",
     "launch-editor": "2.4.0",
     "pidtree": "0.6.0",
-    "rollup": "2.76.0",
+    "rollup": "2.77.0",
     "string-width": "5.1.2",
     "strip-ansi": "7.0.1",
-    "terser": "5.14.1",
+    "terser": "5.14.2",
     "v8-to-istanbul": "9.0.1",
     "wrap-ansi": "8.0.1"
   },
@@ -98,16 +100,16 @@
     "@babel/eslint-parser": "7.18.2",
     "@babel/plugin-syntax-import-assertions": "7.18.6",
     "@jsenv/assert": "2.6.0",
-    "@jsenv/eslint-config": "16.1.0",
+    "@jsenv/eslint-config": "16.2.1",
     "@jsenv/file-size-impact": "13.0.1",
     "@jsenv/https-local": "2.1.0",
     "@jsenv/package-workspace": "0.4.1",
     "@jsenv/performance-impact": "3.0.1",
-    "eslint": "8.19.0",
-    "eslint-plugin-html": "6.2.0",
+    "eslint": "8.20.0",
+    "eslint-plugin-html": "7.0.0",
     "eslint-plugin-import": "2.26.0",
     "eslint-plugin-react": "7.30.1",
-    "playwright": "1.23.2",
+    "playwright": "1.23.4",
     "prettier": "2.7.1"
   }
 }

package/{README.md → readme.md}

@@ -1,15 +1,12 @@
 # @jsenv/core [![npm package](https://img.shields.io/npm/v/@jsenv/core.svg?logo=npm&label=package)](https://www.npmjs.com/package/@jsenv/core)
 
-Jsenv was first created to write tests that could be executed in different runtimes. It has naturally evolved to cover the core needs of a JavaScript project.
+Jsenv was first created to write tests that could be executed in different runtimes.
+It has naturally evolved to cover the core needs of a JavaScript project: developement, testing and building for production. 
 
-- :exploding_head: Directly execute HTML files as tests
-- :relieved: Consistent and integral developer experience (dev + test + build)
-- :sparkles: Same dev experience for source and test files
+- :exploding_head: Execute HTML files as tests
+- :sparkles: A single tool for the whole developer experience
 - :ok_hand: Seamless integration with standard HTML, CSS and JS
 
-Jsenv is NOT a tool for fullstack projects where client and server code are in the same files.<br />
-Jsenv is designed for projects where client and server codebases are independent.
-
 # Demo
 
 The following command can be used to create a jsenv project on a machine.
@@ -18,14 +15,16 @@ The following command can be used to create a jsenv project on a machine.
 npm create jsenv@latest
 ```
 
-These demos are showing how jsenv can be integrated with preconfigured scripts such as:
+This command prompts to choose a demo from a list.
+Each demo contains preconfigured scripts such as:
 
 - `npm run dev`: starts a dev server with autoreload.
 - `npm run test`: execute test files on browsers(s) and/or Node.js.
 - `npm run build`: generate files optimized for production.
 
 > **Info**
-> Executing "npm install" in web demos can take time. It is because in these demos tests are runned in headless browsers that needs to be installed.
+> Executing "npm install" in web demos can take time.
+> It is because in these demos tests are runned in headless browsers that needs to be installed first.
 
 See also [packages/create-jsenv](./packages/create-jsenv).
 

package/src/build/build.js

@@ -102,7 +102,7 @@ export const build = async ({
   sourcemaps = false,
   sourcemapsSourcesContent,
   urlAnalysis = {},
-  nodeEsmResolution,
+  nodeEsmResolution = true,
   fileSystemMagicResolution,
   directoryReferenceAllowed,
   transpilation = {},
@@ -417,8 +417,6 @@ build ${entryPointKeys.length} entry points`)
     })
     const postBuildRedirections = {}
     const finalGraph = createUrlGraph()
-    const optimizeUrlContentHooks =
-      rawGraphKitchen.pluginController.addHook("optimizeUrlContent")
     const finalGraphKitchen = createKitchen({
       logger,
       rootDirectoryUrl,
@@ -694,19 +692,17 @@ build ${entryPointKeys.length} entry points`)
           name: "jsenv:optimize",
           appliesDuring: "build",
           finalizeUrlContent: async (urlInfo, context) => {
-            if (optimizeUrlContentHooks.length) {
-              await rawGraphKitchen.pluginController.callAsyncHooks(
-                "optimizeUrlContent",
-                urlInfo,
-                context,
-                async (optimizeReturnValue) => {
-                  await finalGraphKitchen.urlInfoTransformer.applyFinalTransformations(
-                    urlInfo,
-                    optimizeReturnValue,
-                  )
-                },
-              )
-            }
+            await rawGraphKitchen.pluginController.callAsyncHooks(
+              "optimizeUrlContent",
+              urlInfo,
+              context,
+              async (optimizeReturnValue) => {
+                await finalGraphKitchen.urlInfoTransformer.applyFinalTransformations(
+                  urlInfo,
+                  optimizeReturnValue,
+                )
+              },
+            )
           },
         },
       ],

package/src/build/start_build_server.js

@@ -17,12 +17,9 @@ import { parentPort } from "node:worker_threads"
 import {
   jsenvAccessControlAllowedHeaders,
   startServer,
-  pluginServerTiming,
-  pluginRequestWaitingCheck,
-  pluginCORS,
   fetchFileSystem,
-  composeServices,
-  findFreePort,
+  jsenvServiceCORS,
+  jsenvServiceErrorHandler,
 } from "@jsenv/server"
 import {
   assertAndNormalizeDirectoryUrl,
@@ -43,10 +40,10 @@ export const startBuildServer = async ({
   http2,
   certificate,
   privateKey,
-  listenAnyIp,
-  ip,
+  acceptAnyIp,
+  host,
   port = 9779,
-  services = {},
+  services = [],
   keepProcessAlive = true,
 
   rootDirectoryUrl,
@@ -94,9 +91,6 @@ export const startBuildServer = async ({
       )
     })
   }
-  if (port === 0) {
-    port = await findFreePort(port, { signal: operation.signal })
-  }
 
   let reloadableWorker
   if (buildServerAutoreload) {
@@ -137,12 +131,12 @@ export const startBuildServer = async ({
       const messagePromise = new Promise((resolve) => {
         worker.once("message", resolve)
       })
-      await messagePromise
+      const origin = await messagePromise
       // if (!keepProcessAlive) {
       //   worker.unref()
       // }
       return {
-        origin: `${protocol}://127.0.0.1:${port}`,
+        origin,
         stop: () => {
           stopWatchingBuildServerFiles()
           reloadableWorker.terminate()
@@ -168,30 +162,32 @@ export const startBuildServer = async ({
     http2,
     certificate,
     privateKey,
-    listenAnyIp,
-    ip,
+    acceptAnyIp,
+    host,
     port,
-    plugins: {
-      ...pluginCORS({
+    serverTiming: true,
+    requestWaitingMs: 60_000,
+    services: [
+      jsenvServiceCORS({
         accessControlAllowRequestOrigin: true,
         accessControlAllowRequestMethod: true,
         accessControlAllowRequestHeaders: true,
         accessControlAllowedRequestHeaders: jsenvAccessControlAllowedHeaders,
         accessControlAllowCredentials: true,
+        timingAllowOrigin: true,
       }),
-      ...pluginServerTiming(),
-      ...pluginRequestWaitingCheck({
-        requestWaitingMs: 60 * 1000,
-      }),
-    },
-    sendErrorDetails: true,
-    requestToResponse: composeServices({
       ...services,
-      build_files_service: createBuildFilesService({
-        buildDirectoryUrl,
-        buildIndexPath,
+      {
+        name: "jsenv:build_files_service",
+        handleRequest: createBuildFilesService({
+          buildDirectoryUrl,
+          buildIndexPath,
+        }),
+      },
+      jsenvServiceErrorHandler({
+        sendErrorDetails: true,
       }),
-    }),
+    ],
   })
   startBuildServerTask.done()
   logger.info(``)

package/src/dev/start_dev_server.js

@@ -1,5 +1,4 @@
 import { parentPort } from "node:worker_threads"
-import { findFreePort } from "@jsenv/server"
 import {
   assertAndNormalizeDirectoryUrl,
   registerDirectoryLifecycle,
@@ -9,29 +8,24 @@ import { createLogger, loggerToLevels, createTaskLog } from "@jsenv/log"
 import { getCallerPosition } from "@jsenv/urls"
 
 import { createReloadableWorker } from "@jsenv/core/src/helpers/worker_reload.js"
-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 { startOmegaServer } from "@jsenv/core/src/omega/omega_server.js"
 
-import { jsenvPluginExplorer } from "./plugins/explorer/jsenv_plugin_explorer.js"
-// import { jsenvPluginToolbar } from "./plugins/toolbar/jsenv_plugin_toolbar.js"
-
 export const startDevServer = async ({
   signal = new AbortController().signal,
   handleSIGINT = true,
   logLevel = "info",
   omegaServerLogLevel = "warn",
-  port = 3456,
   protocol = "http",
-  listenAnyIp,
   // it's better to use http1 by default because it allows to get statusText in devtools
   // which gives valuable information when there is errors
   http2 = false,
   certificate,
   privateKey,
+  host,
+  port = 3456,
+  acceptAnyIp,
   keepProcessAlive = true,
-  serverPlugins,
+  services,
 
   rootDirectoryUrl,
   clientFiles = {
@@ -47,7 +41,6 @@ export const startDevServer = async ({
   devServerMainFile = getCallerPosition().url,
   cooldownBetweenFileEvents,
 
-  sourcemaps = "inline",
   // 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
@@ -64,16 +57,19 @@ export const startDevServer = async ({
   nodeEsmResolution,
   fileSystemMagicResolution,
   transpilation,
-  explorerGroups = {
-    source: {
-      "./*.html": true,
-      "./src/**/*.html": true,
-    },
-    test: {
-      "./tests/**/*.test.html": true,
+  explorer = {
+    groups: {
+      src: {
+        "./src/**/*.html": true,
+      },
+      tests: {
+        "./tests/**/*.test.html": true,
+      },
     },
   },
   // toolbar = false,
+
+  sourcemaps = "inline",
   writeGeneratedFiles = true,
 }) => {
   const logger = createLogger({ logLevel })
@@ -90,9 +86,6 @@ export const startDevServer = async ({
       )
     })
   }
-  if (port === 0) {
-    port = await findFreePort(port, { signal: operation.signal })
-  }
 
   let reloadableWorker
   if (devServerAutoreload) {
@@ -134,12 +127,12 @@ export const startDevServer = async ({
       const messagePromise = new Promise((resolve) => {
         worker.once("message", resolve)
       })
-      await messagePromise
+      const origin = await messagePromise
       // if (!keepProcessAlive) {
       //   worker.unref()
       // }
       return {
-        origin: `${protocol}://127.0.0.1:${port}`,
+        origin,
         stop: () => {
           stopWatchingDevServerFiles()
           reloadableWorker.terminate()
@@ -152,82 +145,33 @@ export const startDevServer = async ({
     disabled: !loggerToLevels(logger).info,
   })
 
-  const clientFileChangeCallbackList = []
-  const clientFilesPruneCallbackList = []
-  const clientFileChangeCallback = ({ relativeUrl, event }) => {
-    const url = new URL(relativeUrl, rootDirectoryUrl).href
-    clientFileChangeCallbackList.forEach((callback) => {
-      callback({ url, event })
-    })
-  }
-  const stopWatchingClientFiles = registerDirectoryLifecycle(rootDirectoryUrl, {
-    watchPatterns: {
-      ...clientFiles,
-      ".jsenv/": false,
-    },
-    cooldownBetweenFileEvents,
-    keepProcessAlive: false,
-    recursive: true,
-    added: ({ relativeUrl }) => {
-      clientFileChangeCallback({ event: "added", relativeUrl })
-    },
-    updated: ({ relativeUrl }) => {
-      clientFileChangeCallback({ event: "modified", relativeUrl })
-    },
-    removed: ({ relativeUrl }) => {
-      clientFileChangeCallback({ event: "removed", relativeUrl })
-    },
-  })
-  const urlGraph = createUrlGraph({
-    clientFileChangeCallbackList,
-    clientFilesPruneCallbackList,
-  })
-  const kitchen = createKitchen({
-    signal,
-    logger,
-    rootDirectoryUrl,
-    urlGraph,
-    scenario: "dev",
-    runtimeCompat,
-    sourcemaps,
-    writeGeneratedFiles,
-    plugins: [
-      ...plugins,
-      ...getCorePlugins({
-        rootDirectoryUrl,
-        urlGraph,
-        scenario: "dev",
-        runtimeCompat,
-
-        urlAnalysis,
-        htmlSupervisor,
-        nodeEsmResolution,
-        fileSystemMagicResolution,
-        transpilation,
-        clientAutoreload,
-        clientFileChangeCallbackList,
-        clientFilesPruneCallbackList,
-      }),
-      jsenvPluginExplorer({
-        groups: explorerGroups,
-      }),
-      // ...(toolbar ? [jsenvPluginToolbar(toolbar)] : []),
-    ],
-  })
   const server = await startOmegaServer({
     logLevel: omegaServerLogLevel,
     keepProcessAlive,
-    listenAnyIp,
-    port,
+    acceptAnyIp,
     protocol,
     http2,
     certificate,
     privateKey,
+    host,
+    port,
+    services,
+
     rootDirectoryUrl,
-    urlGraph,
-    kitchen,
     scenario: "dev",
-    serverPlugins,
+    runtimeCompat,
+    plugins,
+    urlAnalysis,
+    htmlSupervisor,
+    nodeEsmResolution,
+    fileSystemMagicResolution,
+    transpilation,
+    clientFiles,
+    clientAutoreload,
+    cooldownBetweenFileEvents,
+    explorer,
+    sourcemaps,
+    writeGeneratedFiles,
   })
   startDevServerTask.done()
   logger.info(``)
@@ -235,18 +179,12 @@ export const startDevServer = async ({
     logger.info(`- ${server.origins[key]}`)
   })
   logger.info(``)
-  server.addEffect(() => {
-    return () => {
-      kitchen.pluginController.callHooks("destroy", {})
-    }
-  })
   if (reloadableWorker && reloadableWorker.isWorker) {
     parentPort.postMessage(server.origin)
   }
   return {
     origin: server.origin,
     stop: () => {
-      stopWatchingClientFiles()
       server.stop()
     },
   }

package/src/execute/execute.js

@@ -2,11 +2,8 @@ import { Abort, raceProcessTeardownEvents } from "@jsenv/abort"
 
 import { assertAndNormalizeDirectoryUrl } from "@jsenv/filesystem"
 import { createLogger } from "@jsenv/log"
-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 { startOmegaServer } from "@jsenv/core/src/omega/omega_server.js"
 
+import { startOmegaServer } from "@jsenv/core/src/omega/omega_server.js"
 import { run } from "./run.js"
 
 export const execute = async ({
@@ -19,6 +16,7 @@ export const execute = async ({
   allocatedMs,
   mirrorConsole = true,
   keepRunning = false,
+  services,
   collectConsole,
   collectCoverage,
   coverageTempDirectoryUrl,
@@ -27,12 +25,12 @@ export const execute = async ({
   runtimeParams,
 
   scenario = "dev",
-  sourcemaps = "inline",
   plugins = [],
   nodeEsmResolution,
   fileSystemMagicResolution,
   transpilation,
   htmlSupervisor = true,
+  sourcemaps = "inline",
   writeGeneratedFiles = false,
 
   port,
@@ -65,45 +63,29 @@ export const execute = async ({
     ...runtimeParams,
   }
   if (runtime.needsServer) {
-    const urlGraph = createUrlGraph()
-    const runtimeCompat = { [runtime.name]: runtime.version }
-    const kitchen = createKitchen({
-      signal,
-      logger,
-      rootDirectoryUrl,
-      urlGraph,
-      scenario,
-      sourcemaps,
-      runtimeCompat,
-      writeGeneratedFiles,
-      plugins: [
-        ...plugins,
-        ...getCorePlugins({
-          rootDirectoryUrl,
-          urlGraph,
-          scenario,
-          runtimeCompat,
-
-          htmlSupervisor,
-          nodeEsmResolution,
-          fileSystemMagicResolution,
-          transpilation,
-        }),
-      ],
-    })
     const server = await startOmegaServer({
       signal: executeOperation.signal,
       logLevel: "warn",
-      rootDirectoryUrl,
-      urlGraph,
-      kitchen,
-      scenario,
       keepProcessAlive: false,
+      services,
       port,
       protocol,
       http2,
       certificate,
       privateKey,
+
+      rootDirectoryUrl,
+      scenario,
+      runtimeCompat: { [runtime.name]: runtime.version },
+
+      plugins,
+
+      htmlSupervisor,
+      nodeEsmResolution,
+      fileSystemMagicResolution,
+      transpilation,
+      sourcemaps,
+      writeGeneratedFiles,
     })
     executeOperation.addEndCallback(async () => {
       await server.stop("execution done")

package/src/omega/errors.js

@@ -59,10 +59,11 @@ export const createFetchUrlContentError = ({
     fetchError.name = "FETCH_URL_CONTENT_ERROR"
     fetchError.code = code
     fetchError.reason = reason
-    fetchError.url = reference.trace.url
-    fetchError.line = reference.trace.line
-    fetchError.column = reference.trace.column
-    fetchError.contentFrame = reference.trace.message
+    fetchError.url = urlInfo.url
+    fetchError.traceUrl = reference.trace.url
+    fetchError.traceLine = reference.trace.line
+    fetchError.traceColumn = reference.trace.column
+    fetchError.traceMessage = reference.trace.message
     return fetchError
   }
 
@@ -116,29 +117,30 @@ export const createTransformUrlContentError = ({
     transformError.name = "TRANSFORM_URL_CONTENT_ERROR"
     transformError.code = code
     transformError.reason = reason
-    transformError.url = reference.trace.url
-    transformError.line = reference.trace.line
-    transformError.column = reference.trace.column
     transformError.stack = error.stack
-    transformError.contentFrame = reference.trace.message
+    transformError.url = urlInfo.url
+    transformError.traceUrl = reference.trace.url
+    transformError.traceLine = reference.trace.line
+    transformError.traceColumn = reference.trace.column
+    transformError.traceMessage = reference.trace.message
     if (code === "PARSE_ERROR") {
       transformError.reason = error.message
       if (urlInfo.isInline) {
-        transformError.line = reference.trace.line + error.line - 1
-        transformError.column = reference.trace.column + error.column
-        transformError.contentFrame = stringifyUrlSite({
+        transformError.traceLine = reference.trace.line + error.line - 1
+        transformError.traceColumn = reference.trace.column + error.column
+        transformError.traceMessage = stringifyUrlSite({
           url: urlInfo.inlineUrlSite.url,
-          line: transformError.line,
-          column: transformError.column,
+          line: transformError.traceLine,
+          column: transformError.traceColumn,
           content: urlInfo.inlineUrlSite.content,
         })
       } else {
-        transformError.line = error.line
-        transformError.column = error.column
-        transformError.contentFrame = stringifyUrlSite({
+        transformError.traceLine = error.line
+        transformError.traceColumn = error.column
+        transformError.traceMessage = stringifyUrlSite({
           url: urlInfo.url,
-          line: transformError.line,
-          column: transformError.column,
+          line: error.line - 1,
+          column: error.column,
           content: urlInfo.content,
         })
       }

package/src/omega/kitchen.js

@@ -7,7 +7,7 @@ import {
   setUrlFilename,
 } from "@jsenv/urls"
 import { writeFileSync, ensureWindowsDriveLetter } from "@jsenv/filesystem"
-import { createDetailedMessage } from "@jsenv/log"
+import { createLogger, createDetailedMessage } from "@jsenv/log"
 import { CONTENT_TYPE } from "@jsenv/utils/src/content_type/content_type.js"
 
 import { createPluginController } from "../plugins/plugin_controller.js"
@@ -25,12 +25,13 @@ import { isWebWorkerEntryPointReference } from "./web_workers.js"
 
 export const createKitchen = ({
   signal,
-  logger,
+  logLevel,
+
   rootDirectoryUrl,
+  scenario,
+  runtimeCompat,
   urlGraph,
-
   plugins,
-  scenario,
   sourcemaps = {
     dev: "inline", // "programmatic" and "file" also allowed
     test: "inline",
@@ -44,9 +45,9 @@ export const createKitchen = ({
     build: true,
   }[scenario],
   sourcemapsRelativeSources,
-  runtimeCompat,
   writeGeneratedFiles,
 }) => {
+  const logger = createLogger({ logLevel })
   const pluginController = createPluginController({
     plugins,
     scenario,
@@ -56,13 +57,13 @@ export const createKitchen = ({
     signal,
     logger,
     rootDirectoryUrl,
-    sourcemaps,
     urlGraph,
     scenario,
     runtimeCompat,
     isSupportedOnFutureClients: (feature) => {
       return RUNTIME_COMPAT.isSupported(runtimeCompat, feature)
     },
+    sourcemaps,
   }
   pluginController.callHooks("init", kitchenContext)
   const createReference = ({