What causes "Image too large (>5MB)" in wavetermdev/waveterm?

Resize or recompress the image (e.g. canvas downscale) so the blob is under 5MB

Image too large (>5MB)

Error message

Image too large (>5MB)

What it means

createTempFileFromBlob refuses blobs larger than 5MB before writing a temporary image file (used e.g. for pasting images into the terminal). The 5MB cap protects memory and disk from oversized payloads.

Source

Thrown at frontend/app/view/term/termutil.ts:84

    "image/heif": "heif",
    "image/avif": "avif",
    "image/x-icon": "ico",
    "image/vnd.microsoft.icon": "ico",
};

/**
 * Creates a temporary file from a Blob (typically an image).
 * Validates size, generates a unique filename, saves to temp directory,
 * and returns the file path.
 *
 * @param blob - The Blob to save
 * @returns The path to the created temporary file
 * @throws Error if blob is too large (>5MB) or data URL is invalid
 */
export async function createTempFileFromBlob(blob: Blob): Promise<string> {
    // Check size limit (5MB)
    if (blob.size > 5 * 1024 * 1024) {
        throw new Error("Image too large (>5MB)");
    }

    // Get file extension from MIME type
    if (!blob.type.startsWith("image/") || !MIME_TO_EXT[blob.type]) {
        throw new Error(`Unsupported or invalid image type: ${blob.type}`);
    }
    const ext = MIME_TO_EXT[blob.type];

    // Generate unique filename with timestamp and random component
    const timestamp = Date.now();
    const random = Math.random().toString(36).substring(2, 8);
    const filename = `waveterm_paste_${timestamp}_${random}.${ext}`;

    const arrayBuffer = await new Promise<ArrayBuffer>((resolve, reject) => {
        const reader = new FileReader();
        reader.onload = () => resolve(reader.result as ArrayBuffer);
        reader.onerror = reject;
        reader.readAsArrayBuffer(blob);

View on GitHub (pinned to a4447c1563)

Solutions

Resize or recompress the image (e.g. canvas downscale) so the blob is under 5MB
Convert to a more compact format (JPEG/WebP) before creating the temp file
If larger images must be supported, raise the limit in termutil.ts deliberately and test memory impact

Example fix

// before
await createTempFileFromBlob(hugeBlob);

// after
if (hugeBlob.size > 5 * 1024 * 1024) {
    hugeBlob = await compressImage(hugeBlob, 0.7);
}
const path = await createTempFileFromBlob(hugeBlob);

Defensive patterns

Strategy: validation

Validate before calling

const MAX = 5 * 1024 * 1024;
if (!(blob instanceof Blob) || blob.size > MAX) {
    throw new Error("image must be a Blob under 5MB");
}

Type guard

function isUploadableImage(blob: unknown): blob is Blob {
    return blob instanceof Blob && blob.size <= 5 * 1024 * 1024;
}

Try / catch

try {
    const path = await createTempFileFromBlob(blob);
} catch (e) {
    if (String(e.message).startsWith("Image too large")) {
        notifyUser("Please use an image under 5MB");
    } else { throw e; }
}

Prevention

Downscale screenshots on the client before creating temp files
Check blob.size before any paste/drop handler calls the function
Show a size indicator/limit in the UI for image attachments

When it happens

Trigger: Calling createTempFileFromBlob(tempPath) with a Blob whose blob.size > 5 * 1024 * 1024.

Common situations: User pastes or drops a high-resolution screenshot/photo into the terminal; clipboard contains a large image; programmatic image upload exceeds the cap.

Related errors

AI-assisted analysis of wavetermdev/waveterm@a4447c1563 (2026-09-01). Data as JSON: /api/errors/268c4e342cf43b20. Report an issue: GitHub.