Installare Node.js: verificare il funzionamento dei pulsanti sul server senza browser
Per eseguire JavaScript su un server bisogna prima installare Node.js. Ho installato Node.js 24.21.0 su un server WordPress con Nginx e Apache e, con jsdom 30.1.3, ho controllato senza browser lo script dei pulsanti di una pagina web.
Il nodejs del repository predefinito è la 16.20.2, ma jsdom 30.1.3, che uso per controllare gli script, richiede Node.js 22.22.2 o superiore. Per questo ho installato dallo stream del modulo dnf 24.
1️⃣ Perché installare Node.js e jsdom sul server
Per controllare gli script dei pulsanti su un server servono due cose: Node.js e jsdom.
🔲 Node.js
JavaScript di solito viene eseguito nel browser, ma installando Node.js anche il server può leggere ed eseguire JavaScript.
Installare Node.js significa mettere anche sul server l’ambiente di esecuzione JavaScript che prima c’era solo nel browser. Per questo Node.js si usa per creare server web, scrivere comandi che elaborano molti file in una volta o caricare pacchetti come jsdom e controllare le pagine. Anche Ghost è un CMS che gira su Node.js.
🔲 jsdom
jsdom è un pacchetto per Node.js che legge l’HTML e lo trasforma in un documento in cui si possono premere i pulsanti come in un browser. Ricrea nel server, senza schermo, la struttura del documento (DOM) che il browser costruisce quando apre una pagina, così gli script trovano i pulsanti e cambiano il testo come in un vero browser. Poiché non apre finestre, si esegue sul server con un solo comando.
In altre parole, i controlli che una persona faceva aprendo il browser e cliccando uno per uno vengono svolti dal server con un comando. Per questo jsdom si usa anche per testare automaticamente il comportamento dei pulsanti a ogni correzione, estrarre da una pagina solo contenuti come titoli e link o ritoccare in blocco l’HTML degli articoli.
Se scarichi una pagina con PHP o curl, vedi solo l’HTML arrivato all’inizio. Il testo che cambia dopo aver premuto un pulsante compare solo quando lo script viene eseguito.
Il browser esegue quattro passaggi: ricevere la pagina, leggere la pagina, premere il pulsante e mostrare sullo schermo. jsdom esegue sul server tutti i passaggi tranne la visualizzazione, quindi posizione e dimensioni di un pulsante si verificano nel browser.
2️⃣ Prima dell’installazione: repository predefinito e stream dei moduli
Prima di eseguire [dnf install nodejs], controlla quale versione verrebbe installata. Il nodejs del repository predefinito di AlmaLinux 9.8 è la 16.20.2.
dnf list --available nodejsAvailable Packages
nodejs.x86_64 1:16.20.2-8.el9_4 appstreamIl repository dei moduli ha quattro stream: 18, 20, 22 e 24. Alla data della verifica lo stream 22 era alla 22.23.2 e lo stream 24 alla 24.21.0.
dnf module list nodejsnodejs 18 common [d], development, minimal, s2i Javascript runtime
nodejs 20 common [d], development, minimal, s2i Javascript runtime
nodejs 22 common [d], development, minimal, s2i Javascript runtime
nodejs 24 common [d], development, minimal, s2i Javascript runtimeSecondo il registro npm, jsdom 30.1.3 richiede la 22.22.2 o superiore nella serie 22, la 24.15.0 o superiore nella serie 24, oppure la 26 e successive. Sia lo stream 22 sia il 24 soddisfano questa condizione.
3️⃣ Installare Node.js: dnf module
Questa volta ho installato lo stream 24 e, prima di eseguirlo, ho controllato con l’opzione [--assumeno] l’elenco dei pacchetti da installare.
dnf module install nodejs:24 --assumenoL’elenco conteneva solo cinque pacchetti: nodejs, npm, nodejs-libs, nodejs-docs e nodejs-full-i18n. Non c’erano pacchetti del server web, di PHP né del kernel. Dopo il controllo si procede all’installazione con l’opzione [-y].
dnf module install -y nodejs:24Dependencies resolved.
==============================================================================================
Package Architecture Version Repository Size
==============================================================================================
Installing group/module packages:
nodejs x86_64 1:24.21.0-1.module_el9.8.0+321+1555b6a2 appstream 70 k
npm noarch 1:11.19.0-1.24.21.0.1.module_el9.8.0+321+1555b6a2 appstream 2.1 M
Installing dependencies:
nodejs-libs x86_64 1:24.21.0-1.module_el9.8.0+321+1555b6a2 appstream 24 M
Installing weak dependencies:
nodejs-docs noarch 1:24.21.0-1.module_el9.8.0+321+1555b6a2 appstream 5.3 M
nodejs-full-i18n x86_64 1:24.21.0-1.module_el9.8.0+321+1555b6a2 appstream 8.9 M
Installing module profiles:
nodejs/common
Enabling module streams:
nodejs 24
Transaction Summary
==============================================================================================
Install 5 Packages
Total download size: 40 M
Installed size: 185 M[Installing weak dependencies] elenca le dipendenze deboli (weak dependencies), pacchetti che conviene installare insieme. Il download è di 40M e l’installazione di 185M.
node -vv24.21.0npm -v11.19.0cat /etc/dnf/modules.d/nodejs.module[nodejs]
name=nodejs
stream=24
profiles=common
state=enablednode è stato installato alla 24.21.0 e npm alla 11.19.0. L’unico file di configurazione modificato dall’installazione è [/etc/dnf/modules.d/nodejs.module], che registra come attivi lo stream 24 e il profilo common.
4️⃣ Installare jsdom e controllare lo script di un pulsante
jsdom si installa con npm in una cartella di lavoro, che va creata fuori dalla web root.
mkdir ~/jsdom-test && cd ~/jsdom-test
npm init -y[npm init -y] crea package.json con i valori predefiniti, poi jsdom viene installato nella stessa cartella.
npm install jsdomadded 36 packages, and audited 37 packages in 2s
8 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilitiesnpm ls jsdomjsdom-test@1.0.0 /root/jsdom-test
└── jsdom@30.1.3Sono stati installati 36 pacchetti, compreso jsdom 30.1.3, con 0 vulnerabilità note. La cartella node_modules nella cartella di lavoro occupa 26M.
node -e 'const { JSDOM } = require(`jsdom`); console.log(new JSDOM(`<h1>Ciao</h1>`).window.document.querySelector(`h1`).textContent)'CiaoSe jsdom legge come documento un HTML fatto di un solo tag h1 e stampa il testo al suo interno, [Ciao], la verifica è conclusa.
Controllare lo script di un pulsante significa verificare sul server che il testo cambi correttamente dopo il clic. Come esempio ho creato nella cartella di lavoro un file HTML in cui, premendo il pulsante [Copia], il testo diventa [Copiato].
cat btn.html<button id="copy">Copia</button>
<script>
document.getElementById('copy').addEventListener('click', function () {
this.textContent = 'Copiato';
});
</script>Lo script di controllo legge il file HTML con jsdom, esegue gli script e stampa il testo prima e dopo il clic. Gli errori dello script vengono stampati su righe che iniziano con [Errore:].
cat check.jsconst fs = require('fs');
const { JSDOM, VirtualConsole } = require('jsdom');
const vc = new VirtualConsole();
vc.on('jsdomError', (e) => console.log('Errore:', e.message));
const dom = new JSDOM(fs.readFileSync(process.argv[2], 'utf8'), {
runScripts: 'dangerously',
virtualConsole: vc,
});
const btn = dom.window.document.querySelector('#copy');
console.log('Prima del clic:', btn.textContent);
btn.click();
console.log('Dopo il clic:', btn.textContent);node check.js btn.htmlPrima del clic: Copia
Dopo il clic: CopiatoDopo il clic il testo diventa [Copiato], a conferma che lo script del pulsante funziona.
Basta un refuso nello script per cambiare il risultato. Ho eseguito lo stesso controllo su un file in cui la I maiuscola di getElementById era stata sostituita da una l minuscola.
sed 's/getElementById/getElementByld/' btn.html > btn-broken.html
node check.js btn-broken.htmlErrore: Uncaught [TypeError: document.getElementByld is not a function]
Prima del clic: Copia
Dopo il clic: CopiaSulla prima riga compare un errore e lo script si ferma, quindi il testo resta [Copia] anche dopo il clic.
Ho assegnato al pulsante con il CSS una larghezza di 120px e un’altezza di 40px e poi ne ho stampato le dimensioni.
cat size.jsconst { JSDOM } = require('jsdom');
const dom = new JSDOM('<button id="copy" style="width:120px;height:40px">Copia</button>');
const btn = dom.window.document.querySelector('#copy');
console.log('altezza:', btn.offsetHeight, '/ larghezza:', btn.getBoundingClientRect().width);node size.jsaltezza: 0 / larghezza: 0jsdom non ha la fase di disegno sullo schermo, quindi altezza e larghezza vengono stampate come 0.
🔢 FAQ & contenuti consigliati
ℹ️ Informativa sull'affiliazione
I contenuti di questo sito includono link di affiliazione. Se un visitatore acquista un prodotto o un servizio tramite uno di questi link, il sito riceve una commissione dal venditore. In questo processo l'importo pagato dall'acquirente (durante le promozioni l'importo scende↓) non aumenta. Prezzi, sconti e disponibilità indicati si riferiscono al momento della stesura e possono differire da quelli reali: prima di acquistare verifica sempre presso il venditore. I prodotti vengono scelti e valutati secondo criteri propri, e le commissioni non influiscono sull'ordine di presentazione né sul contenuto delle valutazioni.