I build a lot of wireframes and demos. I need a lot of filler text. I was getting really tired of going to lipsum.com, scrolling, finding and selecting a snippet of the text, and copying it to the clipboard. I wanted to be able to use lorem ipsum easily. I thought a Chrome Extension might to the trick, so that’s what I built.
It’s called Lorem Clipsum. Open the menu and click the paragraph or sentence button to have a paragraph or sentence of Lorem Ipsum text copied to your clipboard. Pretty simple. Thought it was going to be easy to build. And it was. But it was also a little headache-y.
How to Build an Extension
If you’re really interested in how to build a Chrome extension, I suggest reading this Free Code Camp Medium article, alongside the official documentation. I found the documentation kind of thick and hard to understand, and that Medium article really helped.
At the end of the day though, a Chrome extension is really just a small website that has some special tools it can use to interact more with the browser. It uses HTML, CSS, and JavaScript to function. It’s kind of bizarre that such a powerful thing just needs a little set up that is different than what web devs are used to.
What I Learned
I learned out how to copy to the clipboard from Chrome. It works fine and doesn’t require a library.
Note that this code blockĀ only works in Chrome.
function copy(str) {
navigator.clipboard.writeText(str)
.then(() => {
alert('Copied!')
})
.catch(err => {
alert("Oops. There was an issue")
});
}
Pretty soon, I’ll add a page somewhere for the extension which has the relevant information and what not. For now, the extension is not published on the webstore – and it probably won’t be for some time. There are a few things I want to do before sharing it with other people. I want to give it a webpage so users can report bugs and get information about what they’re installing to their browsers. I also want to ensure them I’m not trying to steal their data or anything, and I really want to make it look darn good. So I’m going to spend some free time on it over the next week or so and report back.