I have a simple bookmarklet does does something similar:
javascript:(function(){document.querySelectorAll("video").forEach(((e,o)=>{console.log(`VideoFixer: Processing <video> #${o+1}:`,e),e.style.position="relative",e.style.zIndex="999999",e.controls=!0,e.style.pointerEvents="auto";const t=[],i=[];["disablePictureInPicture","disableRemotePlayback"].forEach((o=>{e.hasAttribute(o)&&(t.push(o),e.removeAttribute(o))})),e.hasAttribute("controlsList")&&(i.push(...e.getAttribute("controlsList").split(/\\s+/)),e.removeAttribute("controlsList")),t.length&&console.log(`VideoFixer: Removed attributes: ${t.join(", ")}`),i.length&&console.log(`VideoFixer: Removed controlsList restrictions: ${i.join(", ")}`),t.length||i.length||console.log("VideoFixer: No restrictions found to remove.")})),console.log("VideoFixer: All videos processed.");}());
It just re-enables all controls on all <video> elements and uses z-indexing to push them to the top. Works on instagram but needs to be re-ran for new video elements.
That can be configured to run automatically on every site, and it uses the MutationObserver API to automatically fix any newly added/modified <video> elements on the page. Seems to work on Snapchat and Instagram so far, but breaks some functionality. Op's chrome extension, with bespoke support for Instagram, likely offers a much better experience. This is just more universal.
Ah that's a good idea! Similar effect to this but I guess packaging it in a chrome extension lends itself to "set it and forget it". I also have some customization options.
It's also a security risk though, as in someone could take it over and push a bad update at any time... I have a few extensions installed but I'm terrified of adding more, even though there are parts of my browsing experience that could be significantly improved.
I really wish there were a middle ground, like an external extension manager where you could opt into updates, with reproducible builds, changelogs, etc.
My mitigation for this:
Any extension that I grant serious permissions, I copy it locally, and then install that copy. This effectively disables all updates! Still requires I trust the extension as is, but doesn't require I trust the extension developers forever. And I use this [1] extension to easily download the source for any other extension.
You could add it from source which is pretty easy to do but you lose chrome’s syncing feature.
Having said that I haven’t developed a chrome extension in years. They are so strict now. I know they can’t manually inspect each line but I do hope it helps solve the problem of extensions going rogue.
Relatedly, I have a greasemonkey script[1] that makes Snapchat on web much more usable. I just updated it to include this video fixer logic so now it's easy to scrobble videos and download them.
It uses the MutationObserver API to immediately 'fix' any <video> element added to the page. Really I should just copy you and make a version of it that just does the video fixing but runs on every site. It's crazy how browsers have a nice built in pro-user video element, but that every site intentionally overrides and degrades it...
Turns out this doesn't work on facebook or instagram reels. I only watch the latter on my phone but whenever I do open reels on web in the infinite scroll mode it does not work. it works on direct links to a particular reel though.
That's great. The one site I definitely need it on is instagram whenever I happen to open a reel on web. And I'd like it on reddit because its video player sucks, but it just adds it on top of it so I have now ended up disabling it everywhere else.