update transform-article-html test

yo-iwamoto · Apr 8, 2024 · 28750a4 · 28750a4
1 parent 7df6196
commit 28750a4
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 25 deletions.
diff --git a/src/lib/__snapshots__/transform-article-html.test.tsx.snap b/src/lib/__snapshots__/transform-article-html.test.tsx.snap
@@ -12,5 +12,7 @@ exports[`transformArticleHtml > transform 結果の snapshot が一致するこ
 <ol>
 <li>Item 1</li>
 <li>Item 2</li>
-</ol>"
+</ol>
+<pre><span class="file-name">src/hello-world.ts</span><code class="language-typescript:src/hello-world.ts">console.log("Hello, world!");</code>
+</pre>"
 `;
diff --git a/src/lib/transform-article-html.test.tsx b/src/lib/transform-article-html.test.tsx
@@ -12,33 +12,49 @@ const html = `<h2>Heading 2</h2>
 <ol>
 <li>Item 1</li>
 <li>Item 2</li>
-</ol>`;
+</ol>
+<pre>
+<code class="language-typescript:src/hello-world.ts">console.log("Hello, world!");</code>
+</pre>`;
 
 describe("transformArticleHtml", () => {
-  it("見出しがアンカーリンクで囲われていること", () => {
-    const transformed = transformArticleHtml(html);
-    render(
-      // biome-ignore lint/security/noDangerouslySetInnerHtml: body は HTML 形式で取得されるため
-      <div dangerouslySetInnerHTML={{ __html: transformed }} />,
-    );
-    expect(screen.getByRole("link", { name: "Heading 2" })).toHaveAttribute(
-      "href",
-      "#heading-2",
-    );
-    expect(screen.getByRole("link", { name: "Heading 3" })).toHaveAttribute(
-      "href",
-      "#heading-3",
-    );
+  describe("assignIdToHeadings", () => {
+    it("見出しがアンカーリンクで囲われていること", () => {
+      const transformed = transformArticleHtml(html);
+      render(
+        // biome-ignore lint/security/noDangerouslySetInnerHtml: body は HTML 形式で取得されるため
+        <div dangerouslySetInnerHTML={{ __html: transformed }} />,
+      );
+      expect(screen.getByRole("link", { name: "Heading 2" })).toHaveAttribute(
+        "href",
+        "#heading-2",
+      );
+      expect(screen.getByRole("link", { name: "Heading 3" })).toHaveAttribute(
+        "href",
+        "#heading-3",
+      );
+    });
+
+    it("見出し要素が存在すること", () => {
+      const transformed = transformArticleHtml(html);
+      render(
+        // biome-ignore lint/security/noDangerouslySetInnerHtml: body は HTML 形式で取得されるため
+        <div dangerouslySetInnerHTML={{ __html: transformed }} />,
+      );
+      expect(screen.getByRole("heading", { name: "Heading 2" })).toBeDefined();
+      expect(screen.getByRole("heading", { name: "Heading 3" })).toBeDefined();
+    });
   });
 
-  it("見出し要素が存在すること", () => {
-    const transformed = transformArticleHtml(html);
-    render(
-      // biome-ignore lint/security/noDangerouslySetInnerHtml: body は HTML 形式で取得されるため
-      <div dangerouslySetInnerHTML={{ __html: transformed }} />,
-    );
-    expect(screen.getByRole("heading", { name: "Heading 2" })).toBeDefined();
-    expect(screen.getByRole("heading", { name: "Heading 3" })).toBeDefined();
+  describe("addFileNameElement", () => {
+    it("ファイル名が表示されていること", () => {
+      const transformed = transformArticleHtml(html);
+      render(
+        // biome-ignore lint/security/noDangerouslySetInnerHtml: body は HTML 形式で取得されるため
+        <div dangerouslySetInnerHTML={{ __html: transformed }} />,
+      );
+      expect(screen.getByText("src/hello-world.ts")).toBeDefined();
+    });
   });
 
   it("transform 結果の snapshot が一致すること", () => {

diff --git a/src/lib/transform-article-html.ts b/src/lib/transform-article-html.ts
@@ -36,7 +36,7 @@ function assignIdToHeadings(document: DOMWindow["document"]) {
   }
 }
 
-const FILE_NAME_CLASS_PATTERN = /^language-[a-z]+:([a-z0-9.-\/]+)$/i;
+const FILE_NAME_CLASS_PATTERN = /^language-[a-z]+:([a-z0-9.\-\/]+)$/i;
 
 function addFileNameElement(document: Document) {
   const codeElements = document.querySelectorAll("pre code");