client.html

<!DOCTYPE html>
<button id="run">run</button>
<pre id="log"></pre>
<script type="module">
    import {Client} from "https://cdn.jsdelivr.net/npm/@gradio/client/dist/index.min.js";

    const log = document.getElementById("log");
    const out = (...a) => {log.textContent += a.join(" ") + "\n";};

    document.getElementById("run").onclick = async () => {
        const client = await Client.connect(location.origin, {events: ["data"]});
        const job = client.submit("/stream", {message: "test"});

        const TIMEOUT = 4000;
        const timer = setTimeout(() => {
            out(`!! TIMEOUT after ${TIMEOUT}ms — iterator did not close`);
            job.return?.();
        }, TIMEOUT);

        let n = 0;
        for await (const msg of job) {
            n++;
            out(`#${n}`, JSON.stringify({type: msg.type, stage: msg.stage}));
        }
        clearTimeout(timer);
        out(`exited naturally after ${n} messages`);
    };
</script>