Remove Element elements by CSS injection

instead of DOM manipulation.
React does not like external DOM manipulation.
This commit is contained in:
Ben 2022-04-30 16:28:24 +02:00
parent 95481a289b
commit 119c2251d2
Signed by: ben
GPG Key ID: 0F54A7ED232D3319
1 changed files with 14 additions and 12 deletions

View File

@ -136,18 +136,20 @@ export default {
room_id: matrixInfoResponse.data.matrixChatRoom,
}, true)
// removes left panel by DOM manipulation
const matrixchat = elementWebFrame.contentDocument.getElementById('matrixchat')
console.debug(matrixchat)
const observerConfig = { attributes: false, childList: true, subtree: true }
const observer = new MutationObserver((mutationsList, observer) => {
console.debug('observer kicked', observer)
const leftPanelsByClass = elementWebFrame.contentDocument.getElementsByClassName('mx_LeftPanel_outerWrapper')
for (const leftPanel of leftPanelsByClass) {
leftPanel.remove()
}
})
observer.observe(matrixchat, observerConfig)
// remove elements by CSS injection
const styleElement = elementWebFrame.contentDocument.createElement('style')
styleElement.innerText = `
.mx_LeftPanel_outerWrapper {
display: none !important;
}
.mx_NewRoomIntro {
display: none !important;
}
.mx_ToastContainer {
display: none !important;
}
`
elementWebFrame.contentDocument.head.appendChild(styleElement)
}).catch(console.error)
},
},