2024-08-14
4030
#html
Glad Chinda
1855
Aug 14, 2024 â‹… 14 min read

Programmatically downloading files in the browser

Glad Chinda Full-stack web developer learning new hacks one day at a time. Web technology enthusiast. Hacking stuffs @theflutterwave.

Recent posts:

how to properly handle rejected promises in TypeScript

How to properly handle rejected promises in TypeScript

Learn how to properly handle rejected promises in TypeScript using Angular, with tips for retry logic, typed results, and avoiding unhandled exceptions.

Lewis Cianci
Jun 26, 2025 â‹… 4 min read
Your AI Has Agency — Here’s How To Architect Its Frontend

Your AI has agency — here’s how to architect its frontend

AI’s not just following orders anymore. If you’re building the frontend, here’s how to design interfaces that actually understand your agent’s smarts.

Rosario De Chiara
Jun 25, 2025 â‹… 5 min read
how to design apps with Apple Intelligence in mind

How to design apps with Apple Intelligence in mind

Apple Intelligence is here. What does it mean for frontend dev and UX? Explore the core features of the update, do’s and don’ts for designing with Apple Intelligence in mind, and reflect on the future of AI design.

Murat YĂĽksel
Jun 24, 2025 â‹… 10 min read
How To Optimize Your Next.js App With After()

How to optimize your Next.js app with after()

Next.js’ after() is a new API that lets you run logic after your route has finished rendering, without blocking the client.

Temitope Oyedele
Jun 24, 2025 â‹… 11 min read
View all posts

5 Replies to "Programmatically downloading files in the browser"

  1. Hello. Great article! One comment though: in the function `downloadBlob` you declare a `clickHandler` that gets a value of an arrow function, which uses the `this` keyword. Since arrow functions do not have `this`, and you use `this` in a `setTimeout` callback function — it ends up being `undefined`, which throws when you perform the `.` operator on it (to call the `removeEventListener` method).
    Thanks for the article!
    Eran

  2. Hi Eran, thanks for pointing that out. That was an error on my part.

    The `clickHandler` function is supposed to be a regular JS function as opposed to an arrow function — that way, it would have the correct `this` binding internally (the target element) when it is eventually used as an event listener callback. If you notice in the subsequent Codepen snippets, you’d observe that the `clickHandler` function was defined as a regular function instead of as an arrow function.

    Thanks again for spotting that out.

Leave a Reply