Inject Stylus into shadowRoots

Inject stylus in Shadow DOM

inject stylus to shadowRoot

Από την 26/09/2025. Δείτε την τελευταία έκδοση.

Κάντε μια ερώτηση, δημοσιεύστε μια ανασκόπηση, ή αναφέρετε τον κώδικα.

Αναδίπλωση γραμμών

// ==UserScript==
// @name                Inject stylus in Shadow DOM
// @namespace           https://greatest.deepsurf.us/users/821661
// @version             1.2
// @description         inject stylus to shadowRoot
// @author              hdyzen
// @run-at              document-start
// @match               https://*/*
// @grant               none
// @license             GPL-3.0-only
// ==/UserScript==

const sheet = new CSSStyleSheet();
const originalShadowRootDescriptor = Object.getOwnPropertyDescriptor(ShadowRoot.prototype, "adoptedStyleSheets");
const originalAttachShadow = Element.prototype.attachShadow;

function syncStyles() {
    const css = [...document.querySelectorAll("html > style.stylus")].map((s) => s.textContent).join("\n");
    sheet.replaceSync(css);
}

Element.prototype.attachShadow = function (init) {
    const shadowRoot = originalAttachShadow.call(this, init);

    shadowRoot.adoptedStyleSheets = [...shadowRoot.adoptedStyleSheets, sheet];

    return shadowRoot;
};

Object.defineProperty(ShadowRoot.prototype, "adoptedStyleSheets", {
    get() {
        return originalShadowRootDescriptor.get.call(this);
    },
    set(newSheets) {
        const sheets = [...newSheets];

        if (!sheets.includes(sheet)) {
            sheets.push(sheet);
        }

        originalShadowRootDescriptor.set.call(this, sheets);
    },
    configurable: true,
    enumerable: true,
});

new MutationObserver(syncStyles).observe(document.documentElement, {
    childList: true,
    subtree: true,
    characterData: true,
});