CODEWITHSUNDEEP
goprogressive-web-appsgo-wasmgo-app
ginad
ginad

Reputation: 1985

How can I execute javascript codes in go-app component

I'm starting a new project and saw a very interesting library for GO which is somewhat similar to fasthtml called go-app.

I'm struggling to execute simple JS commands like console.log or alert. Or am I missing something?

type Button struct {
    app.Compo
}

func (b *Button) OnClick(ctx app.Context, e app.Event) {
    // NONE of these codes works when clicking the button.

    //e.JSValue().Call("alert", "e jsvalue call Button clicked!")
    //ctx.JSSrc().Call("alert", "ctx jssrc call Button clicked!")

    //app.Window().Get("alert").Call("window get call Hello world")
    //app.Window().Call("alert", "window call Button clicked!")
    app.Window().Get("console").Call("log", "window get call log")
}

func (b *Button) Render() app.UI {
    return app.Button().
        ID("button").
        Text("Click me!").
        OnClick(b.OnClick)
}

Upvotes: 1

Views: 49

Answers (2)

Sahadev
Sahadev

Reputation: 1493

Here I can see you are using web assembly but based on your current implementation I can suggest to check on firebase browser about we assembly compatibility or there are some version mismatch in go language.

I am giving some updated code for checking that browser supporting web assembly or not. you check it:

package main

import (
    "fyne.io/fyne/v2/app"
    "fyne.io/fyne/v2/widget"
    "go-app"
)

type Button struct {
    app.Compo
}

func (b *Button) OnClick(ctx app.Context, e app.Event) {
    // Log to the browser console
    app.Window().Get("console").Call("log", "Button clicked!")

    // Call JavaScript alert
    app.Window().Call("alert", "Button clicked alert!")
}

func (b *Button) Render() app.UI {
    // Create a simple button with text and an event handler for click
    return app.Button().
        ID("button").
        Text("Click Button!").
        OnClick(b.OnClick)
}

func main() {
    // Make sure the WebAssembly (WASM) environment is ready
    if !isWasmSupported() {
        app.Window().Call("alert", "WebAssembly is not supported in this browser!")
        return
    }

    // Initialize the app and start the button component
    myApp := app.New()
    myApp.Run(Button{})
}

// Helper function to check WebAssembly support
func isWasmSupported() bool {
    // Check if the browser supports WebAssembly
    wasmSupport := app.Window().Get("WebAssembly")
    if wasmSupport == nil {
        return false
    }
    return true
}

Upvotes: 1

Sahadev
Sahadev

Reputation: 1493

Try this if it will work:

type Button struct {
    app.Compo
}

func (b *Button) OnClick(ctx app.Context, e app.Event) {
    // Access the window object and call the alert function
    app.Window().Call("alert", "Button clicked alert!")

    // Or directly access console.log from the window
    app.Window().Get("console").Call("log", "clicked!")
}

func (b *Button) Render() app.UI {
    return app.Button().
        ID("button").
        Text("Click Button!").
        OnClick(b.OnClick)
}

Upvotes: 2

Related Questions