reviw 0.14.5 → 0.15.2

package/README.ja.md

@@ -151,7 +151,14 @@ plugin/
 │   ├── do.md                 # /reviw:doコマンド定義
 │   └── done.md               # /reviw:doneコマンド定義
 ├── agents/
-│   └── report-builder.md     # レポート生成エージェント
+│   ├── report-builder.md     # レポート生成エージェント
+│   ├── e2e-health-reviewer.md    # E2Eテスト健全性チェック
+│   ├── review-code-quality.md    # コード品質レビュー
+│   ├── review-security.md        # セキュリティ監査
+│   ├── review-a11y-ux.md         # アクセシビリティ & UX
+│   ├── review-figma-fidelity.md  # デザイン忠実度
+│   ├── review-copy-consistency.md # テキスト整合性
+│   └── review-e2e-integrity.md   # E2Eテスト整合性
 ├── skills/
 │   ├── artifact-proof/
 │   │   └── SKILL.md          # エビデンス収集スキル
@@ -171,8 +178,15 @@ plugin/
 | 種類 | 名前 | 説明 |
 |------|------|------|
 | **コマンド** | `/reviw:do` | タスク開始 - worktree作成、計画、todo登録 |
-| **コマンド** | `/reviw:done` | 完了チェックリスト - エビデンス収集、レビュー開始 |
+| **コマンド** | `/reviw:done` | 完了チェックリスト - 7レビューエージェント実行、エビデンス収集、レビュー開始 |
 | **エージェント** | `report-builder` | ユーザーレビュー用レポート準備 |
+| **エージェント** | `review-code-quality` | コード品質: 可読性、DRY、型安全性、エラーハンドリング |
+| **エージェント** | `review-security` | セキュリティ: XSS、インジェクション、OWASP Top 10、秘密情報検出 |
+| **エージェント** | `review-a11y-ux` | アクセシビリティ: WCAG 2.2 AA、キーボード操作、UXフロー |
+| **エージェント** | `review-figma-fidelity` | デザイン: トークン準拠、視覚的一貫性 |
+| **エージェント** | `review-copy-consistency` | コピー: テキスト整合性、トーン&マナー、i18n |
+| **エージェント** | `review-e2e-integrity` | E2E: ユーザーフロー再現、モック汚染検出 |
+| **エージェント** | `e2e-health-reviewer` | E2E: goto制限、レコードアサーション、ハードコード検出 |
 | **スキル** | `artifact-proof` | エビデンス収集（スクリーンショット、動画、ログ） |
 | **スキル** | `webapp-testing` | Playwrightによるブラウザ自動化と検証 |
 | **フック** | PreToolUse | git commit/push前にレビューを促すリマインダー |

package/README.md

@@ -151,7 +151,14 @@ plugin/
 │   ├── do.md                 # /reviw:do command definition
 │   └── done.md               # /reviw:done command definition
 ├── agents/
-│   └── report-builder.md     # Report generation agent
+│   ├── report-builder.md     # Report generation agent
+│   ├── e2e-health-reviewer.md    # E2E test health check
+│   ├── review-code-quality.md    # Code quality review
+│   ├── review-security.md        # Security audit
+│   ├── review-a11y-ux.md         # Accessibility & UX
+│   ├── review-figma-fidelity.md  # Design fidelity
+│   ├── review-copy-consistency.md # Text consistency
+│   └── review-e2e-integrity.md   # E2E test integrity
 ├── skills/
 │   ├── artifact-proof/
 │   │   └── SKILL.md          # Evidence collection skill
@@ -171,8 +178,15 @@ plugin/
 | Type | Name | Description |
 |------|------|-------------|
 | **Command** | `/reviw:do` | Start a task - create worktree, plan, register todos |
-| **Command** | `/reviw:done` | Complete checklist - collect evidence, start review |
+| **Command** | `/reviw:done` | Complete checklist - run 7 review agents, collect evidence, start review |
 | **Agent** | `report-builder` | Prepare reports and evidence for user review |
+| **Agent** | `review-code-quality` | Code quality: readability, DRY, type safety, error handling |
+| **Agent** | `review-security` | Security: XSS, injection, OWASP Top 10, secrets detection |
+| **Agent** | `review-a11y-ux` | Accessibility: WCAG 2.2 AA, keyboard nav, UX flow |
+| **Agent** | `review-figma-fidelity` | Design: token compliance, visual consistency |
+| **Agent** | `review-copy-consistency` | Copy: text consistency, tone & manner, i18n |
+| **Agent** | `review-e2e-integrity` | E2E: user flow reproduction, mock contamination |
+| **Agent** | `e2e-health-reviewer` | E2E: goto restrictions, record assertions, hardcoding |
 | **Skill** | `artifact-proof` | Collect evidence (screenshots, videos, logs) |
 | **Skill** | `webapp-testing` | Browser automation and verification with Playwright |
 | **Hook** | PreToolUse | Remind to review before git commit/push |
