Stylus Shadow DOM Support

Make Stylus styles also be applied to Shadow DOM elements.

  1. // ==UserScript==
  2. // @name Stylus Shadow DOM Support
  3. // @namespace https://gf.qytechs.cn/en/users/85671-jcunews
  4. // @version 1.0.8
  5. // @license AGPLv3
  6. // @author jcunews
  7. // @description Make Stylus styles also be applied to Shadow DOM elements.
  8. // @match *://*/*
  9. // @include *:*
  10. // @exclude https://challenges.cloudflare.com/*
  11. // @inject-into page
  12. // @grant none
  13. // @run-at document-start
  14. // ==/UserScript==
  15.  
  16. ((updDelay, ass, eas, at) => {
  17. function chkNode(e) {
  18. return e && e.matches?.('html>style:is([class="stylus"],[id^="stylus-"])')
  19. }
  20. function applyStylus(ss) {
  21. ss = document.querySelectorAll('html>style:is([class="stylus"],[id^="stylus-"])');
  22. ass.forEach(e => {
  23. if (!e.shadowRoot) return;
  24. Array.from(e.shadowRoot.children).forEach(el => chkNode(el) && el.remove());
  25. ss.forEach(el => e.shadowRoot.append(el.cloneNode(true)))
  26. })
  27. }
  28. updDelay = 500;
  29. ass = [];
  30. if (!(eas = Element.prototype.attachShadow)) return;
  31. Element.prototype.attachShadow = function(opt) {
  32. if (!window._cf_chl_opt && !document.querySelector('script[src^="https://challenges.cloudflare.com/"]')) {
  33. if (opt) {
  34. opt.mode = "open"
  35. } else opt = {mode: "open"};
  36. !ass.includes(this) && ass.push(this);
  37. clearTimeout(at);
  38. at = setTimeout(applyStylus, updDelay)
  39. }
  40. return eas.apply(this, arguments)
  41. };
  42. at = 0;
  43. if (!document.documentElement) return;
  44. (new MutationObserver(function(recs, b) {
  45. recs.forEach(rec => {
  46. rec.addedNodes.forEach(e => {
  47. if (!chkNode(e)) return;
  48. (e.obs = new MutationObserver(function(recs, b) {
  49. clearTimeout(at);
  50. at = setTimeout(applyStylus, updDelay);
  51. })).observe(e, {characterData: true, subtree: true});
  52. b = true
  53. });
  54. rec.removedNodes.forEach(e => {
  55. if (!e.obs) return
  56. e.obs.disconnect();
  57. b = true
  58. })
  59. });
  60. if (b) {
  61. clearTimeout(at);
  62. at = setTimeout(applyStylus, updDelay)
  63. }
  64. })).observe(document.documentElement, {childList: true})
  65. })()

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址