I have the following fairly basic greasemonkey script:
var newloc = location.href.replace(/^(.*)-xyz-(.*)$/i, "$1$2");
if (newloc != location.href)
location.href = newloc;
That is, it basically strips out "-xyz-" from the URL and loads the page again. So if you navigate to "www.example.com/a-xyz-b/" it'll reload the page at "www.example.com/ab/".
Now, the script work fine if the page is an HTML page. But if I open a .jpg file or something that's not HTML then the script does not run at all.
Is this just a limitation of greasemonkey? That it only works if the page is actually text/html? What is an alternative way this functionality could be done?
Yes, Greasemoney fires on the DOMContentLoaded event, which doesn't seem to trigger on media objects (no DOM).
Get around this by firing on the parent/referrer pages and changing the links there.
Or, if the file names are on the local machine, use a text editor or batch job to rename/rewrite the links/names.
If neither of these workarounds is viable, post the specific details of how you are feeding these URLS to FireFox (name the browser in use if it's not FF).
Related
I need to be able to inject javascript into my page to run before anything else does.
My use case is collecting debugging events from event listeners that start firing when my application begins booting.
Using a content_script with a Chrome extension is one way, however I want to be able to support cases that don't use a Chrome extension.
So far I have been using a proxy server that rewrites the index.html, replacing <head> with <head><script>console.log('hi')</script> but that solution is inaccessible and impractical.
Is there a way to inject javascript into a page so the next time you refresh it that code runs before anything else does?
Perhaps manually editing the html in the sources panel (does that persist)?
I've tried several methods, especially all listed here:
Button that refreshes the page on click
Force page reload with html anchors (#) - HTML & JS
...but they all seem to only trigger a reload using local cache.
Is there any way to trigger a forced reload, bypassing any cache (especially for images) via an HTML button?
Alternatively, is there a line of HTML code that would force the page to not use cache at all?
The page is a simple static html page that changes a few times a day.
There is no HTML-only way to do it.
You could try using window.location.reload(true) which will try to reload the current page and ignore cache files on some browsers. But this is not part of the specification and won't work on most browser (https://developer.mozilla.org/en-US/docs/Web/API/Location/reload)
The real way to make it is to version your filenames ! There are many tools to do it quite easily. When the page will refresh, as the name will have changed, your browser is going to load the new file and you won't have cache problem anymore
I'm pretty sure it's not possible to force reload (+ clear cache) in HTML itself.
One solution is to make a button and give that a JS function, in which both the cache is cleared and the page reloaded.
function reloadClear() {
window.localStorage.clear();
window.location.reload(true);
return false;
}
just remove localstorage saved files use window.localstorage.remove('name of the item you saved')
or if you didnt what all of them just use window.localstorage.clear() then reload it with window.location.reload(true)
I just tried something rather trivial: get the source code of a web page (by saving it) and count how often a certain phrase occurs in the code.
Turns out, it doesn't work if that page uses Polymer / web components. Is this a browser bug?
Try the following: Go to http://www.google.com/design/icons/ and try to find star_half in the code (the last icon on the page). If you inspect the element inside of Chrome or Firefox, it will lead you to
<i class="md-icon dp48">star_half</i>
but this won't be in the source if you copy the root node or save the html to disk.
Is there a way to get the entire code?
Reason for this behavior is probably how source viewing( and source saving as well?) works for browser and because shadow roots are attached to web components on the client side.
When you press ctrl-u on a web page, browser essentially does a network call again on the same url to fetch a copy of what server returned when you hit that url.
In this case, when this page renders, browser identifies the component icons-layout and then executes code to attach a shadow-root to this node. All of this happens when your page reaches the client(browser).
When you are trying to save this page, you are saving what server returned not current state of the page. You'll see same behavior if you fire up chrome console and try to save an icons-layout node.
Is there a way to get the entire code?
I don't know how to do it from browser but phantomjs provides a way to save client side rendered html.
Does greasemonkey or tampermonkey have functionality that lets me edit the raw HTML response before it gets passed to the browser?
I'm trying to do this in an attempt to modify an inline script before it executes. This solution must work on both Firefox and Chrome so something like beforescriptexecute won't work because chrome doesn't support it yet.
If not, is there an extension that does provide this functionality that is available to both browsers?
Quick answer: No.
Longer answer: Tampermonkey and Greasemonkey operate on editing the page has loaded, not at any time prior to that. So, preventing a script from executing isn't going to happen. Neither of these tools can change the code before it's run, it only alters once it has run and can inject certain scripts into the page after it's loaded that affect the data displayed or the appearance. The best you could do is update or replace what's displayed based on the inline script, but it's still going to get sent initially.
I am trying to make a Chrome extension for personal use that makes all the password fields type="text", so I can see the clear passwords. (I know that I can probably find something like this in the Chrome store, but it's something I want to do myself).
I am however having a hard time accessing the actual page content (the page I'm viewing in the tab). If I do
document.getElementById('text')
this selects the element from background.html not the page I'm viewing. How can I access the actual page?
Also, is there a way I can include an external javascript file so I can use functions from there?
You would need to use content script - javascript file injected into an actual page with access to DOM and events.