Multiple #require directives - same path - tampermonkey

A user script that I have in Tampermonkey is simply a preamble that loads the script itself and a file with shared functions.
// ==UserScript==
// #name My User Script
// #grant none
// #match *://*/*
// #require file:///c:/path/to/my_user_script.user.js
// #require file:///c:/path/to/functions.user.js
// ==/UserScript==
Is it possible to "separate" the path from the filename in #require directives, so that it will be something like this?
// ==UserScript==
// #name My User Script
// #grant none
// #match *://*/*
// #require_path file:///c:/path/to
// #require my_user_script.user.js
// #require functions.user.js
// ==/UserScript==

Related

Is there a way to allow Tampermonkey to run on the chrome homepage?

I am trying to make an extension using the right click menu. I noticed that the menu didn't display on the Chrome homepage because Tampermonkey didn't run on it. This is my current code:
// ==UserScript==
// #name Go to Website.Net
// #namespace http://tampermonkey.net/
// #description Context menu to execute UserScript
// #version 0.1
// #author author
// #include *
// #grant GM_openInTab
// #run-at context-menu
// ==/UserScript==]
(function() {
'use strict';
GM_openInTab("https://website.net");
})();
Is there a way to allow Tampermonkey to run on the chrome homepage?

removing an element with a userscript

