@alloy-js/core 0.18.0-dev.5 → 0.18.1

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # Changelog - @alloy-js/core
 
+## 0.18.1
+
+### Bug Fixes
+
+- [#232](https://github.com/alloy-framework/alloy/pull/232) Improve `toRenderTo` test matcher to work better with SourceFiles
+
+
+## 0.18.0
+
+### Bug Fixes
+
+- [#182](https://github.com/alloy-framework/alloy/pull/182) Added a `@alloy-js/core/testing/matchers` export to be added to `tsconfig.json` `types` in order to load the custom vitest matchers
+
+### Features
+
+- [#198](https://github.com/alloy-framework/alloy/pull/198) Add `inline` option for `<Block>` component to define inline blocks
+
+
 ## 0.17.0
 
 ### Features

package/dist/src/debug.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"debug.d.ts","sourceRoot":"","sources":["../../src/debug.ts"],"names":[],"mappings":"AAMA,UAAU,cAAc;IACtB,SAAS,EAAE;QACT,KAAK,IAAI,IAAI,CAAC;QACd,IAAI,IAAI,IAAI,CAAC;QACb,KAAK,IAAI,IAAI,CAAC;QACd,MAAM,IAAI,IAAI,CAAC;QACf,OAAO,IAAI,IAAI,CAAC;KACjB,CAAC;CACH;AAoGD,OAAO,CAAC,MAAM,CAAC;IAEb,IAAI,KAAK,EAAE,cAAc,CAAC;CAC3B;AA4FD,wBAAgB,WAAW,YAE1B"}
+{"version":3,"file":"debug.d.ts","sourceRoot":"","sources":["../../src/debug.ts"],"names":[],"mappings":"AAOA,UAAU,cAAc;IACtB,SAAS,EAAE;QACT,KAAK,IAAI,IAAI,CAAC;QACd,IAAI,IAAI,IAAI,CAAC;QACb,KAAK,IAAI,IAAI,CAAC;QACd,MAAM,IAAI,IAAI,CAAC;QACf,OAAO,IAAI,IAAI,CAAC;KACjB,CAAC;CACH;AAoGD,OAAO,CAAC,MAAM,CAAC;IAEb,IAAI,KAAK,EAAE,cAAc,CAAC;CAC3B;AA4FD,wBAAgB,WAAW,YAE1B"}

package/dist/src/debug.js

@@ -1,3 +1,4 @@
+/* eslint-disable no-console */
 import { isReactive } from "@vue/reactivity";
 import Table from "cli-table3";
 import pc from "picocolors";

package/dist/src/write-output.browser.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"write-output.browser.d.ts","sourceRoot":"","sources":["../../src/write-output.browser.ts"],"names":[],"mappings":"AAAA,wBAAgB,WAAW,CAAC,MAAM,EAAE,GAAG,EAAE,QAAQ,GAAE,MAAW,QAE7D"}
+{"version":3,"file":"write-output.browser.d.ts","sourceRoot":"","sources":["../../src/write-output.browser.ts"],"names":[],"mappings":"AAAA,wBAAgB,WAAW,CAAC,MAAM,EAAE,GAAG,EAAE,QAAQ,GAAE,MAAW,QAG7D"}

package/dist/src/write-output.browser.js

@@ -1,3 +1,4 @@
 export function writeOutput(output, basePath = "") {
+  // eslint-disable-next-line no-console
   console.warn("writeOutput is not supported in a browser environment.");
 }

package/dist/test/browser-build.test.js

@@ -63,7 +63,7 @@ describe("Browser Build Test", () => {
         build: "vite build"
       }
     }, null, 2));
