Best IT Recipes

Apply Greasemonkey / Tampermonkey / userscript to iframe?

The name is pretty much:

Can I add a Greasemonkey script to an iframed site?

If so, how?

Thank.

+13
greasemonkey iframe tampermonkey userscripts
Jun 03 '16 at 14:19
source share
3 answers

In Greasemonkey (And Tampermonkey and most user scripts), a script automatically runs an iframe if it matches the @include , @exclude and / or @match directives .
And, a popular question is how to stop Greasemonkey from starting iframes .

So, if your script has a match:

@match https://fiddle.jshell.net/*

It will run on the jsFiddle "output" pages, regardless of whether they appear in the frame or not.



If you want to use only simple content:

Then you would check the window.self property.
For example, suppose you had a landing page, for example:

 <body> <h1>I'm some webpage, either same-domain or not.</h1> <iframe src="//domain_B.com/somePath/somePage.htm"> ...

Then you can use the script as:

 // ==UserScript== // @name _Fires specially on domain_B.com iframes // @match *://domain_B.com/somePath/* // ==/UserScript== if (window.top === window.self) { //--- Script is on domain_B.com when/if it is the MAIN PAGE. } else { //--- Script is on domain_B.com when/if it is IN AN IFRAME. // DO YOUR STUFF HERE. }


Important:

With the release of Greasemonkey 4, iframes handling is severely limited (and many others are also broken).
It still works properly with Tampermonkey, Violentmonkey, and almost all other usercript engines.
It is strongly recommended ( including Greasemonkey itself ) not to use Greasemonkey 4 or later.

+15
Jun 03 '16 at 22:12
source share

Note that if you are creating a chrome extension for your user, you also need to add "all_frames": true to your manifest or the extension will not work iframes.

Example:

 "content_scripts": [ { "matches": ["*://*/*"], "all_frames": true, "js":["dont.js"], "run_at":"document_start" } ]
0
Feb 06 '18 at 10:28
source share

This solution is for cases where the iframe no place to run @include or @match .

This works with Greasemonkey 4.

We must wait for each frame to load before we can work with it. I do this with waitForKeyElements.js , which expects elements matching a given CSS selector, just as looking for matches in document.querySelectorAll("selector") , and then applies this function to the response:

 // ==UserScript== // @include https://blah.example.com/* // @require https://git.io/waitForKeyElements.js // ==/UserScript== function main(where) { // do stuff here with where instead of document // eg use where.querySelector() in place of document.querySelector() // and add stylesheets with where.head.appendChild(stylesheet) } main(document); // run it on the top level document (as normal) waitForKeyElements("iframe, frame", function(elem) { elem.removeAttribute("wfke_found"); // cheat wfke been_there, use our own for (let f=0; f < frames.length; f++) { if (!frames[f].document.body.getAttribute("been_there")) { main(frames[f].document); frames[f].document.body.setAttribute("been_there", 1); } } });

Note that the selected item is just a placeholder indicating that the iframe loaded. We remove the tracker “been there” from waitForKeyElements because the frame can be loaded again later (we cannot just use this iframe because its contents are loaded elsewhere).

When we know that the frame is loaded, we iterate over each frame and look for our marker, an HTML attribute in the body frame called been_there (for example, <body been_there="1"> ). If it is missing, we can run our main() function on the frame document. When we finish, we will add the been_there attribute been_there that we no longer start.

0
Apr 24 '19 at 19:32
source share


More articles:


All Articles