Greasy Fork

Make it work on dynamically added content

Currently the script doesn't work on content loaded dynamically - for example on sites with endless scroll.

Do you have an example url? I have been considering trying to make it work on google+ but the site already has varied video size and it would mess with the layout of the page.

Click the bluish Comments icon under the first post here (KIESZA - HIDEAWAY COVER video), the new content will be injected into the page with a few embedded youtube videos in it.

Ok I see. This is because the script is executed on every page load. I am not sure how to get it to execute on that content, i think i may need an additional option to reexecute the script after the comments have been loaded. I will look in to how this can be done.

A mutation observer might do the trick, works in Chrome too, doesn't slow down browsing experience.

var ob = new MutationObserver(function(mutations){
  for (var m, i=0; i<mutations.length && (m=mutations[i]); i++)
    for (var nodes=m.addedNodes, n, j=0; j<nodes.length && (n=nodes[j]); j++)
      embedTweak(n);
});
ob.observe(document, {subtree:true, childList:true});

if (document.body)
  embedTweak(document.body);

function embedTweak(node) {
..........
your code
..........
}

Note that the first document should be replaced with node:

    risky_elements = node.getElementsByTagName(risky_tags[i]);

Thanks. That works great. I have added to the script and updated it.

I just found a relatively popular site that dumbly modifies the text of an element with current time almost 100 times per second so the mutation observer is called every time only to fail on node.getElementsByTagName overfilling the js console with error messages, here's a fix:

    for (var nodes=m.addedNodes, n, j=0; j<nodes.length && (n=nodes[j]); j++)
      if (n.nodeType == Node.ELEMENT_NODE)
        embedTweak(n);

I noticed the errors in the console but it still worked, so thought it was just a warning. Thanks for fix.