Add video behavior diffing and DOM timeline comparison

[jdcodes1]

Summary

This PR adds two major new capabilities to BehaviorDiff: video behavior diffing and DOM timeline comparison. These features enable detection of behavioral differences that visual screenshots alone cannot capture, particularly useful for reviewing AI-generated code where interactions and state changes matter as much as static appearance.

Key Changes

Video Behavior Diffing

• New module src/diff/video.ts: Extracts frames from recorded videos at configurable intervals, compares frames pixel-by-pixel using pixelmatch, and generates a divergence timeline showing when and how much the behavior differs
• Frame extraction: Uses Playwright to load videos in a headless browser, seek to specific timestamps, and capture PNG frames
• Diff visualization: Produces per-frame diff images and aggregates statistics (max/avg difference percentage, divergence points)
• Type definitions: Added VideoDiff, VideoFrameDiff types to track frame-level and overall video comparison results

DOM Timeline Comparison

• New module src/diff/dom-timeline.ts: Compares DOM snapshots captured at interaction checkpoints (e.g., "before-interaction", "after-interaction")
• Snapshot matching: Aligns snapshots by label between base and PR branches, detects new interaction states introduced in the PR
• Change tracking: Reports structural differences at each checkpoint with detailed change descriptions
• Type definitions: Added DomSnapshot, DomTimelineDiff, DomTimelineChange types

Signal Extraction & Intelligence

• New signal types: extractVideoSignals() and extractDomTimelineSignals() in src/intelligence/signals.ts to identify behavioral anomalies
• Severity assessment: Video signals graded by max diff percentage (>10% = high, >3% = medium, else low); DOM timeline signals graded by change count
• Causality detection: Added detectDomTimelineVideoCausality() to link DOM structure changes to visible video differences

Capture & Reporting

• Enhanced capture: src/runner/capture.ts now records DOM snapshots during interactions and video files; added animation stabilization CSS to prevent flaky diffs
• Config support: New disableAnimations flag (default true) and mask array in PageConfig for masking dynamic content
• Markdown reporting: src/report/opinionated-markdown.ts generates new sections for video behavior diffs and DOM timeline changes with visual divergence timelines
• Action outputs: action.yml now exports has-video-changes and risk-level for downstream workflow decisions

Testing

• New test suites: tests/diff-video-signals.test.ts and tests/diff-dom-timeline.test.ts validate signal extraction and DOM timeline diffing logic

Notable Implementation Details

• Async diffing: diffCaptures() is now async to support video processing, which requires frame extraction and comparison
• Frame synchronization: Video frames are matched by index (timestamp-aligned) rather than content-based matching, with automatic dimension normalization
• DOM snapshot labeling: Snapshots are matched by user-provided labels (e.g., interaction names) to correlate state changes across branches
• Noise reduction: Video and DOM timeline signals integrate with existing noise reduction pipeline to filter trivial differences
• Performance: Video diffing is only performed when both branches have recorded videos; DOM timeline diffing only when snapshots exist

This enables reviewers to answer "what does this PR actually do?" — not just "what code changed?" — which is especially critical for AI-generated PRs where behavioral correctness is paramount.

https://claude.ai/code/session_01Fr1W1ZRMMiSAvkHTpZoHP9