CodexBloom - Programming Q&A Platform

advanced patterns when using the `download` attribute on `<a>` tags with Blob URLs in Edge 104

👀 Views: 382 💬 Answers: 1 📅 Created: 2025-07-22
html edge download blob HTML

I'm optimizing some code but I’m having trouble with the `download` attribute on `<a>` tags when trying to use it with Blob URLs in Microsoft Edge 104... The link seems to be working fine in Chrome and Firefox, but in Edge, it downloads a file named `undefined`. Here’s the code I’m using: ```html <a id="downloadLink" href="#" download="myfile.txt">Download File</a> <script> const blob = new Blob(["Hello, world!"], { type: 'text/plain' }); const url = URL.createObjectURL(blob); const link = document.getElementById('downloadLink'); link.href = url; </script> ``` I’ve verified that the Blob is being created correctly and the URL is generated as expected. When I click the link in Edge, it downloads a file named `undefined` instead of `myfile.txt`. I’ve also tried adding `link.setAttribute('download', 'myfile.txt')` programmatically before the download, but it didn’t help. Has anyone faced a similar scenario or is there something I'm missing here? I’d appreciate any insight or suggestions on how to resolve this scenario, especially a workaround for Edge compatibility. I'm coming from a different tech stack and learning Html.