Component hot reloading bug

[mfrr-xyz]

Problem

Hot reload error occurred when adding/removing of component from rsx!{}

Steps To Reproduce

Steps to reproduce the behavior:

1 - Create a dioxus bare bone web, run dx serve, open the web page in the browser, keep it active. The example code below can be used:

use dioxus::prelude::*;
fn main() {
    dioxus::launch(App);
}

#[component]
fn App() -> Element {
    rsx! {
        Hero { msg: "Hero" }
    }
}
#[component]
pub fn Hero(msg: String) -> Element {
    rsx! {
        div {
            "{msg}"
        }
    }
}

2 - Duplicate the component, save to trigger hot reload

    rsx! {
        Hero { msg: "Hero" }
        Hero { msg: "Hero" }
    } 

The following error would occur:

19:20:42 [web] panicked at /home/user/.cargo/registry/src/index.crates.io-6f17d22bba15001f/dioxus-core-0.6.1/src/hotreload_utils.rs:271:50
index out of bounds: the len is 1 but the index is 1

Stack:

Error
    at http://127.0.0.1:8080/wasm/dioxus_hello.js:1014:21
    at logError (http://127.0.0.1:8080/wasm/dioxus_hello.js:89:18)
    at imports.wbg.__wbg_new_8a6f238a6ece86ea (http://127.0.0.1:8080/wasm/dioxus_hello.js:1013:66)
    at dioxus_hello-4a626d4c0b34130d.wasm.__wbg_new_8a6f238a6ece86ea externref shim (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[2585]:0xd0977
    at dioxus_hello-4a626d4c0b34130d.wasm.console_error_panic_hook::hook::hafbc5cb99e491a71 (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[532]:0x674b3
    at dioxus_hello-4a626d4c0b34130d.wasm.core::ops::function::Fn::call::he0da7e80a1402f2c (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[3318]:0xd3471
    at dioxus_hello-4a626d4c0b34130d.wasm.std::panicking::rust_panic_with_hook::heb1fa7c95b92daf7 (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[1340]:0xb70b6
    at dioxus_hello-4a626d4c0b34130d.wasm.std::panicking::begin_panic_handler::{{closure}}::h3c2bc8468c50b1ce (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[1474]:0xbcf80
    at dioxus_hello-4a626d4c0b34130d.wasm.std::sys::backtrace::__rust_end_short_backtrace::h8e8868764214f28d (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[3172]:0xd2f35
    at dioxus_hello-4a626d4c0b34130d.wasm.rust_begin_unwind (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[2261]:0xce2b5

19:20:42 [web] panicked at /home/user/.cargo/registry/src/index.crates.io-6f17d22bba15001f/wasm-bindgen-futures-0.4.49/src/task/singlethread.rs:103:37
already borrowed: BorrowMutError

Stack:

Error
    at http://127.0.0.1:8080/wasm/dioxus_hello.js:1014:21
    at logError (http://127.0.0.1:8080/wasm/dioxus_hello.js:89:18)
    at imports.wbg.__wbg_new_8a6f238a6ece86ea (http://127.0.0.1:8080/wasm/dioxus_hello.js:1013:66)
    at dioxus_hello-4a626d4c0b34130d.wasm.__wbg_new_8a6f238a6ece86ea externref shim (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[2585]:0xd0977
    at dioxus_hello-4a626d4c0b34130d.wasm.console_error_panic_hook::hook::hafbc5cb99e491a71 (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[532]:0x674b3
    at dioxus_hello-4a626d4c0b34130d.wasm.core::ops::function::Fn::call::he0da7e80a1402f2c (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[3318]:0xd3471
    at dioxus_hello-4a626d4c0b34130d.wasm.std::panicking::rust_panic_with_hook::heb1fa7c95b92daf7 (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[1340]:0xb70b6
    at dioxus_hello-4a626d4c0b34130d.wasm.std::panicking::begin_panic_handler::{{closure}}::h3c2bc8468c50b1ce (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[1474]:0xbcf80
    at dioxus_hello-4a626d4c0b34130d.wasm.std::sys::backtrace::__rust_end_short_backtrace::h8e8868764214f28d (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[3172]:0xd2f35
    at dioxus_hello-4a626d4c0b34130d.wasm.rust_begin_unwind (http://127.0.0.1:8080/wasm/dioxus_hello_bg.wasm:wasm-function[2261]:0xce2b5

3 - Remove duplicate, save to trigger hot reload

    rsx! {
        Hero { msg: "Hero" }
    } 

The following error would occur:

19:26:37 [dev] Hotreloading: /src/main.rs                                                                                                                                
19:26:37 [web] %cERROR%c /home/user/.cargo/registry/src/index.crates.io-6f17d22bba15001f/dioxus-core-0.6.1/src/hotreload_utils.rs:192%c Expected a string component property, because the type was &str. The CLI gave the hot reloading engine a type of None. This is probably caused by a bug in dioxus hot reloading. Please report this issue 

4 - Remove the remaining component, save to trigger hot reload.

    rsx! {
    } 

5- Undo remove and save to trigger again.

    rsx! {
        Hero { msg: "Hero" }
    } 

The following error would occur.

19:30:51 [dev] Hotreloading: /src/main.rs
19:30:51 [web] %cERROR%c /home/user/.cargo/registry/src/index.crates.io-6f17d22bba15001f/dioxus-core-0.6.1/src/hotreload_utils.rs:192%c Expected a string component property, because the type was &str. The CLI gave the hot reloading engine a type of None. This is probably caused by a bug in dioxus hot reloading. Please report this issue

Expected behavior

No error.

Environment:

• Dioxus version: 0.6.1
• Rust version: 1.83.0
• OS info: Linux
• App platform: 'web'

Questionnaire

I'm interested in fixing this myself but don't know where to start
I don't have time to fix this right now, but maybe later