[0.7] initial state of signal not read for dynamic classes

[arnaudpoullet-dkt]

Describe the bug Be it by using .get() of .read() the initial true value is not taken into account to apply the hidden class. Once I start updating the signal with a button it does work correctly.

In this case, the menu is always shown when loading the page.

Leptos Dependencies

For example:

leptos = { version = "0.7.0-beta5", features = ["csr"] }
leptos_meta = { version = "0.7.0-beta5" }
leptos_router = { version = "0.7.0-beta5" }

Concrete example

I'm using taliwindcss classes.

let hide_menu = RwSignal::new(true);

    view! {

    <button type="button" on:click=move |_| { hide_menu.update(|b| *b = !*b); } >Show</button>

    <div class:hidden=move || hide_menu.get() class="border-2 border-sky-500" id="menu">MENU</div>
    }

The first time I click on my button the hidden class is removed correctly, the interface doesn't change. The second time, the class is added back and the menu finally disappears.

I would expect the menu to start in a hidden state and the closure to be executed to determine the initial state of the attribute.

[gbj]

Oh, I think the view macro actually used to reorder class and class: attributes for this reason. When you set class="..." you are wiping out the class:hidden value here that's already been set, because setting the class attribute overwrites the changes you've made to classList.

Setting them in the other order works as expected

<div class="border-2 border-sky-500" class:hidden=move || hide_menu.get() id="menu">

I'll just have to restore that reordering I guess.

[arnaudpoullet-dkt]

Changing the order does work indeed, thank you for the quick reply.