fileSystemEntryParse.ts

const fileSystemEntryParse = async (data: FileSystemEntry|DataTransferItemList) => {
  const entries = data instanceof DataTransferItemList ? [...data].map(dataTransferItem => dataTransferItem.webkitGetAsEntry()) : [data];
  const stack = [...entries];
  let target: FileSystemEntry;

  const result: File[] = [];

  while (target = stack.shift() as FileSystemEntry) {
    if (target.isDirectory) {
      const reader = (target as FileSystemDirectoryEntry).createReader();
      
      const entries = await new Promise<FileSystemEntry[]>(res => {
        reader.readEntries(entries => res(entries));
      });
      stack.unshift(...entries);
    
    } else {
      const file = await new Promise<File>(res => {
        (target as FileSystemFileEntry).file(file => res(file));
      });
      result.push(file);
    }
  }

  return result;
};
        
document.body.ondragover = ev => ev.preventDefault();
document.body.ondrop = async (ev) => {
  ev.preventDefault();
  console.log(ev.dataTransfer?.files);
  const files = await fileSystemEntryParse(ev.dataTransfer?.items as DataTransferItemList);
  console.log(files);
}