AJAX - Tips per il Debug



Sviluppando pagine web pesantemente modificate a RunTime dal Javascript, spessissimo e' utile al debug visualizzare il sorgente della pagina per individuare dove e perche' il contenuto dinamico non fa quello che vorremmo.

Sorge a questo punto un problema, in quanto la semplice funzione del browser per la visualizzazione dei sorgenti della pagina non visualizza alcun contenuto generato/modificato dal substrato JavaScript utilizzato in AJAX.

Per aggirare il problema possiamo utilizzare delle semplici funzioni JavaScript da copiare nella barra degli indirizzi del browser.

Questa permette di visualizzare il contenuto della pagina nella stessa finestra del browser:

javascript:'<xmp>'+window.document.documentElement.outerHTML +'</xmp>';

Questa invece visualizza il tutto in un popup:

javascript:void(window.open("javascript:'<xmp>' + opener.window.document.documentElement.outerHTML + '</xmp>'")); 

Le funzioni sopracitate funzionano esclusivamente con Internet Explorer e Opera, per ottenere lo stesso risultato con FireFox e' necessario apportare qualche modifica:

javascript:'<textarea rows=30 cols=120>'+document.getElementsByTagName("html")[0].innerHTML+'</textarea>'; 

Abbiamo dovuto infatti modificare la lettura del sorgente della pagina utilizzando la funzione getElementsByTagName e utilizzare una TextArea per contenere il tutto, in quanto FireFox tenta comunque di effettuare il rendering del codice, rivisualizzando la pagina tale e quale a prima.

Published: February 27 2006

  • category: