Ask HN: What bookmarklets do you use?

19 pointsdannyphantom1y ago20 comments

Threw together a bookmarklet that sends a page over to a personal, private subreddit the other day that I've been using a ton. Also a HUGE fan of kill-sticky.

Would love to throw some other good ones up there.

https://github.com/t-mart/kill-sticky

  javascript:(function()%7Bdocument.querySelectorAll(%22body%20*%22).forEach(function(node)%7Bif(%5B%22fixed%22%2C%22sticky%22%5D.includes(getComputedStyle(node).position))%7Bnode.parentNode.removeChild(node)%7D%7D)%3Bdocument.querySelectorAll(%22html%20*%22).forEach(function(node)%7Bvar%20s%3DgetComputedStyle(node)%3Bif(%22hidden%22%3D%3D%3Ds%5B%22overflow%22%5D)%7Bnode.style%5B%22overflow%22%5D%3D%22visible%22%7Dif(%22hidden%22%3D%3D%3Ds%5B%22overflow-x%22%5D)%7Bnode.style%5B%22overflow-x%22%5D%3D%22visible%22%7Dif(%22hidden%22%3D%3D%3Ds%5B%22overflow-y%22%5D)%7Bnode.style%5B%22overflow-y%22%5D%3D%22visible%22%7D%7D)%3Bvar%20htmlNode%3Ddocument.querySelector(%22html%22)%3BhtmlNode.style%5B%22overflow%22%5D%3D%22visible%22%3BhtmlNode.style%5B%22overflow-x%22%5D%3D%22visible%22%3BhtmlNode.style%5B%22overflow-y%22%5D%3D%22visible%22%7D)()%3B%0A

- bookmarklet to shoot pages over to Reddit, just swap out r/xyz:

  javascript:(function(){  var url = encodeURIComponent(window.location.href);  window.open('https://old.reddit.com/r/jchromebook/submit?url=' + url);})();

20 comments

al_borland1y ago

I made a basic one for Kagi’s summarizer service.

javascript:(function()%7Bwindow.location.href%20%3D%20%60https%3A%2F%2Fkagi.com%2Fsummarizer%2Findex.html%3Ftarget_language%3D%26summary%3Dtakeaway%26url%3D%24%7BencodeURIComponent(window.location.href)%7D%60%7D)()

I have it in my todos to make some for their other offerings, like the new translations service they just released.

This one is very niche, but I was getting 100% in Tears of the Kingdom and the map didn’t tell me how many Koroks (or whatever else) I had left. So I threw this one together to tell me. It just counts the elements of a certain type and displays an alert with the number.

javascript:(function()%7Bfunction%20countTitles(title)%20%7Bconst%20elementsWithTitle%20%3D%20document.querySelectorAll(%60%5Btitle%3D%22%24%7Btitle%7D%22%5D%60)%3Bconst%20count%20%3D%20elementsWithTitle.length%3Breturn%20count%3B%7Dalert(countTitles(%22Korok%20Seed%22)%20%2B%20(countTitles(%22Korok%20Seed%20x2%22)*2))%7D)()

gabrielsroka1y ago

  javascript:location='https://kagi.com/summarizer/index.html?target_language=&summary=takeaway&url='+encodeURIComponent(location)

  javascript:alert([['Korok Seed'], ['Korok Seed x2', 2]].reduce((a, [t, m=1]) => a + document.querySelectorAll(`[title="${t}"]`).length * m, 0))

xigoi1y ago

If Kagi is your default seacch engine, you can simply write !summ before the address to summarize it.

wruza1y ago

Show all images on the page in a grid with size and megapixel tags. Useful for manual scraping.

Dereferer current tab in a new tab. Some sites refuse to be referred from search/etc but copy-pasting an url into a new tab works.

Various “save” bms. Picks up a resource and opens it in new tab for a specific site that disallows right-click or hides an image in css bg, etc.

“Video”. Turns yt short into normal video (short id is regular video id).

It’s a shame that bookmarklets can’t refer to a file and require this %%% inlining. Probably solvable with tampermonkey, but not worth the research.

pseudo_meta1y ago

> Show all images on the page in a grid with size and megapixel tags. Useful for manual scraping. Would you mind sharing that one?

wruza1y ago

Sure. Note that it does some hqdefault vs maxresdefault loading logic for yt, which you can rip away if not needed and make it a little smaller. Also splits images into two sections, 1st all >= HD-sized pics, 2nd the rest. It still doesn't analyze css bg urls, I'm too lazy for walking the stylesheets. Click again to hide it. Images must be initially on-screen, so scroll the site down if it lazy loads them.

https://pastebin.com/VMr8L6qK

It uses semicolons, so is pasteable as-is in a bookmark's address field.

