When the file is mp4 format, appendTo() doesn't work with getBlobURL()

[joshuajazleung]

What version of WebTorrent?
v 0.102.4

What operating system and Node.js version?
MacOS, Node v10.11.0

What browser and version? (if using WebTorrent in the browser)
Chrome v70

What did you expect to happen?
I expect I can get BlobURL

What actually happened?
When the file in MP4 format is appended to the DOM before the file is available for download, getBlobURL() won't work; the callback won't be called.

You can try it on instant.io. "Download all files as zip" works, but individual file download won't work if the file is in MP4 format.

[G-Ray]

I confirm, with the sintel torrent:

console.log(torrent.files.length) // Display 11

torrent.files.forEach(file => {
  // return file.name.endsWith('.mp4')
  file.getBlobURL(function (err, url) {
    // Only 10 url will be returned, the mp4 file's url is missing
    if (err) throw err
   console.log(url)
  })
})

[DiegoRBaquero]

Blob URL is only available the the file is fully downloaded. See https://github.com/feross/stream-to-blob/blob/master/index.js#L13

[joshuajazleung]

Blob URL is only available the the file is fully downloaded. See https://github.com/feross/stream-to-blob/blob/master/index.js#L13

I know that. When the progress is 100%, you still won't get the URL. The callback isn't called at all. It applies to MP4 files only, other files seem fine.

[C0nw0nk]

Instead of trying to append the blob url like that have you tried it like this... This is how i get the blob url to output onto my html page.

file.getBlobURL(function (err, url) {
  if (err) throw err
  var a = document.createElement('a')
  a.download = file.name
  a.href = url
  a.textContent = 'Download ' + file.name
  document.body.appendChild(a)
})

From my tests in firefox all goes well however google chrome does have a unique mind of its own unlike other browsers and i find webtorrent to be buggy in chrome when it comes to appending things to pages etc.

[joshuajazleung]

Instead of trying to append the blob url like that have you tried it like this... This is how i get the blob url to output onto my html page.

file.getBlobURL(function (err, url) {
  if (err) throw err
  var a = document.createElement('a')
  a.download = file.name
  a.href = url
  a.textContent = 'Download ' + file.name
  document.body.appendChild(a)
})

From my tests in firefox all goes well however google chrome does have a unique mind of its own unlike other browsers and i find webtorrent to be buggy in chrome when it comes to appending things to pages etc.

The thing is, the callback in getBlobURL() won't be called at all, for files in MP4. The problem only happens if the MP4 file is appended to the DOM first by calling appendTo(). If I don't append it to the DOM, the callback will be called when the file is finished downloading.

EDIT: And it seems like Firefox has the same problem. getBlobURL() works in other file types except MP4 when appendTo() is called first.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs.