title: "Save As Video" but how to do it with javascript and html instead?
body: <p>When you have a direct link to a video you can usually right click and the mouse menu will appear. Once there you'll see <code>Save Video As</code>. If you click on that it will download the video to your computer.</p>
  
  <p>I want the same functionality but instead I want to make a button on an HTML page that when you click will do the exact same thing as mentioned above.</p>
  
  <p>How can I do this?</p>
  
  <p>Let's look at this example:
  I have this link: <a href="https://invidious.fdn.fr/latest_version?id=NF_69Dyle1Y&amp;raw&amp;itag=22" rel="nofollow noreferrer">https://invidious.fdn.fr/latest_version?id=NF_69Dyle1Y&amp;raw&amp;itag=22</a></p>
  
  <p>If you go on there and right click on the video you'll see this:
  <a href="https://i.stack.imgur.com/ZgPfl.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ZgPfl.png" alt="example video with right click menu"></a></p>
  
  <p>Clicking on "Save Video As" you get:
  <a href="https://i.stack.imgur.com/nbsZ3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/nbsZ3.png" alt="enter image description here"></a></p>
  
  <p>Which is a dialog for saving the video in your local storage.</p>
  
  <p>Now my question is I want to do all this with a click of an html button.
  I want the dialog for saving to open without having to go on the video itself and right click and so on. Is there a way to do that?</p>
  
  <p>the html a tag download attribute does not work. I've tried using URI like this</p>
  
  <pre><code>&lt;a href='"data:application/octet-stream,"+encodeURIComponent(`https://invidious.fdn.fr/latest_version?id=NF_69Dyle1Y&amp;raw&amp;itag=22`)' download="video.mp4"&gt;download video&lt;/a&gt;
  </code></pre>
  
  <p>but it also doesn't work.</p>