License is full surrender anonymous public domain, in case that matters.

1 more reply

gabrielsroka1y ago

> refer to a file

What do you mean?

> require %%% inlining

They don't, and even if they did, you could encode it yourself

wruza1y ago

What do you mean?

A bookmarklet to take its code from a local file. Would be useful for debugging, ctrl-s and click again.

1 more reply

gabrielsroka1y ago

This seems to work as well:

  javascript:open('https://old.reddit.com/r/xyz/submit?url=' + encodeURIComponent(location.href))

Notes:

1. u don't have to use `window.`, window is the default object (maybe less readable, but folks don't use window.fetch either)

2. using an IIFE is sometimes useful and necessary, but this is a simple bookmarklet

3. as i wrote in the other comment, u don't need to encode it, and if u did, you could use encodeURIComponent to do it for you. ie, show the plain code here and let someone encode it if necessary (but i've never encoded mine)

I've posted several bookmarklets here: https://hn.algolia.com/?dateRange=all&page=0&prefix=true&que...

mattcanhack1y ago

For archiving a page:

  javascript:void(window.open('https://web.archive.org/save/'+location.href));

Should probably encode the href but it has worked so far

defrost1y ago

Hmm, just tested this variation:

    javascript:void(window.open('https://clearthis.page/?u='+location.href));

and it works to invoke ClearThisPage: https://clearthis.page/

    Bypass the clutter from any web article

    This service takes any web article or news page and returns only the relevant content, freeing you from any clutter, including ads, popups and more.

which also sidesteps some (not all) paywall blocking markups.

justtinker1y ago

I have used variations of password revel bookmarklets. I keep searching for new one when I need them again. Most recent find was.

https://gist.github.com/robbiet480/4711696

gabrielsroka1y ago

this seems to work:

  document.querySelectorAll('input[type=password]').forEach(i => i.type = 'text')

or if there's only 1 password on the page

  document.querySelector('input[type=password]').type='text'

ashconnor1y ago

Add all Amex offers:

    javascript: var index,offerButtons=Array.from(document.getElementsByClassName("offer-cta")).filter(a=>"Add to Card"==a.title);for(index=0;index<offerButtons.length;++index)console.log("Clicking offer button"),offerButtons[index].click(),(async()=>{await new Promise(a=>setTimeout(a,2e3))})();

Force paste (works sometimes)

    javascript:forceBrowserDefault=(e=>{e.stopImmediatePropagation();return true;});['copy','cut','paste'].forEach(e=>document.addEventListener(e,forceBrowserDefault,true));

Facebook Marketplace delete all sold

    javascript:(async()=>{var e,l,a=Array.from(document.getElementsByClassName("x193iq5w")).filter(e=>"Sold"==e.innerHTML);for(let i=0;i<a.length;++i)console.log("Clicking Sold Listing"),a[i].click(),await new Promise(e=>setTimeout(e,3e3)),document.querySelector('[aria-label="Save"]').click(),await new Promise(e=>setTimeout(e,1e3)),document.querySelector('[aria-label="Close"]').click(),await new Promise(e=>setTimeout(e,2e3));location.reload()})();

I should really convert these to Tampermonkey scripts

gabrielsroka1y ago

i think this works for the Amex one. where do you run/test this?

  javascript:for (let b of document.querySelectorAll('.offer-cta[title="Add to Card"]')) {
    console.log("Clicking offer button");
    b.click();
    (async () => {await new Promise(r => setTimeout(r, 2e3))})();
  }

does the setTimeout work? wouldn't you need something like this (in an async function)

  for (let b of document.querySelectorAll('.offer-cta[title="Add to Card"]')) {
    console.log('Clicking offer button');
    b.click();
    await new Promise(r => setTimeout(r, 2e3));
  }

ashconnor1y ago

I run it on the offers page https://global.americanexpress.com/offers/eligible

The wrapped async function is for Firefox I understand.

runjake1y ago

Fetch the latest version of an unpaywalled article with archive.ph:

  javascript:location.href = '//archive.ph/newest/' + location.href.split('?')[0];

j / k navigate · click thread line to collapse

20 comments

al_borland1y ago

I made a basic one for Kagi’s summarizer service.

I have it in my todos to make some for their other offerings, like the new translations service they just released.

gabrielsroka1y ago

  javascript:location='https://kagi.com/summarizer/index.html?target_language=&summary=takeaway&url='+encodeURIComponent(location)

  javascript:alert([['Korok Seed'], ['Korok Seed x2', 2]].reduce((a, [t, m=1]) => a + document.querySelectorAll(`[title="${t}"]`).length * m, 0))

xigoi1y ago

If Kagi is your default seacch engine, you can simply write !summ before the address to summarize it.

