Anchor tag "download" does not set the suggested filename when using <Link/>

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: darwin
  Arch: x64
  Version: Darwin Kernel Version 18.7.0: Tue Jun 22 19:37:08 PDT 2021; root:xnu-4903.278.70~1/RELEASE_X86_64
Binaries:
  Node: 16.13.0
  npm: 8.1.0
  Yarn: 1.22.18
  pnpm: N/A
Relevant packages:
  next: 12.1.7-canary.48
  react: 18.0.0
  react-dom: 18.0.0

What browser are you using? (if relevant)

Chrome Version 102.0.5005.61 (Official Build) (x86_64)

How are you deploying your application? (if relevant)

next start

Describe the Bug

Those two bits of code behave differently:

<Link href="/api/export">
  <a download="file.xslx">Download</a>
</Link>

<a href="/api/export" download="file.xslx">Download</a>

The first one downloads a file called export.xslx (provided that the right Content-Type header is set on the response), the second one a file called file.xslx.

A download attribute on the Anchor tag should set the suggested filename (MDN doc). Note that the generated markup is the right one (the download attribute does exist in the DOM element), but the downloaded file has the wrong name.

Expected Behavior

That first code example should download a file called file.xslx.

Link to reproduction

https://stackblitz.com/edit/nextjs-bmfers?file=pages/index.js

To Reproduce

Click both links in the reproduction and notice the different behavior regarding the download tag.

[benjamintd]

Thanks for your analysis. I used a <Link> tag to enable prefetching, as well as per the linter suggestion. However, I’ll switch back to a regular anchor tag if that’s the better option.

[github-actions[bot]]

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.