Greasy Fork is available in English.

Stylus Shadow DOM Support

Make Stylus styles also be applied to Shadow DOM elements.

// ==UserScript==
// @name         Stylus Shadow DOM Support
// @namespace    https://greasyfork.org/en/users/85671-jcunews
// @version      1.0.6
// @license      AGPLv3
// @author       jcunews
// @description  Make Stylus styles also be applied to Shadow DOM elements.
// @match        *://*/*
// @include      *:*
// @exclude      https://challenges.cloudflare.com/*
// @inject-into  page
// @grant        none
// @run-at       document-start
// ==/UserScript==

((updDelay, ass, eas, at) => {
  function chkNode(e) {
    return (e.tagName === "STYLE") && /^stylus-/.test(e.id)
  }
  function applyStylus(ss) {
    ss = document.querySelectorAll('html>style[id^="stylus-"]');
    ass.forEach(e => {
      if (!e.shadowRoot) return;
      Array.from(e.shadowRoot.children).forEach(el => chkNode(el) && el.remove());
      ss.forEach(el => e.shadowRoot.append(el.cloneNode(true)))
    })
  }
  updDelay = 500;
  ass = [];
  if (!(eas = Element.prototype.attachShadow)) return;
  Element.prototype.attachShadow = function(opt) {
    if (!window._cf_chl_opt && !document.querySelector('script[src^="https://challenges.cloudflare.com/"]')) {
      if (opt) {
        opt.mode = "open"
      } else opt = {mode: "open"};
      !ass.includes(this) && ass.push(this);
      clearTimeout(at);
      at = setTimeout(applyStylus, updDelay)
    }
    return eas.apply(this, arguments)
  };
  at = 0;
  if (!document.documentElement) return;
  (new MutationObserver(function(recs, b) {
    recs.forEach(rec => {
      rec.addedNodes.forEach(e => {
        if (!chkNode(e)) return;
        (e.obs = new MutationObserver(function(recs, b) {
          clearTimeout(at);
          at = setTimeout(applyStylus, updDelay);
        })).observe(e, {characterData: true, subtree: true});
        b = true
      });
      rec.removedNodes.forEach(e => {
        if (!e.obs) return
        e.obs.disconnect();
        b = true
      })
    });
    if (b) {
      clearTimeout(at);
      at = setTimeout(applyStylus, updDelay)
    }
  })).observe(document.documentElement, {childList: true})
})()