ScriptCat Skript für Firefox

Für das automatisch ausführen von Skripten auf Webseiten bin ich auf die ScriptCat Extension für Mozilla Firefox gestoßen.
Damit lassen sich recht schnell Skripte in Javascript schreiben die Aktionen auf einer Webseite ausführen.

Hier habe ich mal ein kleines Beispiel mit CGPT erstellt das kontinuierlich den rechten arrow key klickt und dann ein Remove Icon anklickt:

// ==UserScript==
// @name         Auto Click + ArrowRight
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Ctrl+F2 Start, Ctrl+F6 Stop
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    let currentX = 0;
    let currentY = 0;

    let clickX = 0;
    let clickY = 0;

    let running = false;

    document.addEventListener('mousemove', (e) => {
        currentX = e.clientX;
        currentY = e.clientY;
    });

    function clickAt(x, y) {
        const element = document.elementFromPoint(x, y);
        if (!element) return;

        ['mousedown', 'mouseup', 'click'].forEach(type => {
            element.dispatchEvent(new MouseEvent(type, {
                bubbles: true,
                cancelable: true,
                clientX: x,
                clientY: y,
                button: 0
            }));
        });
    }

    function sendArrowRight() {
        const target = document.activeElement || document.body;

        ['keydown', 'keyup'].forEach(type => {
            target.dispatchEvent(new KeyboardEvent(type, {
                key: 'ArrowRight',
                code: 'ArrowRight',
                keyCode: 39,
                which: 39,
                bubbles: true
            }));
        });
    }

    function sleep(ms) {
        return new Promise(resolve => setTimeout(resolve, ms));
    }

    async function loop() {
        running = true;
        while (running) {
            console.log("Run next");
            const svg = Array.from(document.querySelectorAll('svg'))
                .find(svg => svg.querySelector('title')?.textContent.trim() === 'Remove');

            if (svg) {
                const rect = svg.getBoundingClientRect();

                const x = rect.left + rect.width / 2;
                const y = rect.top + rect.height / 2;

                console.log(`Click: ${x}, ${y}`);
                clickAt(x, y);
                await sleep(1000)
                const button = Array.from(document.querySelectorAll('button'))
                    .find(button => button.textContent.trim().toLowerCase() === 'cancel');

                if (button) {
                    console.log("Cancel button gefunden");
                    button.click();
                }
                await sleep(1000);
            }
            else
            {
                console.log("Remove not found");
                await sleep(2000);
            }

            if (!running) break;

            sendArrowRight();
            await sleep(2000);
        }

        console.log("Stopped");
    }

    document.addEventListener('keydown', (e) => {

        // Start: Ctrl + F2
        if (e.ctrlKey && e.key === 'F2') 
        {
            e.preventDefault();
            loop();
        }

        // Stop: Ctrl + F6
        if (e.ctrlKey && e.key === 'F6') 
        {
            e.preventDefault();
            running = false;
        }
    });

})();

Für komplexere Aufgaben, z.B. Kommunikation mit einem Server oder verschiedene Klassen einbinden, empfiehlt es sich direkt selbst eine Extension zu schreiben, was auch nicht sehr kompliziert ist.