@@ -224,14 +238,43 @@ Validates completion criteria before allowing task completion.
 
 ---
 
-### Agent
+### Agents
+
+#### Review Agents (7 agents run in parallel)
+
+When `/reviw:done` is executed, 7 review agents run simultaneously and append their findings to `REPORT.md`:
+
+| Agent | Focus | Output Section |
+|-------|-------|----------------|
+| `review-code-quality` | Readability, DRY, type safety, error handling | Code Quality Review |
+| `review-security` | XSS, injection, OWASP Top 10, secrets | Security Review |
+| `review-a11y-ux` | WCAG 2.2 AA, keyboard nav, focus management | A11y & UX Review |
+| `review-figma-fidelity` | Design tokens, visual consistency | Figma Fidelity Review |
+| `review-copy-consistency` | Text consistency, i18n, tone & manner | Copy Consistency Review |
+| `review-e2e-integrity` | User flow reproduction, mock contamination | E2E Integrity Review |
+| `e2e-health-reviewer` | goto restrictions, record assertions | E2E Health Review |
+
+**Total score:** Each agent scores X/5, combined for X/35 total.
+
+**Invocation (parallel):**
+```
+Task tool with 7 parallel calls:
+  subagent_type: "review-code-quality"
+  subagent_type: "review-security"
+  subagent_type: "review-a11y-ux"
+  subagent_type: "review-figma-fidelity"
+  subagent_type: "review-copy-consistency"
+  subagent_type: "review-e2e-integrity"
+  subagent_type: "e2e-health-reviewer"
+```
 
 #### `report-builder`
 
-Specialized agent for preparing review materials.
+Specialized agent for preparing review materials (runs after review agents).
 
 **Role:**
 - Organize implementation into a structured report
+- Calculate total review score (X/35)
 - Collect and arrange evidence (screenshots, videos)
 - Prepare `REPORT.md` for reviw review
 - Parse reviw feedback and register as todos
@@ -321,6 +364,20 @@ Build & Verify (webapp-testing)
     ↓
 /reviw:done
     ↓
+┌─────────────────────────────────────────────┐
+│  7 Review Agents (parallel execution)       │
+│                                             │
+│  review-code-quality ──┐                    │
+│  review-security ──────┤                    │
+│  review-a11y-ux ───────┼──→ REPORT.md      │
+│  review-figma-fidelity ┤    (append)        │
+│  review-copy-consistency                    │
+│  review-e2e-integrity ─┤                    │
+│  e2e-health-reviewer ──┘                    │
+└─────────────────────────────────────────────┘
+    ↓
+report-builder (organize + score)
+    ↓
 Collect evidence (artifact-proof)
     ↓
 npx reviw opens report (foreground)

package/cli.cjs

@@ -29,21 +29,25 @@ const allowedTags = new Set([
   'ul', 'ol', 'li',
   'blockquote', 'pre', 'code',
   'em', 'strong', 'del', 's',
-  'a', 'img',
+  'a', 'img', 'video',
   'table', 'thead', 'tbody', 'tr', 'th', 'td',
   'div', 'span', // Markdown拡張用
+  'details', 'summary', // 折りたたみ用
 ]);
 
 // 許可属性リスト（タグごとに定義）
 const allowedAttributes = {
   'a': ['href', 'title', 'target', 'rel'],
   'img': ['src', 'alt', 'title', 'width', 'height'],
+  'video': ['src', 'controls', 'width', 'height', 'poster', 'preload', 'muted', 'loop'],
   'code': ['class'], // 言語ハイライト用
   'pre': ['class'],
   'div': ['class'],
   'span': ['class'],
   'th': ['align'],
   'td': ['align'],
+  'details': ['open'],
+  'summary': [],
 };
 
 // HTMLエスケープ関数（XSS対策用）
