Bug 248242

Summary: Download mp4 instead of application/octet-stream in Safari
Product: WebKit Reporter: 0aps <six.aps>
Component: MediaAssignee: Nobody <webkit-unassigned>
Status: RESOLVED INVALID    
Severity: Normal CC: ap, eric.carlson, youennf
Priority: P2    
Version: Safari 16   
Hardware: Unspecified   
OS: Unspecified   
Attachments:
Description Flags
Example of exported file from Safari none

Description 0aps 2022-11-22 11:38:57 PST 
I'm trying to record a video on Safari using MediaRecorder API and download the video as a .mp4 file. Nevertheless even tho' I specify the media type (`video/mp4`), the file downloaded has `application/octet-stream`. How can I download the file with the correct media type instead?

Once I download the video, I check the mediatype like this:

`file --mime-type video.mp4`

I'm expecting that result to be `video/mp4` but I get `application/octet-stream`.

[See CodePen example](https://codepen.io/eliannyl/pen/GRGQdzv) (need to open on Safari)

Here's the code in CodePen for reference too:

```
<html>
   <body>
      <button onclick="startRecording()">start</button><br>
      <button onclick="endRecording()">end</button>
      <video id="video" autoplay playsInline muted></video>
      <script>
         let blobs = [];
         let stream;
         let mediaRecorder;
         let videoMimeType = "video/mp4";
         async function startRecording()
         {
             stream = await navigator.mediaDevices.getUserMedia({ audio: true, video: true });
             mediaRecorder = new MediaRecorder(stream, {
               mimeType: videoMimeType,
             });
             mediaRecorder.ondataavailable = (event) => {
                // Let's append blobs for now, we could also upload them to the network.
                if (event.data)
                     blobs.push(event.data);
             }
             mediaRecorder.onstop = doPreview;
             // Let's receive 1 second blobs
             mediaRecorder.start(1000);
         }
         function endRecording()
         {
             // Let's stop capture and recording
             mediaRecorder.stop();
             stream.getTracks().forEach(track => track.stop());
         }
         function doPreview()
         {
             if (!blobs.length)
                 return;
             // Let's concatenate blobs to preview the recorded content
         
         const blob = new Blob(blobs, { type: mediaRecorder.mimeType })
                     console.log(blob.type); console.log(mediaRecorder.mimeType);
                     const a = document.createElement('a');
                     document.body.appendChild(a);
                     const url = window.URL.createObjectURL(blob);
                     a.href = url;
                     a.download = "video";
                     a.click();
                     setTimeout(() => {
                       document.body.removeChild(a);
                     }, 0);
         
         
             video.src = url;
         }
      </script>
   </body>
</html>
```


The CodePen it's basically the [same example from WebKit](https://webkit.org/blog/11353/mediarecorder-api/). 

Any ideas?
Comment 1 Alexey Proskuryakov 2022-11-26 14:55:05 PST 
I cannot reproduce this, but also not sure if I fully understand the issue. The `file` tool looks at signatures within the file to determine its type, and if it says `application/octet-stream`, that just means that it couldn't determine the type.

When I try to reproduce, I actually get "video/mp4" printed by the tool.

- What versions of Safari and macOS are you using?

- What does `which file` say? Perhaps you have a non-default version installed.

- Could you please attach an affected file here, so that we could inspect its actual format?
Comment 2 0aps 2022-11-28 06:17:57 PST 
(In reply to Alexey Proskuryakov from comment #1)
> I cannot reproduce this, but also not sure if I fully understand the issue.
> The `file` tool looks at signatures within the file to determine its type,
> and if it says `application/octet-stream`, that just means that it couldn't
> determine the type.
> 
> When I try to reproduce, I actually get "video/mp4" printed by the tool.
> 
> - What versions of Safari and macOS are you using?
> 
> - What does `which file` say? Perhaps you have a non-default version
> installed.
> 
> - Could you please attach an affected file here, so that we could inspect
> its actual format?

Hi Alexey, thanks for following up. 

- I'm using macOS Monterey (12.6) with Safari (16.1).

- /usr/bin/file

- I attached one to the case. (which I got from the CodePen linked in the original question).
Comment 3 0aps 2022-11-28 06:19:52 PST 
Created attachment 463758 [details]
Example of exported file from Safari
Comment 4 Alexey Proskuryakov 2022-11-28 08:53:00 PST 
`file` on macOS Ventura says "ISO Media, MP4 Base Media v5". QuickTime Player says that video format is "H.264", and audio is "MPEG-4 AAC, 44100 Hz".

Looks like WebKit behaves correctly, and it's just that the older version of `file` doesn't recognize the format.