chore: fix some tests and building

apps/docs/scripts/createScssLookup.ts

@@ -5,7 +5,7 @@ import { createScssLookup } from "docs-generator/scripts/create-scss-lookup";
 import { logComplete } from "docs-generator/utils/log";
 
 if (!process.argv.includes("--watch")) {
-  createScssLookup();
+  await createScssLookup();
   process.exit(0);
 }
 

apps/docs/scripts/tsconfig.json

@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "es5",
+    "target": "esnext",
     "noEmit": true,
     "jsx": "preserve",
     "strict": true,

packages/code/src/__tests__/HighlightedCodeBlock.tsx

@@ -0,0 +1,21 @@
+import { describe, expect, it } from "@jest/globals";
+import { render, screen } from "@react-md/core/test-utils";
+import { HighlightedCodeBlock } from "../HighlightedCodeBlock.js";
+import { highlightCode } from "../prismjs/highlight.js";
+
+describe("HighlightedCodeBlock", () => {
+  it("should auto highlight children", () => {
+    render(
+      <HighlightedCodeBlock
+        containerProps={{ "data-testid": "container" }}
+        language="ts"
+        highlightCode={highlightCode}
+      >
+        const x = 3;
+      </HighlightedCodeBlock>
+    );
+
+    const container = screen.getByTestId("container");
+    expect(container).toMatchSnapshot();
+  });
+});

packages/code/src/__tests__/__snapshots__/HighlightedCodeBlock.tsx.snap

@@ -0,0 +1,47 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`HighlightedCodeBlock should auto highlight children 1`] = `
+<div
+  class="code-block rmd-text-primary-color rmd-dark-surface"
+  data-testid="container"
+>
+  <div
+    class="code-block__scroll-container"
+  >
+    <div
+      class="code-block__pre-container"
+    >
+      <pre
+        class="language-ts code-block__pre"
+      >
+        <code
+          class="language-ts"
+        >
+          <span
+            class="token keyword"
+          >
+            const
+          </span>
+           x 
+          <span
+            class="token operator"
+          >
+            =
+          </span>
+           
+          <span
+            class="token number"
+          >
+            3
+          </span>
+          <span
+            class="token punctuation"
+          >
+            ;
+          </span>
+        </code>
+      </pre>
+    </div>
+  </div>
+</div>
+`;

packages/core/src/avatar/__tests__/Avatar.tsx

@@ -40,7 +40,7 @@ describe("Avatar", () => {
     const { rerender } = render(<Avatar {...props} />);
 
     const avatar = screen.getByTestId("avatar");
-    const img = screen.getByRole("img", { hidden: true });
+    const img = screen.getByRole("presentation", { hidden: true });
     expect(img).toHaveAttribute("src", props.src);
     expect(img).toHaveAttribute("alt", "");
     expect(avatar).toMatchSnapshot();