The following code works properly to download remote images, but did not work when altering it to download remote PDF file, here is the code I am using:

<a href="https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf" data-remote>Remote PDF</a>

 <script defer type="text/javascript">
    const a = document.querySelector('a[data-remote]')
    a.addEventListener('click', async (e) => {
      e.preventDefault()
      const file = await fetch(e.target.href);
      const blob = await file.blob();
      const blobUrl = URL.createObjectURL(blob);
      const downloadLink = document.createElement("a");
      downloadLink.href = blobUrl;
      downloadLink.download = 'file.pdf';

      downloadLink.click();
    })
  </script>