diff --git a/components/converter/ConversionPreview.tsx b/components/converter/ConversionPreview.tsx index 2705580..93d0721 100644 --- a/components/converter/ConversionPreview.tsx +++ b/components/converter/ConversionPreview.tsx @@ -68,6 +68,14 @@ export function ConversionPreview({ job, onDownload }: ConversionPreviewProps) { const category = job.outputFormat.category; + // Log blob details for debugging + console.log('[Preview] Blob details:', { + size: job.result.size, + type: job.result.type, + previewUrl, + outputFormat: job.outputFormat.extension, + }); + switch (category) { case 'image': return ( @@ -76,6 +84,17 @@ export function ConversionPreview({ job, onDownload }: ConversionPreviewProps) { src={previewUrl} alt="Converted image preview" className="max-w-full max-h-64 object-contain" + onError={(e) => { + console.error('[Preview] Image failed to load:', { + src: previewUrl, + blobSize: job.result?.size, + blobType: job.result?.type, + error: e, + }); + }} + onLoad={() => { + console.log('[Preview] Image loaded successfully'); + }} /> ); diff --git a/lib/converters/imagemagickService.ts b/lib/converters/imagemagickService.ts index 357dfa8..c50872a 100644 --- a/lib/converters/imagemagickService.ts +++ b/lib/converters/imagemagickService.ts @@ -36,7 +36,7 @@ export async function convertWithImageMagick( if (onProgress) onProgress(50); // Convert image using ImageMagick - let result: Uint8Array; + let result: Uint8Array | undefined; await ImageMagick.read(inputData, (image) => { // Apply quality setting if specified @@ -73,8 +73,26 @@ export async function convertWithImageMagick( if (onProgress) onProgress(90); }); + // Verify we have a result + if (!result || result.length === 0) { + throw new Error('ImageMagick conversion produced empty result'); + } + + console.log('[ImageMagick] Conversion complete:', { + inputSize: inputData.length, + outputSize: result.length, + format: outputFormat, + quality: options.imageQuality, + }); + // Create blob from result - const blob = new Blob([result! as BlobPart], { type: getMimeType(outputFormat) }); + const mimeType = getMimeType(outputFormat); + const blob = new Blob([result as BlobPart], { type: mimeType }); + + console.log('[ImageMagick] Created blob:', { + size: blob.size, + type: blob.type, + }); if (onProgress) onProgress(100);