[Q/A] How to inject UI on DOM event?

[MBoui]

I would like to be able to execute the mountShadowHost when an events is trigger on the page DOM.
Can someone point me in a good direction?

Thanks,

[louisgv]

You can use the undocumented/barely documented render function, see this PR for more deet:

We're somewhat swamped atm so documentation will be delayed a bit ;d...

#260

[killix]

@louisgv 🙏 i am also interested :)

[louisgv]

I can see the click is trigger multiple time, the plasmo-csui are also inject in the anchor, but the component is mounted only one time. Any idea?

I'd override the render function since that's what ultimately controls the render queue to unmount/mount stale components. Thanks for sharing the code! To figure out when getRootContainer get triggered, you can take a look at the csui template included within plasmo - it basically get run within the built-in render.

[MBoui]

How we can override the render function with svelte?

[MBoui]

@louisgv 🙏

[louisgv]

@MBoui export const render = () => {} should do the trick. Check docs: https://docs.plasmo.com/browser-extension/content-scripts-ui/life-cycle#custom-renderer