mcp-data-platform-v1.40.5

Fix: Markdown/SVG Thumbnail Capture

v1.40.2–v1.40.4 attempted to fix blank markdown thumbnails but failed because they all kept using html-to-image (toPng), which was the actual broken component. This release replaces it entirely.

Root Cause

html-to-image uses SVG foreignObject internally to capture DOM elements. This produces fully transparent pixels for off-screen elements — regardless of the hiding method (visibility: hidden, left: -9999px, opacity: 0). The markdown thumbnail already in S3 was an 800x600 PNG with 0% opaque pixels, confirmed by fetching and analyzing the pixel data on the production site.

Fix

Replaced html-to-image (toPng) with html2canvas for DomCapture (markdown and SVG thumbnails). html2canvas is already used successfully by IframeCapture for HTML/JSX assets. Tested all combinations on the production site:

Library	Positioning	Result
toPng	any	0% opaque (transparent)
html2canvas	opacity: 0	white rectangle (respects opacity)
html2canvas	left: -9999px	rendered text, tables, headings

Removed the html-to-image dependency entirely (~13KB bundle savings).

Verified on production

Injected the fixed capture code on mcp-demo.plexara.io, rendered the ACME Corp Inventory Report markdown, and captured a 400x300 PNG with 100% opaque pixels and 14.7% non-white content (headings, paragraphs, table). Screenshot confirmed visible rendered prose.

Note

Existing blank thumbnails in S3 from earlier versions will need to be regenerated — either by deleting the thumbnail_s3_key or by editing and saving the asset.

Changed Files

• ui/src/components/ThumbnailGenerator.tsx — DomCapture uses html2canvas instead of toPng
• ui/src/lib/thumbnail.ts — removed captureElement function and html-to-image import
• ui/package.json / ui/package-lock.json — removed html-to-image dependency