Michal Kurz
Michal Kurz

Reputation: 2095

Downloading file from dataUrl results in `null` text displayed on Chrome, when hovering the file's "download tile"

I'm using the following code to force-download a file (so browser doesn't decide to open it in a new tab):

const fetchFileAndConvertToDataURL = async (mediaUrl: string): Promise<string> => {
  const file = await downloadFileFromMediaGallery(mediaUrl) // API call returning an image stream
  const fileBlob = await file.blob()
    
  return new Promise((resolve, reject) => {
    const reader = new FileReader()
    reader.onloadend = () => resolve(reader.result as string)
    reader.onerror = reject
    reader.readAsDataURL(fileBlob)
  })
}

export const downloadFile = async (botId: BotId, mediaUrl: string, filename?: string) => {
  const dataUrl = await fetchFileAndConvertToDataURL(botId, mediaUrl)

  const a = document.createElement('a')
  a.href = dataUrl
  a.target = '_blank'
  a.download = filename || 'true'
  a.click()
}

And it works well, but when the download finishes in Chrome, and I hover the file's tile in the appearing bottom download dock, word "null" displays:
preview

This is where the source URL ususally gets displayed, so it makes sense "null" is there, since I'm downloading from dataUrl, but I would love to change it - is it possible to influence the content?

Thank you 🙏

Upvotes: 2

Views: 688

Answers (0)

Related Questions