whatsapp-chatbot-debug

What problem does it solve?

This Skill resolves the issue where AI-generated images fail to appear in a WhatsApp-style chatbot frontend even when the backend SSE stream is confirmed to be sending valid image data, eliminating hours of manual cross-layer debugging across backend services, frontend code, and infrastructure.

Core Features & Use Cases

• Backend Stream Validation: Checks backend logs for common issues like undersized express.json payload limits and incorrect image data path parsing in SSE chunks.
• Frontend Stream Consumption Debugging: Identifies duplicate getReader() calls that consume the SSE stream before image data can be processed and rendered to the DOM.
• Infrastructure & Auth Bug Resolution: Covers fixes for nginx routing misconfigurations, missing Vite proxy routes for image assets, missing Authorization headers in chat API requests, and critical cross-account data leakage caused by duplicate backend processes.
• Use Case: For example, if your WhatsApp-style chatbot shows no AI-generated images despite backend curl tests confirming valid base64 image SSE streams, this Skill walks you through checking frontend DOM state, fixing stream reader duplication, and adjusting body-parser limits to resolve the issue.

Quick Start

Use the whatsapp-chatbot-debug skill to resolve missing AI-generated images in your WhatsApp-style chatbot frontend when backend SSE streams are confirmed to be working correctly.