CSS Helper - URL Attribute Adder

Adds a custom attribute (url-url) to all body tags, to make it easier for CSS extensions to target specific URL's.

Dovrai installare un'estensione come Tampermonkey, Greasemonkey o Violentmonkey per installare questo script.

You will need to install an extension such as Tampermonkey to install this script.

Dovrai installare un'estensione come Tampermonkey o Violentmonkey per installare questo script.

Dovrai installare un'estensione come Tampermonkey o Userscripts per installare questo script.

Dovrai installare un'estensione come ad esempio Tampermonkey per installare questo script.

Dovrai installare un gestore di script utente per installare questo script.

(Ho già un gestore di script utente, lasciamelo installare!)

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

(Ho già un gestore di stile utente, lasciamelo installare!)

// ==UserScript==
// @name        CSS Helper - URL Attribute Adder
// @description Adds a custom attribute (url-url) to all body tags, to make it easier for CSS extensions to target specific URL's.
// @namespace   Violentmonkey Scripts
// @match       *://*/*
// @grant       none
// @version     1.0
// @author      Jupiter Liar
// @license     Attribution CC BY
// @description 8/26/2023, 5:09:26 AM
// ==/UserScript==

(function() {
    'use strict';

    // Function to set the URL attribute on the body tag
    function setUrlAttribute() {
        document.body.setAttribute('url-url', window.location.href);
    }

    // Initial setup
    setUrlAttribute();

    // Watch for URL changes using MutationObserver on the body tag
    const observer = new MutationObserver(() => {
        setUrlAttribute();
    });

    observer.observe(document.body, {
        childList: true,
        subtree: true
    });

    // Watch for popstate event to capture back/forward navigation
    window.addEventListener('popstate', setUrlAttribute);

    // Watch for changes in pushState/replaceState to capture dynamic URL changes
    const originalPushState = history.pushState;
    const originalReplaceState = history.replaceState;

    history.pushState = function(...args) {
        const result = originalPushState.apply(this, args);
        setUrlAttribute();
        return result;
    };

    history.replaceState = function(...args) {
        const result = originalReplaceState.apply(this, args);
        setUrlAttribute();
        return result;
    };
})();