-  });
+  }, 30_000);
   it("Vite should build successfully", () => {
     // Run Vite build process and wait for completion
     expect(() => {

package/dist/test/components/slot.test.js

@@ -23,7 +23,7 @@ it("works with string keys", () => {
   }), props => {
     return ["// original", _$memo(() => props.original)];
   });
-  const tree = render(_$createComponent(Output, {
+  const _tree = render(_$createComponent(Output, {
     get children() {
       return _$createComponent(SourceFile, {
         path: "test.ts",
@@ -36,7 +36,8 @@ it("works with string keys", () => {
       });
     }
   }));
-  console.log(tree.contents[0].contents);
+
+  // console.log(tree.contents[0].contents);
 });
 it("works with symbols", () => {
   const FunctionSlot = defineSlot(query => {
@@ -44,7 +45,6 @@ it("works with symbols", () => {
     return binder.resolveFQN(query.fqn);
   });
   function MyFunctionComponent(props) {
-    const binder = useBinder();
     const sym = new OutputSymbol(props.name, {
       refkeys: refkey()
     });
@@ -66,7 +66,7 @@ it("works with symbols", () => {
   }), props => {
     return ["// original", _$memo(() => props.original)];
   });
-  const tree = render(_$createComponent(Output, {
+  const _tree = render(_$createComponent(Output, {
     get children() {
       return _$createComponent(SourceFile, {
         path: "test.ts",
@@ -84,7 +84,8 @@ it("works with symbols", () => {
       });
     }
   }));
-  console.log(tree.contents[0].contents);
+
+  // console.log(tree.contents[0].contents);
 });
 it("can rename", () => {
   const FunctionSlot = defineSlot(query => {
@@ -110,7 +111,7 @@ it("can rename", () => {
     const binder = useBinder();
     return binder.resolveFQN("foo.bar");
   }, "bazxxx");
-  const tree = render(_$createComponent(Output, {
+  const _tree = render(_$createComponent(Output, {
     get children() {
       return _$createComponent(SourceFile, {
         path: "test.ts",
@@ -128,5 +129,6 @@ it("can rename", () => {
       });
     }
   }));
-  console.log(tree.contents[0].contents);
+
+  // console.log(tree.contents[0].contents);
 });

package/dist/testing/extend-expect.d.ts

@@ -1,17 +1,3 @@
 import "vitest";
-interface ToRenderToRenderOptions {
-    printWidth?: number;
-    tabWidth?: number;
-    useTabs?: boolean;
-}
-interface CustomMatchers<R = unknown> {
-    toRenderTo: (str: string, options?: ToRenderToRenderOptions) => R;
-}
-declare module "vitest" {
-    interface Assertion<T = any> extends CustomMatchers<T> {
-    }
-    interface AsymmetricMatchersContaining extends CustomMatchers {
-    }
-}
-export {};
+import "./vitest.d.ts";
 //# sourceMappingURL=extend-expect.d.ts.map

package/dist/testing/extend-expect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"extend-expect.d.ts","sourceRoot":"","sources":["../../testing/extend-expect.ts"],"names":[],"mappings":"AA+BA,OAAO,QAAQ,CAAC;AAEhB,UAAU,uBAAuB;IAC/B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AACD,UAAU,cAAc,CAAC,CAAC,GAAG,OAAO;IAClC,UAAU,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,uBAAuB,KAAK,CAAC,CAAC;CACnE;AAED,OAAO,QAAQ,QAAQ,CAAC;IACtB,UAAU,SAAS,CAAC,CAAC,GAAG,GAAG,CAAE,SAAQ,cAAc,CAAC,CAAC,CAAC;KAAG;IACzD,UAAU,4BAA6B,SAAQ,cAAc;KAAG;CACjE"}
+{"version":3,"file":"extend-expect.d.ts","sourceRoot":"","sources":["../../testing/extend-expect.ts"],"names":[],"mappings":"AAOA,OAAO,QAAQ,CAAC;AAGhB,OAAO,eAAe,CAAC"}

package/dist/testing/extend-expect.js

@@ -1,22 +1,94 @@
-import { printTree, renderTree } from "@alloy-js/core";
+import { getContextForRenderNode, printTree, renderTree } from "@alloy-js/core";
+import "vitest";
 import { expect } from "vitest";
 import { dedent } from "./render.js";
+import "./vitest.d.ts";
 expect.extend({
   toRenderTo(received, expectedRaw, renderOptions) {
+    const message = () => `Render is${isNot ? " not" : ""} incorrect`;
     const {
       isNot
     } = this;
-    const tree = renderTree(received);
-    const actual = printTree(tree, renderOptions);
-    const expected = dedent(expectedRaw);
-    return {
-      pass: actual === expected,
-      message: () => {
-        return `Render is${isNot ? " not" : ""} incorrect`;
-      },
-      actual,
-      expected
-    };
+    const actual = renderAsFiles(received, renderOptions);
+    if (typeof expectedRaw === "string") {
+      const expected = dedent(expectedRaw);
+      let actualStr;
+      if (typeof actual === "string") {
+        actualStr = actual;
+      } else if (Object.keys(actual).length === 1) {
+        // If we have a single file, we can use its content directly.
+        actualStr = Object.values(actual)[0];
+      } else {
+        return {
+          pass: false,
+          message,
+          actual,
+          expected
+        };
+      }
+      return {
+        pass: actualStr === expected,
+        message,
+        actual: actualStr,
+        expected
+      };
+    } else if (typeof actual === "object" && typeof expectedRaw === "object") {
+      const expected = expectedRaw;
+      const dedentExpected = {};
+      for (const [key, value] of Object.entries(expected)) {
+        dedentExpected[key] = dedent(value);
+      }
+      const pass = Object.keys(actual).length === Object.keys(expected).length && Object.entries(actual).every(([key, value]) => {
+        return dedentExpected[key] === value;
+      });
+      return {
+        pass,
+        message,
+        actual,
+        expected: dedentExpected
+      };
+    } else {
+      return {
+        pass: false,
+        message,
+        actual,
+        expected: expectedRaw
+      };
+    }
   }
 });
-import "vitest";
+function renderAsFiles(received, options) {
+  const files = {};
+  const tree = renderTree(received);
+
+  // when passing Output, the first render tree child is the Output component.
+  const rootRenderOptions = Array.isArray(tree) ? getContextForRenderNode(tree[0])?.meta?.printOptions ?? {} : {};
+  collectSourceFiles(tree);
+  function collectSourceFiles(root) {
+    if (!Array.isArray(root)) {
+      return;
+    }
+    const context = getContextForRenderNode(root);
+    if (context?.meta?.sourceFile) {
+      files[context.meta.sourceFile.path] = printTree(root, {
+        printWidth: options?.printWidth ?? context.meta?.printOptions?.printWidth ?? rootRenderOptions.printWidth,
+        tabWidth: options?.tabWidth ?? context.meta?.printOptions?.tabWidth ?? rootRenderOptions.tabWidth,
+        useTabs: options?.useTabs ?? context.meta?.printOptions?.useTabs ?? rootRenderOptions.useTabs
+      });
+    } else {
+      visitChildren();
+    }
+    function visitChildren() {
+      for (const child of root) {
+        collectSourceFiles(child);
+      }
+    }
+  }
+
+  // If we found no source files, we return the tree as a string.
+  if (Object.keys(files).length === 0) {
+    return printTree(tree, options);
+  } else {
+    return files;
+  }
+}

package/dist/testing/extend-expect.test.d.ts

@@ -0,0 +1,2 @@
+import "./extend-expect.js";
+//# sourceMappingURL=extend-expect.test.d.ts.map

package/dist/testing/extend-expect.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"extend-expect.test.d.ts","sourceRoot":"","sources":["../../testing/extend-expect.test.tsx"],"names":[],"mappings":"AAEA,OAAO,oBAAoB,CAAC"}

package/dist/testing/extend-expect.test.js

@@ -0,0 +1,149 @@
+import { createComponent as _$createComponent } from "@alloy-js/core/jsx-runtime";
+import { Indent, Output, SourceDirectory, SourceFile } from "@alloy-js/core";
+import { describe, expect, it } from "vitest";
+import "./extend-expect.js";
+describe("toRenderTo", () => {
+  it("can validate structure without source files", () => {
+    expect(["base", _$createComponent(Indent, {
+      children: "indented"
+    })]).toRenderTo(`
+      base
+        indented
+      `);
+  });
+  it("can expect the content of the single source file used", () => {
+    expect(_$createComponent(Output, {
+      get children() {
+        return _$createComponent(SourceFile, {
+          path: "Test.cs",
+          tabWidth: 4,
+          filetype: "csharp",
+          get children() {
+            return ["base", _$createComponent(Indent, {
+              children: "indented"
+            })];
+          }
+        });
+      }
+    })).toRenderTo(`
+        base
+            indented
+        `);
+  });
+  it("expect with specific file name", () => {
+    expect(_$createComponent(Output, {
+      get children() {
+        return _$createComponent(SourceFile, {
+          path: "Test.cs",
+          tabWidth: 4,
+          filetype: "csharp",
+          get children() {
+            return ["base", _$createComponent(Indent, {
+              children: "indented"
+            })];
+          }
+        });
+      }
+    })).toRenderTo({
+      "Test.cs": `
+        base
+            indented
+        `
+    });
+  });
+  it("expect with specific file name in SourceDirectory", () => {
+    expect(_$createComponent(Output, {
+      get children() {
+        return _$createComponent(SourceDirectory, {
+          path: "src",
+          get children() {
+            return _$createComponent(SourceFile, {
+              path: "test.txt",
+              filetype: "text",
+              children: "content"
+            });
+          }
+        });
+      }
+    })).toRenderTo({
+      "src/test.txt": `
+          content
+        `
+    });
+  });
+  it("each source file respect their print options", () => {
+    expect(_$createComponent(Output, {
+      get children() {
+        return [_$createComponent(SourceFile, {
+          path: "Test.cs",
+          tabWidth: 4,
+          filetype: "csharp",
+          get children() {
+            return ["base1", _$createComponent(Indent, {
+              children: "indented"
+            })];
+          }
+        }), _$createComponent(SourceFile, {
+          path: "Test.ts",
+          tabWidth: 2,
+          filetype: "csharp",
+          get children() {
+            return ["base2", _$createComponent(Indent, {
+              children: "indented"
+            })];
+          }
+        })];
+      }
+    })).toRenderTo({
+      "Test.cs": `
+        base1
+            indented
+        `,
+      "Test.ts": `
+        base2
+          indented
+        `
+    });
+  });
+  it("fails when content does not match", () => {
+    expect(() => expect(["base", _$createComponent(Indent, {
+      children: "indented"
+    })]).toRenderTo(`
+      base
+        wrong
+    `)).toThrowError(/Render is incorrect/);
+  });
+  it("fails when files don't match", () => {
+    expect(() => expect(_$createComponent(Output, {
+      get children() {
+        return [_$createComponent(SourceFile, {
+          path: "Test.cs",
+          tabWidth: 4,
+          filetype: "csharp",
+          get children() {
+            return ["base1", _$createComponent(Indent, {
+              children: "indented"
+            })];
+          }
+        }), _$createComponent(SourceFile, {
+          path: "Test.ts",
+          tabWidth: 2,
+          filetype: "typescript",
+          get children() {
+            return ["base2", _$createComponent(Indent, {
+              children: "indented"
+            })];
+          }
+        })];
+      }
+    })).toRenderTo({
+      "Test.cs": `
+        bad
+        `,
+      "Test.ts": `
+        base2
+          indented
+        `
+    })).toThrowError(/Render is incorrect/);
+  });
+});