Expecto Strong Passwords: Enchant Your Online Security with a JavaScript Password Bookmarklet

Back in the day, when the internet was young and full of hope, there were these things called JavaScript bookmarklets. They were like little web wizards that lived in your bookmarks bar and could cast spells with just a click. While their powers may have diminished over time, they still have a few tricks up their sleeves, like generating passwords that would make Dumbledore proud. In this article, I'll show you how to harness the power of these little wizards to create your very own password generator in just 30 seconds. So grab your wizard hat and say hello to some JavaScript wizardry!

We are going to start with a simple JS function to generate a random string of arbitrary length:

function generateRandomString(length) {
    const chars = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
    let result = '';
    for (let i = 0; i < length; i++) {
        const randomIndex = Math.floor(Math.random() * chars.length);
        result += chars.charAt(randomIndex);
    }
    return result;
}

To generate the password we need the desired length of the password, for that we would use the good old window.prompt with default value of 16

window.prompt('Enter the desired length of string:', 16)

The return value of this can be passed to our function generateRandomString that we defined earlier.
Now, to output the generated password we will again use prompt because Chrome doesn't let user copy text from "alert" box.

prompt('Please copy the following generated String', [Call above function here])

Here is what we have so far:

window.prompt('Please copy the following generated String', (function generateRandomString(length) {
    const chars = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
    let result = '';
    for (let i = 0; i < length; i++) {
        const randomIndex = Math.floor(Math.random() * chars.length);
        result += chars.charAt(randomIndex);
    }
    return result;
})(window.prompt('Enter the desired length of string:', 16)))

Last but not the least, we have to enclose this into another IIFE and prepend that with javascript: so as to let browser know that this specific bookmark is not just any URL but a JavaScript Snippet.

javascript:(() => {
    prompt('Please copy the following generated String', (
        function generateRandomString(length) {
            const chars = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
            let result = '';
            for (let i = 0; i < length; i++) {
                const randomIndex = Math.floor(Math.random() * chars.length);
                result += chars.charAt(randomIndex);
            }
            return result;
        })(window.prompt('Enter the desired length of string:', 16)));
    return false;
})()

You might have noticed that I sneaked in a return false at the end, that is to prevent browser from redirecting you to a new page.

Now you can just create a New Bookmark in your browser with above code as "URL" and click it no matter on which webpage are you and you would get a password of your desired length.

In conclusion, using a JavaScript bookmarklet to create a password generator is a simple and efficient way to generate strong, unique passwords on the fly. With just a few lines of code and a couple of clicks, you can create a custom password generator that fits your needs. So, whether you're a security-conscious user or just looking for a little bit of web wizardry, give this method a try and see how it can make your online life a little bit easier and a lot more secure. Thanks for reading and happy password generating!