JS Snippet - Bing Chat (Fix for Dark Reader Extension)

JS Snippet - Bing Chat (Fix for Dark Reader Extension).js

/*
    Removes and fixes backgrounds inside shadow DOM for dark mode to work better (no more forced white background).
    Applicable for https://www.bing.com/search?q=Bing+AI&showconv=1&FORM=hpcodx
*/

var sheetBg = new CSSStyleSheet
sheetBg.replaceSync( `div.image { display: none !important; }`)
var sheetMsg = new CSSStyleSheet
sheetMsg.replaceSync( `cib-message { background: #fff; color: #000; }`)

const config = { childList: true, subtree: true }

// First observer for general shadow DOM:
var mutationTarget = document.getElementById("b_sydConvCont");
// Add CSS when shadow DOM has been loaded:
const callback = (mutationList, observer) => {
    console.log("Root mutation triggered!");
    document.getElementsByClassName("cib-serp-main")[0].shadowRoot.querySelector("cib-conversation").shadowRoot.querySelector(".fade.top > cib-background").shadowRoot.adoptedStyleSheets = [ sheetBg ] ;
    document.getElementsByClassName("cib-serp-main")[0].shadowRoot.querySelector("cib-conversation").shadowRoot.querySelector(".fade.bottom > cib-background").shadowRoot.adoptedStyleSheets = [ sheetBg ] ;
    document.getElementsByClassName("cib-serp-main")[0].shadowRoot.querySelector("cib-background").shadowRoot.adoptedStyleSheets = [ sheetBg ] ;
    
    // Add CSS when nested message Shadow DOM has been loaded (happens later):
    var mutationTarget = document.getElementsByClassName("cib-serp-main")[0].shadowRoot.querySelector("cib-conversation").shadowRoot;
    if (mutationTarget != null) {
        messagesObserver.observe(mutationTarget, config);
    }
};
const observer = new MutationObserver(callback);
observer.observe(mutationTarget, config);

// Second observer for messages shadow DOM:
const messagesCallback = (mutationList, observer) => {
    console.log("Message mutation triggered!");
    var checkExisting = document.getElementsByClassName("cib-serp-main")[0].shadowRoot.querySelector("cib-conversation").shadowRoot.querySelector("cib-chat-turn").shadowRoot.querySelector(".response-message-group");
    if (checkExisting != null) {
        //console.log("Message mutation successful!");
        document.getElementsByClassName("cib-serp-main")[0].shadowRoot.querySelector("cib-conversation").shadowRoot.querySelectorAll("cib-chat-turn").forEach((item) => {
            item.shadowRoot.querySelector(".response-message-group").shadowRoot.adoptedStyleSheets = [ sheetMsg ] ;
        });
    }
};
const messagesObserver = new MutationObserver(messagesCallback);

I let Bing Chat explain my own code to me. It got the purpose and everything right!