First attempt at a userscript, and despite finding numerous examples on the internet of how to remove elements from a page, none of them work (and this looks like one of the most basic applications of a userscript, too).
Using violentmonkey-2.12.8 on this page:
https://www.zerohedge.com/economics/2020-greatest-hits-most-popular-articles-past-year-and-look-ahead
I want to remove the "exitModalOverlay" div (disabling it in the developer tools does exactly what I want), which blacks out the page (preventing me from reading it).
I will insert one of the more common techniques I have found (which doesn't work). I would appreciate any method which does. Thanks.
// ==UserScript==
// #namespace confused
// #name zehohedge_remove_subscription_popup
// #version 1
// #description removes the overlay div that asks to subscribe
// #match https://www.zerohedge.com/*
// #grant none
// #noframes
// ==/UserScript==
var todelete = document.getElementById('exitModalOverlay');
if (todelete) { todelete.parentNode.removeChild(todelete); }
Based on the post & comments, it seems the element is loaded/created after the DOM. In that case, you would need to run the script after page loading is complete.
Although when testing on the link provided with JavaScript enabled (https://www.zerohedge.com/economics/2020-greatest-hits-most-popular-articles-past-year-and-look-ahead), the element does not appear, here is an example of how you can remove the item.
It is possible there are other factors involved (e.g. browser, country, login, cookies etc).
ViolentMonkey by default runs on document-end which is after DOM loaded but before all external elements are loaded.
Setting the userscript to run at document-idle will run after everything is loaded.
// ==UserScript==
// #namespace confused
// #name zehohedge_remove_subscription_popup
// #version 1
// #description removes the overlay div that asks to subscribe
// #match https://www.zerohedge.com/*
// #grant none
// #noframes
// #run-at document-idle
// ==/UserScript==
// find element
const todelete = document.getElementById('exitModalOverlay');
// remove element if found
if (todelete) { todelete.remove(); }
Removing the element is not the only way to get rid of an element. You can also use CSS to achieve a similar outcome by setting its display to none. For example:
// ==UserScript==
// #namespace confused
// #name zehohedge_remove_subscription_popup
// #version 1
// #description removes the overlay div that asks to subscribe
// #match https://www.zerohedge.com/*
// #grant GM_addStyle
// #noframes
// ==/UserScript==
const css = `
#exitModalOverlay {
display: none;
}`;
GM_addStyle(css);
Using JavaScript to apply CSS to the element without GM_addStyle (although not as good as above)
// ==UserScript==
// #namespace confused
// #name zehohedge_remove_subscription_popup
// #version 1
// #description removes the overlay div that asks to subscribe
// #match https://www.zerohedge.com/*
// #grant none
// #noframes
// #run-at document-idle
// ==/UserScript==
// find element
const todelete = document.getElementById('exitModalOverlay');
// remove element if found
if (todelete) { todelete.style.display = 'none'; }
📌 It is worth noting that CSS applies all the time (unless over-written specifically), even if an element is created later, while JavaScript applies at the time it runs and will not apply to elements created later (without additional methods to cause it to run again).
Maybe so...
window.onload = function() {
var todelete = document.querySelector('#exitModalOverlay');
todelete.outerHTML = '';
}
or
window.onload = function() {
var todelete = document.querySelector('#exitModalOverlay');
todelete.remove();
}

How Do I Make A Tampermonkey Userscript Replace Words In Text Files?

6 years ago I asked a question about rewriting text files displayed in a browser using greasemonkey.
Can I Make Greasmonkey Scripts Run On Text Files?
I am now coming back to a similar problem and I tried to paste it in to Tampermonkey but it doesn't replace the text.
What am I doing wrong here?
// ==UserScript==
// #name Rewrite LLVM License
// #namespace http://tampermonkey.net/
// #version 0.1
// #match http://llvm.org/releases/2.8/*
// #include http://llvm.org/releases/2.8/LICENSE.TXT
// #require http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// #grant none
// ==/UserScript==
(function() {
//Just to tell the linter that $ is defined in jquery
/* global $ */
//Browsers display text in a pre tag
var pageTextNd=$("body > pre");
//Replace the text LLVM
var newPageTxt=pageTextNd.text().replace("LLVM", "Ernst Blofeld");
//Rewrite the page
pageTextNd.text(newPageTxt);
})();
It looks like the page you're interested in redirects to:
https://releases.llvm.org/2.8/LICENSE.TXT
so that's what you need to set your #include or #match to.
You also want to replace all instances of LLVM, so use .replaceAll:
// ==UserScript==
// #name Rewrite LLVM License
// #include https://releases.llvm.org/2.8/LICENSE.TXT
// #require http://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
// #grant none
// ==/UserScript==
(function() {
//Just to tell the linter that $ is defined in jquery
/* global $ */
//Browsers display text in a pre tag
var pageTextNd=$("body > pre");
//Replace the text LLVM
var newPageTxt=pageTextNd.text().replaceAll("LLVM", "Ernst Blofeld");
//Rewrite the page
pageTextNd.text(newPageTxt);
})();
If you don't want to rely on replaceAll, use a regular expression with .replace instead: /LLVM/g.
It seems quite strange to rely on jQuery for something this trivial though - you can very easily accomplish this without a library:
// ==UserScript==
// #name Rewrite LLVM License
// #include https://releases.llvm.org/2.8/LICENSE.TXT
// #grant none
// ==/UserScript==
const pre = document.querySelector('body > pre');
pre.textContent = pre.textContent.replaceAll('LLVM', "Ernst Blofeld");

How load a local CSS file to specific site

I'm looking for a way to make the function GM_addStyle add CSS straight from the #resource on my local drive (I use macOS). My goal is to speed up the development of this CSS file.
Right now I'm copy&pasting changes to Tampermonkey > saving the userstyle & reloading the page.
Not working:
// ==UserScript==
// #name my style
// #version 0.1
// #description a few friendliness tweaks
// #author thomas
// #match http://stackoverflow.com/*
// #resource my_style file:///Users/thomas/style.css
// #grant GM_addStyle
// ==/UserScript==
(function() { 'use strict'; GM_addStyle(GM_getResourceText('my_style')); })();
Thanks

Tampermonkey script not auto-updating

At the top of my script I have the following:
// ==UserScript==
// #name Test script
// #description testing auto-update
// #namespace http://tampermonkey.net/
// #author newbie
// #version 1.0.0
// #updateURL https://github.com/mygithubaccount/test/raw/master/test.user.js
// #downloadURL https://github.com/mygithubaccount/test/raw/master/test.user.js
// #match http://awebsite.com/*
// #run-at document-end
// #grant GM_getResourceText
// #grant GM_addStyle
// #grant GM_xmlhttpRequest
// #grant GM_getResourceURL
// #grant GM_xmlhttpRequest
// ==/UserScript==
Please note that these values are just for example.
When I make changes on the script and increase the version number on github and then push the changes to master it updates the raw script link, however I don't get auto-updates from Tampermonkey as in popups saying the script has an update. It will only update if I manually go to the link and reinstall the script to update it.
How can I make this auto-update with popups?
I am not an expert at userscripts, can only tell from my experience making TamperMonkey work:
In order for TamperMonkey to update, I had to copy&paste the URL into Update URL: on the script's Settings tab:
(Make sure ☒ Check for updates is turned on, obviously.)
Then if you manually Check for userscript updates on the TamperMonkey icon, you should see a proper popup.

Resources