CODEWITHSUNDEEP
javascriptgoogle-chrome-extensionfirefox-addondom-eventsmutation-observers
Arun Babu
Arun Babu

Reputation: 259

How to stop a new node being added to DOM using Chrome/Firefox extension?

I am writing an extension to detect some malicious behavior of some scripts. These scripts add some nodes into the DOM after page gets loaded. I am able to get these nodes using 

document.addEventListener("DOMNodeInserted", checkContents, false);

But how can I stop them from being loaded? Can this be done in Chrome or Firefox?

Upvotes: 2

Views: 164

Answers (1)

Noitidart
Noitidart

Reputation: 37238

Use MutationObserver with childList and subtree.

var grid = iframe.contentDocument.getElementById('newtab-grid');
var mobs = new iframe.contentWindow.MutationObserver(function(mutations) {
    mutations.forEach(function(mutation) {
        console.log(mutation.type, mutation);
        if (mutation.addedNodes && mutation.addedNodes.length > 0) {
            var link = mutation.target.querySelector('.newtab-link');
            if (link) {
                link.setAttribute('target', '_parent');
                console.log('set target on this el')
            } else {
                console.log('this ell has no link BUT it was an added el')
            }
        }
    });
});
mobs.observe(grid, {
    childList: !0,
    subtree: !0
});

now this will tell you when its addingNodes and it gives you what was added in mutation.addedNodes. you can iterate throuh that and remove what was added. I'm not sure if you can prevent it from adding, but you can definitely remove it after it was added.

https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver?redirectlocale=en-US&redirectslug=DOM%2FMutationObserver#MutationObserverInit

Upvotes: 2

Related Questions