I visit a site often that has a "click to change to dark theme" button. The dark theme is much easier to read, so I have to click the link every visit (history cleared on close).
I'm on a local Linux box with Firefox; so Javascript, HTML, Python and Bash are available.
I'm focused on a Bookmarklet as it seems like the right way - however, nothing I'm doing is working. I'm not versed in Javascript so it's been days looking up and trying examples. It may not be possible as a Bookmarklet, so perhaps there is another way around?
Bookmarklet - Set Then Go
Here's what I have:
javascript:document.cookie="theme=dark; domain=example.org; path=/;"; location.href="http://www.example.org";
It works if it's only the cookie, and it works if it only loads the site - but not both. I'm ok with programmatically going to the page first, setting the cookie, then reloading but that doesn't work either. I'm not wanting to click two links. "example.org" is how the cookie is stored for a normal visit, and I'm ok with the cookie only lasting for that session.
Persistent Cookie
I can't get Firefox (IceCat) to keep the cookie. I set it under Exceptions to allow, but nothing keeps it unless both "Keep cookies until they expire" and "Cookies" is unchecked for removal after close. Doing that keeps all cookies from everywhere which I'm not wanting to do.
Permanent Cookie
I'd tried setting the cookie in an immutable file - but Firefox doesn't keep cookies there anymore. They are in SQLite. Maybe there's a way to set a flag on the row so it's never removed? User.js and prefs.js don't seem to apply - but shouldn't it be possible to set the cookie in prefs.js or user.js that would set it for each browser load thereby creating a 'permanent cookie'?
Bookmarklet - Go Then Click
Another thing I tried was to open the page, then click the link programmatically to load the dark theme:
javascript:location.href="http://www.example.org";document.getelementbyid('Dark').click();
The ID is known and in the form of a non-valid anchor (no href). The site's javascript seems to be listening for a click event. Here is what they have:
$('#Dark').click(function(){
document.cookie='theme=dark; domain=.example.org; path=/';
window.location.reload(true);
});
So shouldn't it be as simple as setting an environment variable then loading the site - maybe JS doesn't have environment vars?
Inject It And Forget It
I read that it was possible to inject style into the head of the page, so I tried to inject:
<script>document.getelementbyid('Dark').click();</script>
via the Bookmarklet which seems like it should work as the click would be in a local context. I could never get it to inject, but again, I don't know Javascript.
Last Resort
If nothing above is possible, could it be done with bookmark to a local .html file that sets the cookie for the given domain then redirects to the site? A last ditch solution that is not preferred would be an actual script (.sh/.py)?
I don't want to share the site, and I don't want to not clear history on exit. Neither are due to what you're probably thinking. :)
I'm here because I'm wanting a Javascript solution (a bookmark), but I'm not good at Javascript - so all the examples above might work with tweaking, I'm just doing it wrong.
Thanks all for any help!! If you can fix it - could you also explain why what I had doesn't work?
Below is a try to explain rather than an answer.
Let's assume that you are already at the target page. Do the following bookmarklets work for you?
This:
javascript:(function() {
document.getElementById('Dark').click();
})();
or this one:
javascript:(function() {
document.cookie='theme=dark; domain=.example.org; path=/';
window.location.reload(true);
})();
I eventually figured out a cookie's initial entry can only be set by the domain, as a measure against XSS. So the answer to my question is it's not possible.
The simplest work around is to use an Add-On followed by userContent.css.
It would of been nice to set the theme preference (cookie) before loading the page - but I can see why the rule's in place..
It takes the same amount of clicks to go to the site and click "Change To Dark Theme" as it would if JS was used (open the site [1st click], set the cookie and reload [2nd click]).
Related
the requeirment is that I want to avoid the specific web page to save to bookmark,
and is there someway to acheive this funcion just use some code, maybe add or js code . thanks
The answer is no, the user can always bookmark a page as this is browser function, but you can use sessions. Then make sure that any request for a page
must have an active session id or it returns an error or redirects to the home page. The user can bookmark the page but the bookmarks will then only work for a short time (until the session expires). This also has the added benefit of
making the site impossible to index by search engines.
The closest you're going to get is if you open another window using JavaScript as you can control whether the menubar and toolbar are displayed.
window.open(
"https://www.google.com/",
"Google",
"resizable,scrollbars,status");
However, this is likely going to be blocked by their popup blocker.
So I like to analyze websites and try to figure out how they work.
I came across this website.
http://us.battle.net/d3/en/forum/
They have a button that minimizes and maximizes divs. AND it remembers if you left it minimized or maximized, regardless if you're logged in or not. (it's browser specific, i.e. it only remembers based upon the brower you used.)
I see they're calling some javascript on this, but how is this done? Using cookies? I doubt it's being done with sessions since when I log in/out it doesn't affect it.
Thanks.
They are using the cookie forumParentToggle. This cookie is created the first time you expand or collapse a div.
For example, if you collapse the "Classes" div, the cookie is created with the value 3354995.
By deleting this cookie, the Classes div will be re-expanded when the page is refreshed. To the browser, it looks like you are visiting for the first time.
This cookie is referenced in the minified version of javascript they are utilizing here.
I am trying out popstate and pushState and I am wondering how to handle off page navigation.
Lets say I have an index page which generates a 'new page' when clicking something and it's loaded in with ajax. With popstate I change the url. In the page loaded are links that go outside of the current 'index' page. When somebody presses back they get a dumped state object.
How to prevent it so it actually loads the url that was given during the pushState?
Thanks in advance.
It seems you're doing something that causes the browser to replace its cached version of your index page with something else. Make sure your server sets the
Vary: Accept
header when returning the index page and later requests. See this Chromium issue for more information.
Have the link also use an anchor so the browser has a reference to fall back on.
Throw one of these at the beginning of each of the pages with a unique name attribute.
So your links would be:
Load the first page
and the page HTML would have this at the top somewhere:
<a name="first"></a>
Funny you made this post cuz I've got the exact same problem right now with this site I just started making yesterday: http://asims.fleeceitout.com - had to put arrows everywhere to keep people from gettin lost haha. I'll end up taking my own advice here but I'm too lazy for now. Plus I'm trying to see how much of the site I can make without a single <a></a> used.
I would like to make a bookmarklet to open google chrome's settings panel and clear my cache with a single click.
For a while now, Ive had a bookmark that opens chrome's settings panel with the 'clear cache' setting already selected. After clicking the bookmark (normally opening it in a new tab) I have to then opent the tab and submit the form. However, when developing this is a task I have to do quite often and these several repeated steps just seem unnecessary.
This link opens the page to clear one's cache (obviously for Chrome users only): chrome://chrome/settings/clearBrowserData#cache
I recently discovered bookmarklets and thought it would be a good way to accomplish the task of clearing my cache with a single click. However, I've discovered that putting even a basic javascript sample in the address bar when on the settings page (linked above) fails to work.
For example, this works in the address bar on any given page, but not from the chrome settings page:
javascript:alert('hello stackoverflow');
Is there a way to execute javascript from the chrome settings page? Are there other options? Im looking for any route to achieve this goal and would love to learn something along the way, even if it means doing some evil. :)
add a bookmark:
javascript:document.write('<form onsubmit="window.open(\'javascript:\'+js_line.value, \'target\');return false;">javascript:<input type=text name=js_line style="width:90%;"/></form><iframe src="" name="target" style="width:100%;height:90%;"/>');
What you want might not be fully possible through a bookmarklet, but it's certainly possible with a Chrome App. There is an app Clear Cache already. I find it pretty useful.
This is a very urgent problem and I'd be forever indebted to anyone who can lend some insight.
I'm going to be deploying a widget (called the "ISM") to a third-party site. That site uses the document.domain JavaScript property to relax cross-domain restrictions (e.g., setting document.domain in "a.example.com" and "b.example.com" to both "example.com" so they can access each other's DOMs).
This causes problems with my script in Internet Explorer due to the way that I construct an <iframe> that is used to display my widget's HTML content. In Internet Explorer, using document.domain on a page, and then creating an <iframe> with JavaScript, will cause you to be immediately "locked out" of the <iframe> - i.e., you can create it, but it's not created in the correct document.domain, so you're not able to access its DOM due to security restrictions. This isn't a problem in any other browser.
To see what I'm talking about, load this page in IE:
http://troy.onespot.com/static/3263/stage1.html
You should see a JavaScript error: "Access is denied."
To get around this, I'm setting the dynamically created <iframe>'s "src" attribute to load a static HTML file that's hosted in the same domain (different subdomain), and setting its document.domain property to the appropriate value:
http://troy.onespot.com/static/3263/stage2.html
That gets around the security issue, and lets me write the document I originally wanted to write to the <iframe>:
http://troy.onespot.com/static/3263/stage3.html
With that document in place, my widget does some polling to our server to get some HTML content that I want to insert into another <iframe>, which will be visible to visitors of the parent page. I've roughly simulated that here (using static content, not actually contacting our server):
http://troy.onespot.com/static/3263/stage4.html
Here comes the problem. When I get that HTML content and insert it into the second <iframe>, I now face an unusual issue with a broken "Back" button. This happens in Firefox 3.0 and all version of IE (possibly other browsers), though it does not happen in some browsers I've tested (Firefox 3.5, Safari, Chrome). See this page:
http://troy.onespot.com/static/3263/stage5.html
If you click the "Google" link, all seems fine. But, when navigating back to the previous page (that has the latter test script), another JavaScript error is introduced: "Permission denied." This does not terminate the script, and does not appear to have any ill effects, other than the fact that I assume it's connected to the broken "Back" button functionality, which is a very big problem - the one I'm desperately trying to solve. I'm at a loss to debug this error since its call stack starts and stops in the jQuery script.
You can also encounter this error - with more serious symptoms - by going to the last link above (stage5.html - clear your browser cache first). Click the "Stage 5 (Again)" link, then, after that page has loaded, click the "Back" button.
The "Back" button is completely broken! You can't go anywhere except to another URL.
This is the problem that I need to solve as soon as possible. Any insights or help would be extremely appreciated!
I can't deviate from this method too much, so outside-the-box suggestions are definitely welcome, but I may not be able to use them due to the constraints of the widget's specifications. I would prefer to understand why the "Back" button is breaking and how to fix it, along with the "Permission denied" error related to jQuery.
It's really hard to try out fixes for this because of the multiple domains. One thing I've heard is that IE treats a blank src or "about:blank" as a different domain, but it treats 'javascript:""' as the same domain. Have you experimented with changing stage one to set the iframe src to things like:
iframe.src = 'javascript:""'
Or:
iframe.src = 'javascript:parent.getFrameHTML()'
Part of the problem seems to be that IE (at least IE 7) adds two entries to the history named "Domain" when I click on the "Stage 5 Again" link. When you use the little drop-down arrow next to the Back button you'll see the history of pages allowing you to step back more than one step. I see the previous two entries are listed as "Domain" and clicking either of those brings me to the same page. The fourth spot (after Current Page, Domain, Domain) is the correct "ISM Back Button" link to the original stage5.html page.
So the problem isn't exactly that the back button doesn't work, but just that the entries in the history are added and so the back button takes you to the wrong place. I don't have an answer as to why those "Domain" entries are being added to the history, but hopefully this helps point you in a useful direction.
Good luck!