I have a page which has a iframe inside it, I want to execute some code when a DIV node is inserted in that iframe:
this code works inside firefox (version 82.0.2)
const innerObserver = new MutationObserver(function (mutations_list) {
mutations_list.forEach(function (mutation) {
mutation.addedNodes.forEach(function (node) {
if (node.tagName == 'DIV' && node.className.indexOf('onlyoffice') >= 0) {
console.log('[OnlyOffice Macro]: UI element insertion detected!')
innerObserver.disconnect()
node.setAttribute('id', uuid())
const fileName = node.getAttribute('data-filename')
listAttachments(node, `${fileName}.docx`)
}
})
})
})
const outerObserver = new MutationObserver(function (mutations_list) {
mutations_list.forEach(function (mutation) {
mutation.addedNodes.forEach(function (node) {
if (node.tagName == 'IFRAME' && node.className.indexOf('cke_wysiwyg_frame') >= 0) {
outerObserver.disconnect()
const iframe = node
iframe.contentWindow.addEventListener('DOMContentLoaded', onCKEditorFrameLoaded, true)
function onCKEditorFrameLoaded(ee) {
innerObserver.observe(iframe.contentWindow.document, { subtree: true, childList: true })
}
}
})
})
})
require(['jquery', 'bootstrap', 'http://172.25.161.211/web-apps/apps/api/documents/api.js'], function ($) {
outerObserver.observe(document.querySelector('body'), { subtree: true, childList: true })
})
but not work in chrome(version 95.0.4638.69), even a div node with class 'onlyoffice' is already been rendered on screen, but chrome won't print anything on console.
do you have any idea what may cause the difference ?