ErrorBoundary breaks with multiple async components when one throws an error

[Mabi19]

What version of Hono are you using?

4.5.9

What runtime/platform is your app running on?

Deno 1.45.5 on Windows 11

What steps can reproduce the bug?

Throw an exception in an async component within an ErrorBoundary that is next to a slower async component:

/** @jsx react-jsx */
/** @jsxImportSource jsr:@hono/[email protected]/jsx */

import { Hono } from "jsr:@hono/[email protected]";
import { ErrorBoundary, FC } from "jsr:@hono/[email protected]/jsx";

const app = new Hono();

export const SlowComponent: FC = async () => {
    await new Promise((resolve) => setTimeout(resolve, 100));
    return <div></div>;
};

const BrokenComponent: FC = async () => {
    await new Promise((resolve) => setTimeout(resolve, 10));
    throw new Error("Out of service");
};

app.get("/", (ctx) => {
    return ctx.html(
        <>
            <SlowComponent />
            <ErrorBoundary fallback="An error occurred">
                <BrokenComponent />
            </ErrorBoundary>
        </>,
    );
});

Deno.serve(app.fetch);

What is the expected behavior?

"An error occurred" (the ErrorBoundary's fallback) is returned from the request

What do you see instead?

The error is never caught and the server crashes

Additional information

The issue appears to be similar to #3252 (except with ErrorBoundary this time)

I'm not using latest Deno because of Deno issue 25203.

[usualoma]

Hi @Mabi19, Thank you. We will investigate.