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