Button not working if initialized as true

[svilupp]

Behaviour: When a variable associated with a button is initiated as true, it will never become reactive. See MWE below

MWE

using GenieFramework
@genietools

@app begin
    @in process = true # change this to false and all will work as expected

    @onbutton process begin
        @info "Button clicked"
    end
end

function ui()
    btn("Send", @click(:process))
end

@page("/", ui)
Genie.isrunning(:webserver) || up()

Versions:

• Julia 1.10.0
• GenieFramework v1.26.11 // tried v2.0.0 and same problem

[hhaensel]

That's the expected behaviour. If you want that the button is pressed right at the beginning, you should trigger it upon isready:

@app begin
    @in process = false

    @onbutton process begin
        @info "Button clicked"
    end

    @onchange isready begin
        process = true
    end
end

[svilupp]

Good to know, took me 2 hours of debugging! Thank you.

[hhaensel]

Sorry to hear that. Happy coding anyway. We're currently bringing Genie to Vue3/Quasar2 so stay tuned.

[svilupp]

Exciting!

@hhaensel, would you mint commenting on why does initialization value break everything?

It doesn't fit with my mental model of how Stipple works. When debugging, I saw that the HTML look correct (v- attributes), the VUE inspector looked correct, the generated model in .js looked correct, etc.

1) why does =true break its functionality? 2) where would YOU look to debug such issue?

Thank you!

[svilupp]

There is definitely something else going on - in past versions of StippleUI, I could use: @click("btn_reset=!btn_reset") inside a button, but that no longer works either. It must be @click(:btn_reset)

[essenciary]

@svilupp not sure what you'd expect to happen in your initial example. What happens is that you set process to true and the button's click also sets it to true. So when you click it, nothing happens.

---

where would YOU look to debug such issue?

Here I just looked in the browser's inspector: a) no errors b) process is already true

c) page source shows that onclick event does not change the value:

[essenciary]

There is definitely something else going on - in past versions of StippleUI, I could use: @click("btn_reset=!btn_reset") inside a button, but that no longer works either. It must be @click(:btn_reset)

You can still use that. Per my tests snippets:

@onbutton process begin
    @info "Button clicked"
end

@onchange process begin
       @info "Changed"
end

function ui()
       btn("Send", @click("process = !process"))
end

However I see something weird @hhaensel

a) initially process is true b) upon click, only the changed handler is triggered, not the onbutton. Then process switches to false c) after that, changed gets triggered twice (presumably changing process twice which stays false, never becoming true)

REPL output:

Console output:

[hhaensel]

That's all normal, I'd say. @onbutton looks for a switch from false to true, executes the handler and sets the button back to false. If you'd print "changed to $process" you would see that.

[hhaensel]

If you want a different behaviour, use the @onchange process and do the handling yourself.

[hhaensel]

When you set loading = :process the button starts spinning and waits for being set to false. I think in that case you cannot change the buttons's state by clicking.

[svilupp]

Closing as answered! Thank you