DioxusLabs / dioxus

Fullstack app framework for web, desktop, mobile, and more.
https://dioxuslabs.com
Apache License 2.0
21.44k stars 826 forks source link

Diffing issues #2623

Closed jkelleyrtp closed 4 months ago

jkelleyrtp commented 4 months ago

Problem

This simply does not render in desktop with hotreloading enabled. Steps To Reproduce

use dioxus::prelude::*;

fn main() {
    dioxus::launch(app);
}

#[component]
fn app() -> Element {
    // Build cool things ✌️
    println!("re-rendering app!");

    rsx! {
        link { href: "main.css", rel: "stylesheet" }
        img { src: "header.svg" }
        div { id: "links",
            for x in 0..3 {
                div {
                    div { "dasd2asdshihihihiisd" }
                    div { "blah 456aasdasdasdk;alsdk132" }
                    SomeComponent {
                        count: 1200,
                        enabled: true,
                        title: "hasd-2 {x}",
                        flot: 100.5,
                        height: 400,
                        width: 409,
                        color: "red {x}",
                        handler: move |e: MouseEvent| {
                            println!("clickeasdd!");
                        },
                        img { src: "header.svg" }
                        img { src: "header.svg" }
                        "sick!! d!! {x} 123u12oi3uklasjdlkjasd"
                        div { "hiii" }
                        if x % 2 == 0 {
                            div { "even!!!!asd!" }
                        } else {
                            div { "odd!" }
                        }
                    }
                }
            }
        }
    }
}

/// This is a component
#[component]
fn SomeComponent(
    /// HIii
    count: i64,
    flot: f64,
    enabled: bool,
    title: String,
    width: i64,

    /// Height!
    height: i64,

    /// Color!
    color: String,
    children: Element,
    // / Some handler
    handler: EventHandler<MouseEvent>,
) -> Element {
    let local: i64 = 123;

    rsx! {
        div {
            if enabled {
                h3 { "super asssssuuuauenableda!!!" }
                h3 { "super asssssuuuasduenabled!!!" }
                h3 { "super asss222ssuuuuenabled!!" }
                h3 { "super asssssuuuuenabled!!" }
                h3 { "super asssssuuuuenabled!!" }
            } else {
                h3 { "one sdasd! {title} {count}" }
            }
            span { "Om2aasdgssssss asdasd {flot} {title}" }
            span { "Omgasd  {title} whatasd!! {flot}" }
            div { "hellohiiiiit works!!" }
            span { "Omg asd {title}  what! {local}" }
            button { onclick: handler, "Click me!" }
            div {
                onclick: move |_| {
                    println!("clicked!");
                    let x = 123;
                    println!("x: {x}");
                },
                div {
                    div {
                        class: "hi hasha",
                        class: "hi23 for five",
                        class: if count > 3 { "it asdwssorssassdkas! {height}" },
                        "the div is cosdasdol"
                    }
                }
            }
            "hi {flot}"
            "something {local}"
            div {
                width: "{width}px",
                height: "{height}px",
                background: "green",
                {children}
            }
        }
    }
}

Environment:

Questionnaire

jkelleyrtp commented 4 months ago

Was not an issue with main, just the branch I was working on 😆