Last Updated: February 25, 2016

Bookmarklet to open package's npm link

So there is this awesome site: http://npmsearch.com
It's fast, has rating, can search on author or keywords. Then when you click the link to check the package it shows you the github page. Which is a good idea I think, but sometimes I am interested in stuff which can be seen only the npm site. Like dependents for example. Not to mention that the github README display fails on my small screen, so I need wrapping. Which npmjs.org has. Then I either have to type the site, or google search and click... not too much, but I got tired of it anyway.

So here is a bookmarklet for you which reads the package.json file, gets the name of the package and opens the npmjs.org/package/<packagename> link in a new tab:

javascript:(function(){ var w=window.open(''); var r=document.createElement('script'); r.textContent = 'var x=new XMLHttpRequest;x.onload = function(){window.location.href=\'https://npmjs.org/package/\'+JSON.parse(atob(JSON.parse(x.responseText).content.replace(/\\n/g,\'\'))).name}; x.open(\'GET\',(\'https://api.github.com/repos'+window.location.pathname+'/contents/package.json\').replace(/([^:])[\/][\/]+/g,\'$1/\'));x.send()'; w.document.body.appendChild(r) }())

gist: https://gist.github.com/ashnur/7307452

jsbin: http://jsbin.com/EKUxAD/2/edit

Oh. Forgot to mention that due to this bug https://bugzilla.mozilla.org/show_bug.cgi?id=866522 it only works in webkit things (and some older firefox versions probably)

And that I would've given up one step into it without the help of https://github.com/aroben
Thanks Adam!