A Chrome extension to help you inspect MP4 video content and find irregularities in video streams.
- In chrome navigate to chrome://extensions/ (edge://extensions/ for chromium edge)
- Enable developer mode
- Click
Load unpacked extension - Select the folder where you cloned this into
After installation the MP4Inspector should show up as a new tab in your DevTools.
In order to narrow down the elements on the network column, there are two filter methods available File name and box name. They can also be combined to only show entries which match both filter entries.
Filters all entries to only show entries which have their URL partially matching the entered value.
Filters all entries to only show entries which contain a box with the exact value in the search field.
This view lets you compare the boxes of two segments. You can open it by selecting any two segments and pressing the compare button
The results will be color coded meaning:
+ Green for boxes which are the same in both segments
- Red for boxes / values which are different
! Orange for boxes which only exist in one of the segments
For more detailed inspection (eg: FFProbe or crafting a test asset), the MP4Inspector offers the possibility to download segments. You can select one or multiple entries in the network column and click the download button. A download will be started for each selected entry, but Chrome will only allow 10 downloads at a time.
There is also the possiblity to concatenate segments, which can be used to create a playable part of the asset by combining the init segment with any number of data segments. Currently muxing is not supported, so you have to ensure that only audio or video segments are selected.
In case a transmuxing step is executed and the MP4 data structure is not available at the time of downloading or if the player rewrites MP4 data, it might be interesting to inspect the data which gets pushed into the SourceBuffers.
To enable this functionality, the MP4Inspector comes with a code injection approach, which overwrites SourceBuffer.prototype.appendBuffer and sends the appended data to the extension. As code injection is quite the dangerous territory, the URLs for this functionality have to be allow-listed in the manifest.json file under host_permissions (to allow the injection) and externally_connectable (to allow communication with the extension).
By default this is enabled for localhost, if you need any more URLs, you will have to add them to the manifest. Check https://developer.chrome.com/docs/extensions/mv3/permission_warnings/#permissions_with_warnings for more information.
If you have any questions or want to share feedback please feel free to join the Bitmovin Community