Native Browser APIs

Sometimes you need an API that does not have a named helper yet. Gothic gives you JS(), Window(), and Document() as direct entry points into the browser's global scope, plus ExecJS() to evaluate a raw JS string.

Important: You must dot-import pkg/wasm (import . "github.com/felipegenef/gothicframework/v2/pkg/wasm") for use these helpers, otherwise you will get a tinygo compile error.

Note: always prefer a named helper if one exists. Reach for JS() only when there is no helper for the API you need.

Walk the JS object graph with Get, Set, and Call on any JSValue.

// Read screen.width via the JS bridge
 width  :=  JS (). Get ( "screen" ). Get ( "width" ). Int ()
 SetText ( "viewport" ,  strconv . Itoa (width)) 

ExecJS evaluates a raw JS string. Only reach for it when no named helper covers your use case.

// Toggle dark mode on the body element
 ExecJS ( `document.body.classList.toggle("dark")` )

 // Trigger a download. There IS a helper for this, prefer it
 TriggerDownload ( "report.csv" , [] byte ( "a,b,c\n1,2,3" ),  "text/csv" ) 

Use JSValue.Call to invoke a method on any JS object.

Important: never pass a Go func() to JSValue.Call. It will not survive the bridge. Use AddEventListener for event handlers instead.

// Draw on a <canvas> via JSValue.Call
 canvas  :=  GetElementById ( "my-canvas" )
 ctx  := canvas. Call ( "getContext" ,  "2d" )
 ctx . Set ( "fillStyle" ,  "#ff0000" )
 ctx . Call ( "fillRect" ,  0 ,  0 ,  100 ,  100 )

 // DO NOT do this. Go func() does not cross the JS bridge:
 // btn.Call("addEventListener", "click", func(){})  WRONG
 // Use AddEventListener instead.
 btn  :=  GetElementById ( "my-btn" )
 AddEventListener (btn,  "click" ,  func () {
	 ConsoleLog ( "clicked" )
}) 

Now that you can reach any browser API, learn how to make your state stick around with localStorage, sessionStorage, and cookies!