How to propagate mouse events?

[raunakdoesdev]

Thanks for this great work! One requirement I have is to propagate mouse events upwards from out of the iFrame. I understand this might not be implemented in the library already, would it be possible to point me to some relevant sources for trying to implement this?

[ryanseddon]

You can propagate events from the iframe but you need to manually do that in the event call back itself e.g.

const frameClick = () => {
  console.log("click event inside iframe");
  const btn = document.getElementById("btn");

  // Create a synthetic click MouseEvent
  let evt = new MouseEvent("click", {
    bubbles: true,
    cancelable: true,
    view: window
  });

  // Send the event to the button element
  btn.dispatchEvent(evt);
};

// JSX
<Frame>
    <button onClick={frameClick}>Click</button>
</Frame>

That would trigger a click event on the parent button when clicking the frame button.

See demo