mdv-live 0.5.4 → 0.5.5

package/CHANGELOG.md

@@ -5,6 +5,31 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.5.5] - 2026-04-05
+
+### Fixed
+
+- タスクリストのインライン要素（太字・リンク・コード）が二重表示されるバグを修正
+  - markdown-it-task-lists の labelAfter オプション誤用が原因
+- Mermaidプレースホルダがユーザーコンテンツと衝突する問題を修正（nonce付与）
+- 空frontmatter（`---\n\n---`）で空のyamlコードブロックが生成される問題を修正
+
+### Removed
+
+- 未使用の `src/rendering/slides.js` を削除（marp.jsに統合済み）
+
+### Added
+
+- WebSocketテスト7件（接続追跡・watch・broadcast・通知・cleanup・不正入力耐性）
+- レンダリングテスト10件（strikethrough・CJK emphasis・linkify・breaks・mermaid edge cases）
+- テスト総数: 92 → 109
+
+## [0.5.4] - 2026-04-04
+
+### Fixed
+
+- 4件の依存関係脆弱性を修正
+
 ## [0.5.3] - 2026-03-29
 
 ### Fixed

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mdv-live",
-  "version": "0.5.4",
+  "version": "0.5.5",
   "description": "Markdown Viewer - File tree + Live preview + Marp support + Hot reload",
   "main": "src/server.js",
   "bin": {

package/src/rendering/markdown.js

@@ -88,7 +88,7 @@ md.enable('table');
 md.enable('strikethrough');
 
 // Enable task lists (checkboxes)
-md.use(taskLists, { enabled: true, label: true, labelAfter: true });
+md.use(taskLists);
 
 // Pattern to detect Marp frontmatter (must be at very start of file, not using 'm' flag)
 const MARP_PATTERN = /^---\s*\n[\s\S]*?marp:\s*true[\s\S]*?\n---/;
@@ -118,6 +118,10 @@ function convertFrontmatter(content) {
   const match = content.match(FRONTMATTER_PATTERN);
   if (match) {
     const frontmatter = match[1];
+    // Skip empty frontmatter (treat as horizontal rules instead)
+    if (!frontmatter.trim()) {
+      return content;
+    }
     const rest = content.slice(match[0].length);
     return `\`\`\`yaml\n${frontmatter}\n\`\`\`\n${rest}`;
   }
@@ -125,18 +129,22 @@ function convertFrontmatter(content) {
   return content;
 }
 
+// Generate a per-render nonce to prevent placeholder collision with user content
+const MERMAID_NONCE = Math.random().toString(36).slice(2, 10);
+
 /**
  * Protect Mermaid blocks from markdown processing
  * @param {string} content - Markdown content
- * @returns {{ content: string, blocks: string[] }}
+ * @returns {{ content: string, blocks: string[], nonce: string }}
  */
 function protectMermaidBlocks(content) {
   const blocks = [];
+  const nonce = MERMAID_NONCE + '_' + Date.now().toString(36);
   const protectedContent = content.replace(MERMAID_PATTERN, (match, code) => {
     blocks.push(code);
-    return `<!--MERMAID_PLACEHOLDER_${blocks.length - 1}-->`;
+    return `<!--MDV_MERMAID_${nonce}_${blocks.length - 1}-->`;
   });
-  return { content: protectedContent, blocks };
+  return { content: protectedContent, blocks, nonce };
 }
 
 /**
@@ -155,17 +163,19 @@ function escapeHtmlEntities(text) {
  * Restore Mermaid blocks after markdown processing
  * @param {string} html - Rendered HTML
  * @param {string[]} blocks - Mermaid code blocks
+ * @param {string} nonce - Nonce used during protection
  * @returns {string}
  */
-function restoreMermaidBlocks(html, blocks) {
+function restoreMermaidBlocks(html, blocks, nonce) {
   let result = html;
   for (let i = 0; i < blocks.length; i++) {
     const escaped = escapeHtmlEntities(blocks[i]);
     const mermaidHtml = `<pre><code class="language-mermaid">${escaped}</code></pre>`;
-    // Replace both paragraph-wrapped and bare placeholders
+    const placeholder = `<!--MDV_MERMAID_${nonce}_${i}-->`;
+    // Replace both paragraph-wrapped and bare placeholders (use split+join for global replace)
     result = result
-      .replace(`<p><!--MERMAID_PLACEHOLDER_${i}--></p>`, mermaidHtml)
-      .replace(`<!--MERMAID_PLACEHOLDER_${i}-->`, mermaidHtml);
+      .split(`<p>${placeholder}</p>`).join(mermaidHtml)
+      .split(placeholder).join(mermaidHtml);
   }
   return result;
 }
@@ -177,9 +187,9 @@ function restoreMermaidBlocks(html, blocks) {
  */
 export function renderMarkdown(content) {
   const withFrontmatter = convertFrontmatter(content);
-  const { content: protectedContent, blocks } = protectMermaidBlocks(withFrontmatter);
+  const { content: protectedContent, blocks, nonce } = protectMermaidBlocks(withFrontmatter);
   const html = md.render(protectedContent);
-  return restoreMermaidBlocks(html, blocks);
+  return restoreMermaidBlocks(html, blocks, nonce);
 }
 
 export default { renderMarkdown, isMarp };

package/src/rendering/slides.js

@@ -1,152 +0,0 @@
-/**
- * Simple slide renderer for Marp-compatible markdown
- *
- * Features:
- * - Split by --- (horizontal rule)
- * - Full HTML support (no escaping)
- * - Tailwind CSS compatible
- * - Frontmatter extraction
- */
-
-import MarkdownIt from 'markdown-it';
-
-// Initialize markdown-it with full HTML support
-const md = new MarkdownIt({
-  html: true,
-  breaks: false,
-  linkify: true,
-  typographer: true
-});
-
-/**
- * Parse frontmatter from markdown content
- * @param {string} content - Raw markdown
- * @returns {{ frontmatter: object, body: string }}
- */
-function parseFrontmatter(content) {
-  const match = content.match(/^---\s*\n([\s\S]*?)\n---\s*\n/);
-  if (!match) {
-    return { frontmatter: {}, body: content };
-  }
-
-  const frontmatter = {};
-  const yaml = match[1];
-
-  // Simple YAML parsing (key: value)
-  yaml.split('\n').forEach(line => {
-    const [key, ...rest] = line.split(':');
-    if (key && rest.length) {
-      frontmatter[key.trim()] = rest.join(':').trim();
-    }
-  });
-
-  return {
-    frontmatter,
-    body: content.slice(match[0].length)
-  };
-}
-
-/**
- * Check if content is a slide presentation (has marp: true or uses ---)
- * @param {string} content - Markdown content
- * @returns {boolean}
- */
-export function isSlidePresentation(content) {
-  // Check for marp: true in frontmatter
-  if (/^---\s*\n[\s\S]*?marp:\s*true[\s\S]*?\n---/.test(content)) {
-    return true;
-  }
-  return false;
-}
-
-/**
- * Render slide content (handles both HTML blocks and markdown)
- * @param {string} slideContent - Single slide content
- * @returns {string} Rendered HTML
- */
-function renderSlideContent(slideContent) {
-  const trimmed = slideContent.trim();
-
-  // If it starts with HTML tag, render as-is (minimal processing)
-  if (trimmed.startsWith('<')) {
-    // Process any markdown within the HTML
-    // But preserve the HTML structure
-    return trimmed;
-  }
-
-  // Otherwise, render as markdown
-  return md.render(trimmed);
-}
-
-/**
- * Extract scripts and styles from the first slide (typically config)
- * @param {string} content - First slide content after frontmatter
- * @returns {{ scripts: string, styles: string, content: string }}
- */
-function extractConfigFromFirstSlide(content) {
-  let scripts = '';
-  let styles = '';
-  let remaining = content;
-
-  // Extract <script> tags
-  const scriptMatches = content.match(/<script[\s\S]*?<\/script>/gi) || [];
-  scriptMatches.forEach(script => {
-    scripts += script + '\n';
-    remaining = remaining.replace(script, '');
-  });
-
-  // Extract <style> tags
-  const styleMatches = content.match(/<style[\s\S]*?<\/style>/gi) || [];
-  styleMatches.forEach(style => {
-    styles += style + '\n';
-    remaining = remaining.replace(style, '');
-  });
-
-  return { scripts, styles, content: remaining.trim() };
-}
-
-/**
- * Render markdown slides to HTML
- * @param {string} content - Markdown content with slide separators
- * @returns {{ html: string, slideCount: number, scripts: string, styles: string }}
- */
-export function renderSlides(content) {
-  const { frontmatter, body } = parseFrontmatter(content);
-
-  // Split by --- (must be on its own line)
-  const rawSlides = body.split(/\n---\s*\n/);
-
-  // Extract scripts/styles from first "slide" (config area)
-  const firstSlide = rawSlides[0] || '';
-  const { scripts, styles, content: firstContent } = extractConfigFromFirstSlide(firstSlide);
-
-  // Build slides array (first slide might be empty after extracting config)
-  const slidesContent = [firstContent, ...rawSlides.slice(1)].filter(s => s.trim());
-
-  // Render each slide
-  const slides = slidesContent.map((slideContent, index) => {
-    const rendered = renderSlideContent(slideContent);
-    return `
-      <section class="slide" data-slide-index="${index}">
-        ${rendered}
-      </section>
-    `;
-  });
-
-  // Wrap in container
-  const html = `
-    <div class="slides-container" data-slide-count="${slides.length}">
-      ${slides.join('\n')}
-    </div>
-  `;
-
-  return {
-    html,
-    slideCount: slides.length,
-    scripts,
-    styles,
-    frontmatter
-  };
-}
-
-export default { renderSlides, isSlidePresentation };