Edit scripts locally. Works with Firefox with 1 reload.

[rRobis]

I'm still experimenting with this new technique, and it seems that it's working (at least in my case). I make changes, save, refresh, and in firefox it gets changes on first reload.

Maybe someone finds this useful.

I created a node.js server, that runs with nodemon like this:

cd "GRobe Scripts/GRobe/GRobeNode"
fnm use v19.9.0
nodemon app.js

In this app.js i have contents like this:

const express = require('express')
const cors = require('cors');
const fs = require('fs');
const path = require('path');
var process = require('process');

process.chdir('/home/USERNAME/GRobe Scripts/');

const util = require('util');
const readFile = util.promisify(fs.readFile);

const app = express()

// CORS without limitations
app.use(cors());

// Make a endpoint for a script bundle, that sends combined script text
app.get('/GRobeGeneralBundle', async (req, res) => {
    const fileUrls = [
    'GRobe/Shared/smallFunctions.js',
    'GRobe/Shared/mousetrap.js',
    'GRobe/GRobeGeneral/GRobeGeneral.js',
    ];
combineStringSend(fileUrls, res)
});

async function combineFilesSequentially(fileUrls) {
  let combinedScript = '';

  for (const fileUrl of fileUrls) {
    const fileData = await readFile(fileUrl, 'utf8');
    combinedScript += fileData;
  }

  return combinedScript;
}

async function combineStringSend(fileUrls, res){
    try {
        const combinedScript = await combineFilesSequentially(fileUrls);
        res.send(combinedScript);
    } catch (error) {
        console.error('Error combining CSS files:', error);
        res.status(500).send('Internal Server Error');
    }
}
app.listen(3000,()=>{
    console.log('Sever is running on localhost:3000')
})

And in the tampermonkey script i have it like this:

// ==UserScript==
// @name         GRobe™ General
// @namespace    GRobe
// @version      0.3
// @description  GRobe™
// @author       You
// @match        *://*/*
// @run-at       document-start
// @grant        GM_xmlhttpRequest
// ==/UserScript==

(()=>{const e="http://127.0.0.1:3000/GRobeGeneralBundle";const t=e=>{if(200===e.status&&e.responseText){eval(e.responseText)}else{console.error("Error loading Node.JS Script:",e.statusText)}};const n=()=>{GM_xmlhttpRequest({method:"GET",url:e,onload:t,onerror:t})};document.addEventListener("DOMContentLoaded",n)})();

The minified code is :
Basically it makes request to the endpoint and gets the combined script text and evaluates it, after the page has loaded

(function () {
	var nodeJSEndPoint = 'http://127.0.0.1:3000/GRobeGeneralBundle';

	// Function to evaluate the fetched script
	function evaluateScript(scriptContent) {
		eval(scriptContent);
	}

	// Function to handle the GM_xmlhttpRequest response
	function handleResponse(response) {
		if (response.status === 200 && response.responseText) {
			evaluateScript(response.responseText);
		} else {
			console.error('Error loading Node.JS Script:', response.statusText);
		}
	}

	// Function to make the GM_xmlhttpRequest
	function makeRequest() {
		GM_xmlhttpRequest({
			method: 'GET',
			url: nodeJSEndPoint,
			onload: handleResponse,
			onerror: handleResponse
		});
	}

	// Wait for the DOMContentLoaded event before making the request
	document.addEventListener('DOMContentLoaded', makeRequest);
})();