Detect click event inside iframe

Question

I\'m writing a plugin for TinyMCE and have a problem with detecting click events inside an iframe.

From my search I\'ve come up with this:

Loading iframe:

Answer 1

In my case, I was trying to fire a custom event from the parent document, and receive it in the child iframe, so I had to do the following:

var event = new CustomEvent('marker-metrics', {
    detail: // extra payload data here
});
var iframe = document.getElementsByTagName('iframe');
iframe[0].contentDocument.dispatchEvent(event)

and in the iframe document:

document.addEventListener('marker-metrics', (e) => {
  console.log('@@@@@', e.detail);
});