htmlコメントを削除する処理を追加

src/esa-utils/comment-remover.ts

@@ -0,0 +1,22 @@
+import type { Root, RootContent } from "hast";
+import { isComment } from "./nodes";
+import { visitParents } from "unist-util-visit-parents";
+
+export function removeComments() {
+  return (tree: Root) => {
+    const targets: { parent: { children: RootContent[] }; idx: number }[] = [];
+
+    visitParents(tree, (node, ancestors) => {
+      if (isComment(node)) {
+        const parent = ancestors[ancestors.length - 1];
+        if (!parent) return;
+        const idx = parent.children.indexOf(node);
+        if (idx !== -1) targets.push({ parent, idx });
+      }
+    });
+
+    for (const { parent, idx } of targets.sort((a, b) => b.idx - a.idx)) {
+      parent.children.splice(idx, 1);
+    }
+  };
+}

src/esa-utils/faq-parser.ts

@@ -5,6 +5,7 @@ import remarkRehype from "remark-rehype";
 import rehypeStringify from "rehype-stringify";
 import { imageReplacer } from "./image-replacer";
 import { externalLinkReplacer } from "./external-link-replacer";
+import { removeComments } from "./comment-remover";
 
 function isH2(node: RootContent): node is Heading {
   return node.type === "heading" && node.depth === 2;
@@ -51,6 +52,7 @@ export async function parseFaqs(ast: Root): Promise<Faq[]> {
       .use(remarkRehype, { allowDangerousHtml: true })
       .use(imageReplacer)
       .use(externalLinkReplacer)
+      .use(removeComments)
       .run(answerRoot);
     const answerHtml = unified()
       .use(rehypeStringify, { allowDangerousHtml: true })

src/esa-utils/nodes.ts

@@ -80,3 +80,15 @@ export function isAnchor(node: Node | undefined): node is AnchorNode {
   }
   return true;
 }
+
+export interface CommentNode extends Node {
+  type: "raw";
+  value: string;
+}
+
+export function isComment(node: Node | undefined): node is CommentNode {
+  if (node === undefined) return false;
+  if (!(node.type === "raw" && "value" in node && typeof node.value === "string")) return false;
+  if (!node.value.trimStart().startsWith("<!--")) return false;
+  return true;
+}

src/pages/posts/[id].astro

@@ -12,6 +12,7 @@ import StyledHtml from "../../components/StyledHtml.astro";
 import Toc from "../../components/Toc.astro";
 import { detailsContentMarker } from "../../esa-utils/details-content-marker";
 import { externalLinkReplacer } from "../../esa-utils/external-link-replacer";
+import { removeComments } from "../../esa-utils/comment-remover";
 import * as env from "../../env";
 import TagList from "../../components/TagList.astro";
 
@@ -39,6 +40,7 @@ const articleHtml = await unified()
   .use(imageReplacer)
   .use(externalLinkReplacer)
   .use(detailsContentMarker)
+  .use(removeComments)
   .use(rehypeStringify, { allowDangerousHtml: true })
   .process(post.body_md);