Top-level functions in playground are inaccessible to HTML

I don’t have a playground demo for this.

I can no longer create/add html elements with onclick=“topLevelFunction()” when topLevelFunction is defined in the javascript alongside createScene.

It looks like elements created in JavaScript can use addListener, but adding “onclick” to the element doesn’t work (“topLevelFunction undefined”)

Is there a workaround?

I think the recent addition of export for createScene means that there is a corresponding import within the playground. And that hid the top level functions from HTML elements.

Cc @knervous

You can make this work by defining those functions on the window object. e.g.

function doSomething() {

 // run some code
}

window.doSomething = doSomething;

And any externally defined HTML with anonymous entrypoints like

<button onclick="doSomething()">my button</button>

Will work. I’m interested in the use case here, is it an external UI library you’re using or hardcoding html and adding it to the DOM? Would another UI framework be easier to work in, i.e. if React were available directly as a module would you use that?

1 Like

I’m not very sophisticated. My use case is “hardcoding html and adding it to the DOM” within the playground.