Real-time Gradio Event Monitor

Build a real-time event monitoring tool that connects to a Gradio application and tracks all events during prediction submissions, providing detailed progress information and logging capabilities.

Requirements

Your tool should implement a function monitorGradioEvents that:

1. Accepts a Gradio app URL/Space reference and an endpoint name
2. Submits a prediction to the specified endpoint with given input data
3. Monitors and collects all events that occur during the prediction lifecycle
4. Returns a structured summary of the events, including:
   • Total count of each event type (status, data, log, render)
   • All status changes in chronological order
   • The final prediction result
   • Any log messages received
   • Timing information (start and end timestamps)

Functionality

The function should:

• Handle streaming events from the Gradio API submission
• Capture different types of events (status updates, data, logs, render events)
• Track the progression of the request from pending to completion
• Gracefully handle errors during event processing
• Return a comprehensive event report

Test Cases

• Connecting to a test Gradio endpoint and submitting a simple text input returns an event summary with at least one "complete" status event and final data @test
• The event summary correctly counts all status events including "pending" and "complete" states @test
• When multiple events occur, they are all captured in chronological order in the event summary @test

Implementation

@generates

API

/**
 * Monitors all events during a Gradio prediction submission.
 *
 * @param {string} appReference - The Gradio app URL or Space name (e.g., "user/space-name")
 * @param {string} endpoint - The endpoint name to call
 * @param {any} inputData - The input data to submit to the endpoint
 * @returns {Promise<Object>} Event summary containing:
 *   - eventCounts: Object with counts for each event type
 *   - statusHistory: Array of status change objects with timestamps
 *   - finalResult: The final prediction data
 *   - logs: Array of log messages
 *   - timing: Start and end timestamps
 * @throws {Error} If connection fails or endpoint is invalid
 */
async function monitorGradioEvents(appReference, endpoint, inputData) {
  // IMPLEMENTATION HERE
}

module.exports = {
  monitorGradioEvents
};

Dependencies { .dependencies }

@gradio/client { .dependency }

Provides the client library for connecting to and interacting with Gradio applications, including streaming event handling capabilities.

@satisfied-by