Remove Element elements by CSS injection
instead of DOM manipulation. React does not like external DOM manipulation.
This commit is contained in:
parent
95481a289b
commit
119c2251d2
|
@ -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()
|
||||
// remove elements by CSS injection
|
||||
const styleElement = elementWebFrame.contentDocument.createElement('style')
|
||||
styleElement.innerText = `
|
||||
.mx_LeftPanel_outerWrapper {
|
||||
display: none !important;
|
||||
}
|
||||
})
|
||||
observer.observe(matrixchat, observerConfig)
|
||||
.mx_NewRoomIntro {
|
||||
display: none !important;
|
||||
}
|
||||
.mx_ToastContainer {
|
||||
display: none !important;
|
||||
}
|
||||
`
|
||||
elementWebFrame.contentDocument.head.appendChild(styleElement)
|
||||
}).catch(console.error)
|
||||
},
|
||||
},
|
||||
|
|
Loading…
Reference in a new issue