@jsenv/snapshot 2.6.10 → 2.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jsenv/snapshot",
-  "version": "2.6.10",
+  "version": "2.7.0",
   "description": "Snapshot testing",
   "license": "MIT",
   "author": {

package/src/replace_fluctuating_values.js

@@ -21,7 +21,7 @@ export const replaceFluctuatingValues = (
     stringType,
     rootDirectoryUrl,
     fileUrl,
-    removeAnsi = true,
+    preserveAnsi,
     // for unit test
     replaceFilesystemWellKnownValues = createReplaceFilesystemWellKnownValues({
       rootDirectoryUrl,
@@ -51,7 +51,7 @@ export const replaceFluctuatingValues = (
     if (stringType === "filesystem") {
       return replaceFilesystemWellKnownValues(value);
     }
-    if (removeAnsi) {
+    if (!preserveAnsi) {
       value = stripAnsi(value);
     }
     value = replaceFilesystemWellKnownValues(value, {

package/src/side_effects/filesystem/filesystem_side_effects.js

@@ -55,19 +55,19 @@ export const filesystemSideEffects = (
         }
         return url;
       };
-      const getUrlInsideOutDirectory = (url, outDirectoryUrl) => {
+      const getUrlInsideOutDirectory = (url, generateOutFileUrl) => {
         if (baseDirectory) {
           if (
             url.href === baseDirectory.href ||
             urlIsInsideOf(url, baseDirectory)
           ) {
             const outRelativeUrl = urlToRelativeUrl(url, baseDirectory);
-            return new URL(outRelativeUrl, outDirectoryUrl);
+            return generateOutFileUrl(outRelativeUrl);
           }
         }
         // otherwise we replace the url with well known
         const toRelativeUrl = replaceFilesystemWellKnownValues(url);
-        return new URL(toRelativeUrl, outDirectoryUrl);
+        return generateOutFileUrl(toRelativeUrl);
       };
 
       addSkippableHandler((sideEffect) => {
@@ -189,7 +189,7 @@ ${renderFileContent(
                   if (allFilesInsideOutDirectory) {
                     const commonDirectoryOutUrl = getUrlInsideOutDirectory(
                       commonDirectoryUrl,
-                      options.outDirectoryUrl,
+                      options.generateOutFileUrl,
                     );
                     const commonDirectoryOutRelativeUrl = urlToRelativeUrl(
                       commonDirectoryOutUrl,
@@ -240,15 +240,15 @@ ${renderFileContent(
                 outDirectoryReason,
               },
               render: {
-                md: ({ sideEffectFileUrl, outDirectoryUrl }) => {
+                md: ({ sideEffectFileUrl, generateOutFileUrl }) => {
                   const urlRelativeToBase = getUrlRelativeToBase(url);
                   if (outDirectoryReason) {
-                    const urlInsideOutDirectory = getUrlInsideOutDirectory(
+                    let urlInsideOutDirectory = getUrlInsideOutDirectory(
                       url,
-                      outDirectoryUrl,
+                      generateOutFileUrl,
                     );
                     if (writeFileSideEffect.counter) {
-                      setUrlBasename(
+                      urlInsideOutDirectory = setUrlBasename(
                         urlInsideOutDirectory,
                         (basename) =>
                           `${basename}_${writeFileSideEffect.counter}`,

package/src/side_effects/filesystem/spy_filesystem_calls.js

@@ -37,6 +37,10 @@ export const spyFilesystemCalls = (
   const fileDescriptorPathMap = new Map();
   const fileRestoreMap = new Map();
   const onWriteFileDone = (fileUrl, stateBefore, stateAfter) => {
+    if (!stateAfter.found) {
+      // not suppoed to happen but could apparently
+      return;
+    }
     // we use same type because we don't want to differentiate between
     // - writing file for the 1st time
     // - updating file content

package/src/side_effects/render_side_effects.js

@@ -1,7 +1,7 @@
 import { createException } from "@jsenv/exception";
 import { writeFileSync } from "@jsenv/filesystem";
 import { renderTerminalSvg } from "@jsenv/terminal-recorder";
-import { urlToBasename, urlToExtension, urlToRelativeUrl } from "@jsenv/urls";
+import { urlToExtension, urlToRelativeUrl } from "@jsenv/urls";
 import ansiRegex from "ansi-regex";
 import { replaceFluctuatingValues } from "../replace_fluctuating_values.js";
 
@@ -39,6 +39,7 @@ export const renderSideEffects = (
   {
     sideEffectFileUrl,
     outDirectoryUrl,
+    generateOutFileUrl,
     generatedBy = true,
     titleLevel = 1,
     getBigSizeEffect = createBigSizeEffect({
@@ -86,6 +87,7 @@ export const renderSideEffects = (
     markdown += renderOneSideEffect(sideEffect, {
       sideEffectFileUrl,
       outDirectoryUrl,
+      generateOutFileUrl,
       rootDirectoryUrl,
       titleLevel,
       getBigSizeEffect,
@@ -133,6 +135,7 @@ const renderOneSideEffect = (
   {
     sideEffectFileUrl,
     outDirectoryUrl,
+    generateOutFileUrl,
     rootDirectoryUrl,
     titleLevel,
     getBigSizeEffect,
@@ -151,6 +154,7 @@ const renderOneSideEffect = (
   let { label, text } = md({
     sideEffectFileUrl,
     outDirectoryUrl,
+    generateOutFileUrl,
     replace,
     rootDirectoryUrl,
     lastSideEffectNumber,
@@ -159,7 +163,7 @@ const renderOneSideEffect = (
     text = renderText(text, {
       sideEffect,
       sideEffectFileUrl,
-      outDirectoryUrl,
+      generateOutFileUrl,
       replace,
       rootDirectoryUrl,
       errorStackHidden,
@@ -200,7 +204,7 @@ const renderText = (
   {
     sideEffect,
     sideEffectFileUrl,
-    outDirectoryUrl,
+    generateOutFileUrl,
     replace,
     rootDirectoryUrl,
     errorStackHidden,
@@ -242,25 +246,25 @@ const renderText = (
           typeof value.stack === "string")
       ) {
         onRenderError();
+        // return renderMarkdownBlock(text.value.stack);
         const exception = createException(text.value, { rootDirectoryUrl });
         const exceptionText = errorStackHidden
           ? `${exception.name}: ${exception.message}`
           : exception.stack || exception.message || exception;
-        const potentialAnsi = renderPotentialAnsi(exceptionText, {
+        return renderPotentialAnsi(exceptionText, {
+          stringType: "error",
           sideEffect,
           sideEffectFileUrl,
-          outDirectoryUrl,
+          generateOutFileUrl,
           replace,
         });
-        if (potentialAnsi) {
-          return potentialAnsi;
-        }
-        return renderMarkdownBlock(
-          replace(exceptionText, { stringType: "error" }),
-        );
       }
+
       return renderMarkdownBlock(
-        replace(JSON.stringify(value, null, "  "), { stringType: "json" }),
+        replace(
+          typeof value === "string" ? value : JSON.stringify(value, null, "  "),
+          { stringType: "json" },
+        ),
         "js",
       );
     }
@@ -268,7 +272,7 @@ const renderText = (
       return renderConsole(text.value, {
         sideEffect,
         sideEffectFileUrl,
-        outDirectoryUrl,
+        generateOutFileUrl,
         replace,
       });
     }
@@ -288,47 +292,51 @@ const renderText = (
 
 export const renderConsole = (
   string,
-  { sideEffect, sideEffectFileUrl, outDirectoryUrl, replace },
+  { sideEffect, sideEffectFileUrl, generateOutFileUrl, replace },
 ) => {
-  const potentialAnsi = renderPotentialAnsi(string, {
+  return renderPotentialAnsi(string, {
+    stringType: "console",
     sideEffect,
     sideEffectFileUrl,
-    outDirectoryUrl,
+    generateOutFileUrl,
     replace,
   });
-  if (potentialAnsi) {
-    return potentialAnsi;
-  }
-  return renderMarkdownBlock(
-    replace(string, { stringType: "console" }),
-    "console",
-  );
 };
 
 const renderPotentialAnsi = (
   string,
-  { sideEffect, sideEffectFileUrl, outDirectoryUrl, replace },
+  { stringType, sideEffect, sideEffectFileUrl, generateOutFileUrl, replace },
 ) => {
-  if (!ansiRegex().test(string)) {
-    return null;
-  }
-  let svgFilename = urlToBasename(outDirectoryUrl);
-  svgFilename += `_${sideEffect.code}`;
-  if (sideEffect.counter) {
-    svgFilename += `_${sideEffect.counter}`;
+  const rawTextBlock = renderMarkdownBlock(
+    replace(string, { stringType }),
+    "console",
+  );
+  // for assert we want ideally hummm
+  // colored in details block?
+  const includesAnsi = ansiRegex().test(string);
+  if (!includesAnsi) {
+    return rawTextBlock;
   }
-  svgFilename += ".svg";
-  const svgFileUrl = new URL(`./${svgFilename}`, outDirectoryUrl);
-  let svgFileContent = renderTerminalSvg(string, {
-    head: false,
-    paddingTop: 10,
-    paddingBottom: 10,
-  });
+  const svgFilename = `${sideEffect.code}${sideEffect.counter ? `_${sideEffect.counter}` : ""}.svg`;
+  const svgFileUrl = generateOutFileUrl(svgFilename);
+  let svgFileContent = renderTerminalSvg(
+    replace(string, { stringType: "console", preserveAnsi: true }),
+    {
+      head: false,
+      paddingTop: 10,
+      paddingBottom: 10,
+    },
+  );
   svgFileContent = replace(svgFileContent, { fileUrl: svgFileUrl });
   writeFileSync(svgFileUrl, svgFileContent);
   const svgFileRelativeUrl = urlToRelativeUrl(svgFileUrl, sideEffectFileUrl);
-  return `![img](${svgFileRelativeUrl})`;
-  // we will write a svg file
+  let md = `![img](${svgFileRelativeUrl})`;
+  md += "\n\n";
+  md += renderMarkdownDetails(`${rawTextBlock}`, {
+    summary: "see without style",
+  });
+  md += "\n";
+  return md;
 };
 
 export const renderFileContent = (text, { sideEffect, replace }) => {

package/src/side_effects/snapshot_side_effects.js

@@ -11,16 +11,19 @@ export const snapshotSideEffects = (
   fn,
   {
     sideEffectFileUrl,
-    sideEffectFilePattern = "./output/<basename>.md",
+    sideEffectFilePattern = "./output/[basename].md",
+    outDirectoryPattern = "./output/[basename]/",
+    outFilePattern = "./output/[basename]/[filename]",
+    generateOutFileUrl,
     outDirectoryUrl,
     errorStackHidden,
     ...captureOptions
   } = {},
 ) => {
+  const basename = urlToBasename(sourceFileUrl, true);
   if (sideEffectFileUrl === undefined) {
-    const basename = urlToBasename(sourceFileUrl, true);
     const sideEffectFileRelativeUrl = sideEffectFilePattern.replaceAll(
-      "<basename>",
+      "[basename]",
       basename,
     );
     sideEffectFileUrl = new URL(sideEffectFileRelativeUrl, sourceFileUrl);
@@ -30,17 +33,30 @@ export const snapshotSideEffects = (
 
   const captureSideEffects = createCaptureSideEffects(captureOptions);
   if (outDirectoryUrl === undefined) {
-    outDirectoryUrl = new URL(
-      `./${urlToBasename(sideEffectFileUrl)}/`,
-      sideEffectFileUrl,
+    const outDirectoryRelativeUrl = outDirectoryPattern.replaceAll(
+      "[basename]",
+      basename,
     );
+    outDirectoryUrl = new URL(outDirectoryRelativeUrl, sideEffectFileUrl);
   }
+  if (generateOutFileUrl === undefined) {
+    generateOutFileUrl = (filename) => {
+      const outRelativeUrl = outFilePattern
+        .replaceAll("[basename]", basename)
+        .replaceAll("[filename]", filename);
+      const outFileUrl = new URL(outRelativeUrl, new URL("./", sourceFileUrl))
+        .href;
+      return outFileUrl;
+    };
+  }
+
   const sideEffectFileSnapshot = takeFileSnapshot(sideEffectFileUrl);
   const outDirectorySnapshot = takeDirectorySnapshot(outDirectoryUrl);
   const onSideEffects = (sideEffects) => {
     const sideEffectFileContent = renderSideEffects(sideEffects, {
       sideEffectFileUrl,
       outDirectoryUrl,
+      generateOutFileUrl,
       errorStackHidden,
     });
     sideEffectFileSnapshot.update(sideEffectFileContent, {

package/src/side_effects/snapshot_tests.js

@@ -9,7 +9,7 @@ import { renderSideEffects, renderSmallLink } from "./render_side_effects.js";
 
 /**
  * Generate a markdown file describing all test side effects. When executed in CI throw if there is a diff.
- * @param {URL} sourceFileUrl
+ * @param {URL} testFileUrl
  * @param {Function} fnRegisteringTest
  * @param {Object} snapshotTestsOptions
  * @param {string|url} snapshotTestsOptions.sideEffectFileUrl
@@ -17,11 +17,14 @@ import { renderSideEffects, renderSmallLink } from "./render_side_effects.js";
  * @return {Array.<Object>} sideEffects
  */
 export const snapshotTests = async (
-  sourceFileUrl,
+  testFileUrl,
   fnRegisteringTest,
   {
+    testName = urlToBasename(testFileUrl, true),
     sideEffectFileUrl,
-    sideEffectFilePattern = "./<basename>/<basename>.md",
+    sideEffectFilePattern = "./output/[test_name].md",
+    outDirectoryPattern = "./output/[test_name]/",
+    outFilePattern = "./output/[test_scenario]/[filename]",
     rootDirectoryUrl,
     generatedBy = true,
     linkToSource = true,
@@ -33,14 +36,13 @@ export const snapshotTests = async (
   } = {},
 ) => {
   if (sideEffectFileUrl === undefined) {
-    const basename = urlToBasename(sourceFileUrl, true);
     const sideEffectFileRelativeUrl = sideEffectFilePattern.replaceAll(
-      "<basename>",
-      basename,
+      "[test_name]",
+      testName,
     );
-    sideEffectFileUrl = new URL(sideEffectFileRelativeUrl, sourceFileUrl);
+    sideEffectFileUrl = new URL(sideEffectFileRelativeUrl, testFileUrl);
   } else {
-    sideEffectFileUrl = new URL(sideEffectFileUrl, sourceFileUrl);
+    sideEffectFileUrl = new URL(sideEffectFileUrl, testFileUrl);
   }
 
   const testMap = new Map();
@@ -70,8 +72,8 @@ export const snapshotTests = async (
       {
         prefix: "Generated by ",
         suffix:
-          linkToSource && sourceFileUrl
-            ? generateExecutingLink(sourceFileUrl, sideEffectFileUrl)
+          linkToSource && testFileUrl
+            ? generateExecutingLink(testFileUrl, sideEffectFileUrl)
             : "",
       },
     );
@@ -87,19 +89,29 @@ export const snapshotTests = async (
       callSite: linkToEachSource ? callSite : undefined,
       baseDirectory: String(new URL("./", callSite.url)),
     });
-    const outDirectoryUrl = new URL(
-      `./${asValidFilename(scenario)}/`,
-      sideEffectFileUrl,
-    );
+    const testScenario = asValidFilename(scenario);
+    let outDirectoryRelativeUrl = outDirectoryPattern
+      .replaceAll("[test_name]", testName)
+      .replaceAll("[test_scenario]", testScenario);
+    const outDirectoryUrl = new URL(outDirectoryRelativeUrl, testFileUrl);
     const outDirectorySnapshot = takeDirectorySnapshot(outDirectoryUrl, {
       pattern: {
         "**/*": true,
         "**/*.svg": "presence_only",
       },
     });
+    const generateOutFileUrl = (filename) => {
+      const outFileRelativeUrl = outFilePattern
+        .replaceAll("[test_name]", testName)
+        .replaceAll("[test_scenario]", testScenario)
+        .replaceAll("[filename]", filename);
+      const outFileUrl = new URL(outFileRelativeUrl, testFileUrl).href;
+      return outFileUrl;
+    };
     const sideEffectsMarkdown = renderSideEffects(sideEffects, {
       sideEffectFileUrl,
       outDirectoryUrl,
+      generateOutFileUrl,
       generatedBy: false,
       titleLevel: 3,
       errorStackHidden,