#ErrorBoundary rendering error but also not capturing it? (0.7.0-rc.3)

1 messages · Page 1 of 1 (latest)

granite plover
#

In the following rsx, errors are supposed to be captured by the error boundary and for now "An error occurred" should happen.

rsx! {
        div { class: "prose lg:prose-xl",
            ErrorBoundary {
                handle_error: |_| rsx! {
                    pre { class: "bg-error/20 p-4 rounded-lg text-error",
                        "An error occurred"
                        //code { "Error: {err}" }
                    }
                },
                SuspenseBoundary {
                    fallback: |_| rsx! {
                        pre { class: "bg-base-200 p-4 rounded-lg",
                            span { class: "loading loading-dots loading-md" }
                        }
                    },
                    pre { class: "bg-base-200 p-4 rounded-lg",
                        code {
                            "{ (*boa_result.suspend()?.read()).clone()? }"
                        }
                    }
                }
            }
        }
    }

However, what is actually happening is that the error bypasses the error boundary and instead gets rendered over the entire app (and it is the actual error message, not 'An error occurred').

I tested this on multiple platforms (web + mobile simulator) and got the same result so I don't think this is a platform-specific behavior.

I wanted to see if the ErrorBoundary is at least recognizing that there is an error, so I set a breakpoint on

dioxus/packages/core/src/error_boundary.rs

#[allow(non_upper_case_globals, non_snake_case)]
pub fn ErrorBoundary(props: ErrorBoundaryProps) -> Element {
    let error_boundary = use_error_boundary_provider();
    let errors = error_boundary.error();
    let has_errors = errors.is_some();

    // Drop errors before running user code that might borrow the error lock
    drop(errors);

    if has_errors {
        (props.handle_error.0)(error_boundary.clone())
    } else {
#

and the 'has_errors' variable does get set to true when I trigger the error and the handle_error closure gets run. But then if I continue the debugger, we end up with the full error displaying replacing the entire app.

#

Is it just the case that you can't put ErrorBoundaries in the same component as where the error gets thrown? You have to always have to make a subcomponent where the error is thrown?