Error boundary doesn't catch subsequent errors

[dwelle]

When a child component rendered from a loop throws, subsequent errors are not caught by the error boundary.

Sandbox here

preact ^10.0.0-beta.0:

import { render, h, Component } from "preact";

let throws = 0;
const Child = () => {
    console.log(`child throwing (${++throws})`);
    throw new Error("oi!");
};

class TopErrorBoundary extends Component {
    state = { error: false }
    __renders = 0;

    static getDerivedStateFromError (error, info) {
        console.log(`getDerivedStateFromError called`);
        return { error: true };
    }

    render () {
        console.log(`TopErrorBoundary render()`, this.state);
        return this.state.error
            ? <h1>Something went wrong.</h1>
            : this.props.children;
    }
}

render(
    <TopErrorBoundary>
        <div>
            {/* CHANGE THIS ARRAY TO LENGTH: 1 FOR THE ERROR BOUNDARY TO WORK */}
            {[1, 2].map(() => {
                return <Child />;
            })}
        </div>
    </TopErrorBoundary>,
    document.body
);