@@ -149,12 +153,13 @@ marked.use({
       }
       var titleAttr = title ? ' title="' + escapeHtmlForXss(title) + '"' : "";
       var altAttr = text ? ' alt="' + escapeHtmlForXss(text) + '"' : "";
-      // Check if this is a video file - wrap in <a> tag for video player functionality
+      // Check if this is a video file - render as video element with thumbnail
       var videoExtensions = /\.(mp4|mov|webm|avi|mkv|m4v|ogv)$/i;
       if (videoExtensions.test(href)) {
-        // For videos, return a clickable link with video icon
+        // For videos, render as video element with controls and thumbnail preview
         var displayText = text || href.split('/').pop();
-        return '<a href="' + escapeHtmlForXss(href) + '"' + titleAttr + ' class="video-link">📹' + escapeHtmlForXss(displayText) + '</a>';
+        return '<video src="' + escapeHtmlForXss(href) + '" controls preload="metadata" class="video-preview"' + titleAttr + '>' +
+               '<a href="' + escapeHtmlForXss(href) + '">📹' + escapeHtmlForXss(displayText) + '</a></video>';
       }
       return '<img src="' + escapeHtmlForXss(href) + '"' + altAttr + titleAttr + '>';
     }
@@ -719,8 +724,28 @@ function loadMarkdown(filePath) {
   }
 
   // Parse markdown content (without frontmatter)
-  const contentText = lines.slice(contentStart).join("\n");
-  const preview = frontmatterHtml + marked.parse(contentText, { breaks: true });
+  let contentText = lines.slice(contentStart).join("\n");
+
+  // Preprocess <details> blocks to preserve their content
+  // marked splits HTML blocks on blank lines, so we need to handle details specially
+  const detailsBlocks = [];
+  contentText = contentText.replace(/<details>([\s\S]*?)<\/details>/gi, function(match, inner) {
+    const placeholder = `<!--DETAILS_PLACEHOLDER_${detailsBlocks.length}-->`;
+    // Parse the inner content as markdown, preserving the details structure
+    const summaryMatch = inner.match(/<summary>([\s\S]*?)<\/summary>/i);
+    const summary = summaryMatch ? summaryMatch[1] : '';
+    const content = summaryMatch ? inner.replace(/<summary>[\s\S]*?<\/summary>/i, '').trim() : inner.trim();
+    const parsedContent = marked.parse(content, { breaks: true });
+    detailsBlocks.push(`<details><summary>${summary}</summary>${parsedContent}</details>`);
+    return placeholder;
+  });
+
+  let preview = frontmatterHtml + marked.parse(contentText, { breaks: true });
+
+  // Restore details blocks
+  detailsBlocks.forEach((block, i) => {
+    preview = preview.replace(`<!--DETAILS_PLACEHOLDER_${i}-->`, block);
+  });
 
   return {
     rows: lines.map((line) => [line]),
@@ -2224,6 +2249,14 @@ function htmlTemplate(dataRows, cols, projectRoot, relativePath, mode, previewHt
     }
     .md-preview p { margin: 0.3em 0; line-height: 1.5; }
     .md-preview img { max-width: 100%; height: auto; border-radius: 8px; }
+    .md-preview video.video-preview { max-width: 100%; height: auto; border-radius: 8px; background: #000; }
+    .md-preview table video.video-preview {
+      display: block;
+      width: auto;
+      height: auto;
+      max-width: 200px;
+      max-height: 300px;
+    }
     .md-preview code { background: rgba(255,255,255,0.08); padding: 2px 4px; border-radius: 4px; }
     .md-preview pre {
       background: var(--code-bg);
@@ -2350,19 +2383,27 @@ function htmlTemplate(dataRows, cols, projectRoot, relativePath, mode, previewHt
     }
     /* Markdown tables in preview */
     .md-preview table:not(.frontmatter-table table) {
-      width: 100%;
+      width: max-content;
       border-collapse: collapse;
+      table-layout: auto;
       margin: 16px 0;
       border: 1px solid var(--border);
       border-radius: 8px;
-      overflow: hidden;
     }
     .md-preview table:not(.frontmatter-table table) th,
     .md-preview table:not(.frontmatter-table table) td {
-      width: 50%;
       padding: 10px 16px;
       text-align: left;
       border-bottom: 1px solid var(--border);
+      vertical-align: top;
+      white-space: nowrap;
+    }
+    .md-preview table:not(.frontmatter-table table) td:has(video),
+    .md-preview table:not(.frontmatter-table table) td:has(img) {
+      padding: 0;
+      width: 1%;
+      white-space: nowrap;
+      line-height: 0;
     }
     .md-preview table:not(.frontmatter-table table) th {
       background: var(--panel);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "reviw",
-  "version": "0.14.5",
+  "version": "0.15.2",
   "description": "Lightweight file reviewer with in-browser comments for CSV, TSV, Markdown, and Git diffs.",
   "type": "module",
   "bin": {