Obsolete - Messenger.com FINALLY implented a dark mode! The continuation of my former script NativeDarkMessenger.user.js, and since it is doing a bit more than "Native Dark mode", I decided to separate them, and will most likely only work on this. For now it only removes some (in my opinion) really annoying functionality regarding videos, in the…

DarkMessenger-Hotfixes.user.js

// ==UserScript==
// @name         Dark Messenger and hotfixes
// @namespace    https://github.com/Damperen
// @version      2.1.8
// @description  Dark mode for Messenger and normalized videos
// @author       https://github.com/Damperen
// @match        https://www.messenger.com/*
// @grant        none
// @run-at       document-idle
// @icon         https://i.imgur.com/VNn3FEX.png
// ==/UserScript==


(function() {
    'use strict';

    var mutationObserver = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            mutation.addedNodes.forEach(function(node) {
                if(node.nodeType === 1){
                    fixVideo(node.querySelectorAll('video'));
                    setDarkModeMultiple(document.querySelectorAll(".__fb-light-mode"));
                    document.querySelectorAll(".qbubdy2e.pmk7jnqg>svg").forEach(function(svg){
                        svg.style.fill = "#242526"
                    });
                }
            });
        });
    });

    mutationObserver.observe(document.documentElement, {
        childList: true,
        subtree: true,
    });

    function setDarkModeMultiple(obj){
        if(!document.documentElement.className.contains('__fb-dark-mode')) {
            document.documentElement.className = '_9dls __fb-dark-mode';
            const sheet = new CSSStyleSheet();
            sheet.replaceSync('.a8c37x1j, path{fill: #fff} .__fb-dark-mode{--header-height: 0px} :root{color-scheme: dark} #facebook{ overflow: hidden!important} div, span>a{ color:white!important;} ');
            document.adoptedStyleSheets = [sheet];
        }

        obj.forEach(function(item) {
            item.className = item.className.replace('light','dark');
        });
    }


    function fixVideo(videos) {
        videos.forEach(function(vid) {
            if(!vid.controls) {
                breakStupidLinks(getNthParent(vid, 7));

                let vidSizeDiv = getNthParent(vid, 6);
                vidSizeDiv.style.minWidth = '300px';
                vidSizeDiv.style.maxHeight = '';

                vid.controls = true;
                vid.nextElementSibling.remove();
            }
        })
    }

    function breakStupidLinks(node) {
        if(node.nodeName == 'A' && node.getAttribute('role') == 'link') {
            if((typeof node.href == 'undefined') || !node.href.endsWith('#')) {
                node.target = '';
                node.href = '#';
                node.replaceWith(node.cloneNode(true));
            }
        }
    }

    function getNthParent(node, nth) {
        var parent = node;
        for (var i = 0; i < nth; i++) {
            if (parent.parentNode) {
                parent = parent.parentNode;
            }
        }
        return parent;
    }
})();