wruza1y ago

Show all images on the page in a grid with size and megapixel tags. Useful for manual scraping.

Dereferer current tab in a new tab. Some sites refuse to be referred from search/etc but copy-pasting an url into a new tab works.

Various “save” bms. Picks up a resource and opens it in new tab for a specific site that disallows right-click or hides an image in css bg, etc.

“Video”. Turns yt short into normal video (short id is regular video id).

It’s a shame that bookmarklets can’t refer to a file and require this %%% inlining. Probably solvable with tampermonkey, but not worth the research.

pseudo_meta1y ago

> Show all images on the page in a grid with size and megapixel tags. Useful for manual scraping. Would you mind sharing that one?

wruza1y ago

https://pastebin.com/VMr8L6qK

It uses semicolons, so is pasteable as-is in a bookmark's address field.

License is full surrender anonymous public domain, in case that matters.

1 more reply

gabrielsroka1y ago

> refer to a file

What do you mean?

> require %%% inlining

They don't, and even if they did, you could encode it yourself

wruza1y ago

What do you mean?

A bookmarklet to take its code from a local file. Would be useful for debugging, ctrl-s and click again.

1 more reply

gabrielsroka1y ago

This seems to work as well:

  javascript:open('https://old.reddit.com/r/xyz/submit?url=' + encodeURIComponent(location.href))

Notes:

1. u don't have to use `window.`, window is the default object (maybe less readable, but folks don't use window.fetch either)

2. using an IIFE is sometimes useful and necessary, but this is a simple bookmarklet

I've posted several bookmarklets here: https://hn.algolia.com/?dateRange=all&page=0&prefix=true&que...

mattcanhack1y ago

For archiving a page:

  javascript:void(window.open('https://web.archive.org/save/'+location.href));

Should probably encode the href but it has worked so far

defrost1y ago

Hmm, just tested this variation:

    javascript:void(window.open('https://clearthis.page/?u='+location.href));

and it works to invoke ClearThisPage: https://clearthis.page/

    Bypass the clutter from any web article

    This service takes any web article or news page and returns only the relevant content, freeing you from any clutter, including ads, popups and more.

which also sidesteps some (not all) paywall blocking markups.

justtinker1y ago

I have used variations of password revel bookmarklets. I keep searching for new one when I need them again. Most recent find was.

https://gist.github.com/robbiet480/4711696

gabrielsroka1y ago

this seems to work:

  document.querySelectorAll('input[type=password]').forEach(i => i.type = 'text')

or if there's only 1 password on the page

  document.querySelector('input[type=password]').type='text'

ashconnor1y ago

Add all Amex offers:

    javascript: var index,offerButtons=Array.from(document.getElementsByClassName("offer-cta")).filter(a=>"Add to Card"==a.title);for(index=0;index<offerButtons.length;++index)console.log("Clicking offer button"),offerButtons[index].click(),(async()=>{await new Promise(a=>setTimeout(a,2e3))})();

Force paste (works sometimes)

    javascript:forceBrowserDefault=(e=>{e.stopImmediatePropagation();return true;});['copy','cut','paste'].forEach(e=>document.addEventListener(e,forceBrowserDefault,true));

Facebook Marketplace delete all sold

    javascript:(async()=>{var e,l,a=Array.from(document.getElementsByClassName("x193iq5w")).filter(e=>"Sold"==e.innerHTML);for(let i=0;i<a.length;++i)console.log("Clicking Sold Listing"),a[i].click(),await new Promise(e=>setTimeout(e,3e3)),document.querySelector('[aria-label="Save"]').click(),await new Promise(e=>setTimeout(e,1e3)),document.querySelector('[aria-label="Close"]').click(),await new Promise(e=>setTimeout(e,2e3));location.reload()})();

I should really convert these to Tampermonkey scripts

gabrielsroka1y ago

i think this works for the Amex one. where do you run/test this?

  javascript:for (let b of document.querySelectorAll('.offer-cta[title="Add to Card"]')) {
    console.log("Clicking offer button");
    b.click();
    (async () => {await new Promise(r => setTimeout(r, 2e3))})();
  }

does the setTimeout work? wouldn't you need something like this (in an async function)

  for (let b of document.querySelectorAll('.offer-cta[title="Add to Card"]')) {
    console.log('Clicking offer button');
    b.click();
    await new Promise(r => setTimeout(r, 2e3));
  }

ashconnor1y ago

I run it on the offers page https://global.americanexpress.com/offers/eligible

The wrapped async function is for Firefox I understand.

runjake1y ago

Fetch the latest version of an unpaywalled article with archive.ph:

  javascript:location.href = '//archive.ph/newest/' + location.href.split('?')[0];

j / k navigate · click thread line to collapse