HTML Paste Clipboard File to File Input

Question

I have a function that uploads a CSV file into a server via form submission. It is working well, but I need to support copy and paste of CSV file from the actual file location to the input element.

I tried to do this code from a stackoverflow answer (https://stackoverflow.com/a/50427897/9751944)

const form = document.getElementById("new_document_attachment");
const fileInput = document.getElementById("document_attachment_doc");

fileInput.addEventListener('change', () => {
  form.submit();
});

window.addEventListener('paste', e => {
  fileInput.files = e.clipboardData.files;
});

<form id="new_document_attachment" method="post">
  <div class="actions"><input type="submit" name="commit" value="Submit" /></div>
  <input type="file" id="document_attachment_doc" />
</form>

It is working on images. But when I try it on CSV and other files, I am getting an error saying that the clipboard does not have any content ie.

The first FileList and File are for the test image while the second one is for CSV