work

Author: dmail

dist/build/build.js

@@ -149,6 +149,13 @@ const jsenvCoreDirectoryUrl = new URL("../", import.meta.url);
  * Only exact declared versions ("1.2.3") are compared: a range ("^1.2.3"), a
  * file/workspace protocol or a tag cannot be checked without resolving what npm
  * would pick, which is way beyond what is needed here.
+ *
+ * A status carries a severity so that every consumer (server log, browser
+ * overlay, reload on install) reads the same decision: a missing package or an
+ * outdated runtime dependency is a "warning", the page is not running what the
+ * project asks for. An outdated devDependency is only "info": the installed
+ * version runs, what may differ is tooling, and that is worth a line in the
+ * console, not a dialog nor a reload once installed.
  */
 
 
@@ -180,31 +187,40 @@ const readDependencyStatus = (
   if (!packageJSON) {
     return null;
   }
-  const declaredVersion = readDeclaredVersion(packageJSON, packageName);
-  if (!declaredVersion) {
+  const declaration = readDeclaration(packageJSON, packageName);
+  if (!declaration) {
     return null;
   }
   return createStatus(packageDirectory, {
     packageName,
-    declaredVersion,
+    declaredVersion: declaration.version,
+    declaredIn: declaration.field,
     declaringDirectoryUrl,
     declaredBy: packageJSON.name,
   });
 };
 
 const createStatus = (
   packageDirectory,
-  { packageName, declaredVersion, declaringDirectoryUrl, declaredBy },
+  {
+    packageName,
+    declaredVersion,
+    declaredIn,
+    declaringDirectoryUrl,
+    declaredBy,
+  },
 ) => {
   const status = {
     packageName,
     declaredVersion,
+    declaredIn,
     declaredBy,
     installedVersion: null,
     // the file telling this dependency apart; it is what an install rewrites and
     // what the dev server looks at to know the dependency became the declared one
     watchedPath: null,
     state: "missing",
+    severity: "warning",
   };
   const installedDirectoryUrl = findInstalledDirectoryUrl(
     declaringDirectoryUrl,
@@ -226,11 +242,16 @@ const createStatus = (
   status.installedVersion = installedPackageJSON
     ? installedPackageJSON.version
     : null;
-  status.state =
-    isExactVersion(declaredVersion) &&
-    status.installedVersion !== declaredVersion
-      ? "outdated"
-      : "installed";
+  if (
+    !isExactVersion(declaredVersion) ||
+    status.installedVersion === declaredVersion
+  ) {
+    status.state = "installed";
+    status.severity = null;
+    return status;
+  }
+  status.state = "outdated";
+  status.severity = declaredIn === "devDependencies" ? "info" : "warning";
   return status;
 };
 
@@ -258,11 +279,11 @@ const findInstalledDirectoryUrl = (declaringDirectoryUrl, packageName) => {
   return null;
 };
 
-const readDeclaredVersion = (packageJSON, packageName) => {
+const readDeclaration = (packageJSON, packageName) => {
   for (const field of DEPENDENCY_FIELDS) {
     const dependencies = packageJSON[field];
     if (dependencies && dependencies[packageName]) {
-      return dependencies[packageName];
+      return { field, version: dependencies[packageName] };
     }
   }
   return null;

dist/js/dependency_status.js

@@ -4,6 +4,11 @@
  * A missing dependency is not handled here: it makes the import fail, so the
  * error overlay already says it, with more precision (which import, where).
  *
+ * The overlay is for the problems the server marks as "warning" (see severity
+ * in package_dependencies.js). An outdated devDependency is "info": it goes to
+ * the console as a line, said once, followed by an other line when it gets
+ * installed; no overlay, and the server does not reload the page for it.
+ *
  * The overlay does not only describe the problem, it shows the dev server
  * watching for the fix: the paths being looked at are named and kept alive on
  * screen, so waiting for "npm install" feels like waiting for something that is
@@ -16,6 +21,9 @@ let watchInfoFromServer = {};
 // what leaves this map has been installed while the overlay was open, which is
 // worth showing as such
 const outdatedPathMap = new Map();
+// the console is append-only: a problem is said when it appears or changes,
+// and its resolution when it leaves the list
+const consoleLineMap = new Map();
 
 const initDependencyStatus = ({ problems, watchInfo }) => {
   watchInfoFromServer = watchInfo || {};
@@ -32,7 +40,10 @@ const initDependencyStatus = ({ problems, watchInfo }) => {
 };
 
 const render = (problems) => {
-  const outdatedList = problems.filter(({ state }) => state === "outdated");
+  logInfoProblems(problems.filter(({ severity }) => severity === "info"));
+  const outdatedList = problems.filter(
+    ({ state, severity }) => state === "outdated" && severity === "warning",
+  );
   removeOverlay();
   removeOverlay = () => {};
   const installedList = [];
@@ -67,6 +78,28 @@ const render = (problems) => {
   });
 };
 
+const logInfoProblems = (infoList) => {
+  for (const problem of infoList) {
+    const { packageName, declaredIn, declaredVersion, installedVersion } =
+      problem;
+    const line = `[jsenv] "${packageName}" is installed in ${
+      installedVersion || "an unknown version"
+    } but package.json declares ${declaredVersion} in ${declaredIn}, run npm install`;
+    if (consoleLineMap.get(packageName) === line) {
+      continue;
+    }
+    consoleLineMap.set(packageName, line);
+    console.info(line);
+  }
+  for (const packageName of consoleLineMap.keys()) {
+    if (infoList.some((problem) => problem.packageName === packageName)) {
+      continue;
+    }
+    consoleLineMap.delete(packageName);
+    console.info(`[jsenv] "${packageName}" is now installed`);
+  }
+};
+
 const describe = ({ packageName, declaredVersion, installedVersion }) => {
   return `${packageName}
   package.json declares  ${declaredVersion}

dist/start_dev_server/start_dev_server.js

@@ -62,6 +62,13 @@ const createEventEmitter = () => {
  * Only exact declared versions ("1.2.3") are compared: a range ("^1.2.3"), a
  * file/workspace protocol or a tag cannot be checked without resolving what npm
  * would pick, which is way beyond what is needed here.
+ *
+ * A status carries a severity so that every consumer (server log, browser
+ * overlay, reload on install) reads the same decision: a missing package or an
+ * outdated runtime dependency is a "warning", the page is not running what the
+ * project asks for. An outdated devDependency is only "info": the installed
+ * version runs, what may differ is tooling, and that is worth a line in the
+ * console, not a dialog nor a reload once installed.
  */
 
 
@@ -93,13 +100,14 @@ const readDependencyStatus = (
   if (!packageJSON) {
     return null;
   }
-  const declaredVersion = readDeclaredVersion(packageJSON, packageName);
-  if (!declaredVersion) {
+  const declaration = readDeclaration(packageJSON, packageName);
+  if (!declaration) {
     return null;
   }
   return createStatus(packageDirectory, {
     packageName,
-    declaredVersion,
+    declaredVersion: declaration.version,
+    declaredIn: declaration.field,
     declaringDirectoryUrl,
     declaredBy: packageJSON.name,
   });
@@ -126,6 +134,7 @@ const readDependencyStatuses = (packageDirectory) => {
         createStatus(packageDirectory, {
           packageName,
           declaredVersion: dependencies[packageName],
+          declaredIn: field,
           declaringDirectoryUrl: packageDirectory.url,
           declaredBy: packageJSON.name,
         }),
@@ -137,17 +146,25 @@ const readDependencyStatuses = (packageDirectory) => {
 
 const createStatus = (
   packageDirectory,
-  { packageName, declaredVersion, declaringDirectoryUrl, declaredBy },
+  {
+    packageName,
+    declaredVersion,
+    declaredIn,
+    declaringDirectoryUrl,
+    declaredBy,
+  },
 ) => {
   const status = {
     packageName,
     declaredVersion,
+    declaredIn,
     declaredBy,
     installedVersion: null,
     // the file telling this dependency apart; it is what an install rewrites and
     // what the dev server looks at to know the dependency became the declared one
     watchedPath: null,
     state: "missing",
+    severity: "warning",
   };
   const installedDirectoryUrl = findInstalledDirectoryUrl(
     declaringDirectoryUrl,
@@ -169,11 +186,16 @@ const createStatus = (
   status.installedVersion = installedPackageJSON
     ? installedPackageJSON.version
     : null;
-  status.state =
-    isExactVersion(declaredVersion) &&
-    status.installedVersion !== declaredVersion
-      ? "outdated"
-      : "installed";
+  if (
+    !isExactVersion(declaredVersion) ||
+    status.installedVersion === declaredVersion
+  ) {
+    status.state = "installed";
+    status.severity = null;
+    return status;
+  }
+  status.state = "outdated";
+  status.severity = declaredIn === "devDependencies" ? "info" : "warning";
   return status;
 };
 
@@ -201,11 +223,11 @@ const findInstalledDirectoryUrl = (declaringDirectoryUrl, packageName) => {
   return null;
 };
 
-const readDeclaredVersion = (packageJSON, packageName) => {
+const readDeclaration = (packageJSON, packageName) => {
   for (const field of DEPENDENCY_FIELDS) {
     const dependencies = packageJSON[field];
     if (dependencies && dependencies[packageName]) {
-      return dependencies[packageName];
+      return { field, version: dependencies[packageName] };
     }
   }
   return null;
@@ -12152,15 +12174,29 @@ const startDevServer = async ({
     onChange: (problems) => {
       dependencyProblemEventEmitter.emit(problems);
     },
-    onProblem: ({ packageName, declaredVersion, installedVersion, state }) => {
-      logger.warn(
+    onProblem: ({
+      packageName,
+      declaredVersion,
+      installedVersion,
+      declaredIn,
+      state,
+      severity,
+    }) => {
+      const message =
         state === "missing"
           ? `"${packageName}@${declaredVersion}" is declared in package.json but not installed, run npm install`
-          : `"${packageName}" is installed in ${installedVersion} but package.json declares ${declaredVersion}, run npm install`,
-      );
+          : `"${packageName}" is installed in ${installedVersion} but package.json declares ${declaredVersion} in ${declaredIn}, run npm install`;
+      if (severity === "warning") {
+        logger.warn(message);
+      } else {
+        logger.info(message);
+      }
     },
-    onInstalled: ({ packageName, declaredVersion }) => {
+    onInstalled: ({ packageName, declaredVersion, severity }) => {
       logger.info(`"${packageName}@${declaredVersion}" is now installed`);
+      if (severity !== "warning") {
+        return;
+      }
       reloadRequestEventEmitter.emit({
         cause: `${packageName}@${declaredVersion} installed`,
         reason: `a dependency became available in node_modules`,