Estendere Selenium per validare pagine web, parte 2

Nel precedente articolo abbiamo visto come sia semplice fare delle chiamate XmlhttpRequest da Selenium testando il tutto sul css validator.

In un’ottica di automatizzare i test di selenium con Hudson (vedi plugin), potremmo pensare anche di salvare o di inviare per email il report generato da guardare in un secondo momento.

Per fare ciò invece di chiamare direttamente il validator potremmo chiamare un proxy scritto in PHP (o in un altro linguaggio) che:

  1. prende in input l’indirizzo della pagina da validare, l’indirizzo email e il tipo di validazione (CSS21, CSS3 ecc)
  2. chiama il validator e ottiene il report in xml
  3. salva il report in html e invia l’html per email (usando un file xslt per fare la trasformazione da xml a html)
  4. restituisca il report xml.

Andiamo a vedere dunque il comando da selenium:

storeLocation entry
checkCss ${entry} validity, email=emidiostani@gmail.com, profile=CSS21
verifyExpression ${validity} true

Come potete vedere una volta memorizzato l’indirizzo della pagina corrente nella variable entry, passiamo tale indirizzo al comando checkCss che restituisce il valore della variabile validity e prende come opzioni l’email e il profile (magari è meglio spostarli nella colonna di centro in futuro). Verifichiamo alla fine che il valore della variabile validity sia true.

Andiamo a vedere il codice (vi risparmio la funzione chiama WebService che abbiamo già visto nel precedente articolo):

Selenium.prototype.doCheckCss = function( uri, names ){

 var email = "";
 var profile = "";
 var array = names.split(',');
 for (var i = 0; i < array.length; i++){
 var name = array[i].trim();
 if(name.substr(0,5)=="email"){
 LOG.info( 'email = ' + name);
 var email_array = name.split('=');
 email = email_array[1];
 }
 else if(name.substr(0,7)=="profile"){
 LOG.info( 'profile = ' + name);
 var profile_array = name.split('=');
 profile = profile_array[1];
 }
 }

 var params = [
 {
 "param" : "uri",
 "value" : uri,
 },
 {
 "param" : "email",
 "value" : email,
 },
 {
 "param" : "profile",
 "value" : profile,
 },
 ];

 var lista = "";
 for(var i=0; i<params.length; i++){
 lista +="&" + params[i].param + "=" + encodeURIComponent(params[i].value);
 }

 var proxycss ="http://192.39.226.51/proxycss.php?";
 var indirizzo = proxycss+lista;
 LOG.info( 'indirizzo = ' + indirizzo);

 var responseXML = chiamaWebService(indirizzo);
 LOG.info( 'response = ' + responseXML);

 for (var i = 0; i < array.length; i++){
 var name = array[i].trim();
 if(name.substr(0,5)!="email" && name.substr(0,7)!="profile"){
 var name2 = "m:"+name;
 LOG.info( 'name2 = ' + name2);
 storedVars[name] = responseXML.getElementsByTagName(name2)[0].firstChild.nodeValue;
 LOG.info( 'callWebService: returned [' + storedVars[name] + ']' );
 }
 }
};

Nella prima parte estraiamo le opzioni email e profile da inserire insieme all’indirizzo (uri) nell’array params.

Concateniamo poi i parametri all’inidirizzo del proxy che contattiamo con la chiamaWebService (notate l’indirizzo ip che ovviamente dovete cambiare).

Estraiamo infine dalla risposta xml i parametri che abbiamo passato (ad eccezione di email e profile) da memorizzare nell’array associativo storedVars (predefinito per Selenium).

Ci resta da vedere il proxy php che dunque deve ricevere uri, email e profile e intrinsecamente:

  1. l’indirizzo della css validator (più altri parametri impliciti)
  2. il path del file xslt da applicare
  3. il path del report da salvare

Ed ecco il codice:

<?php

$uri = trim($_REQUEST['uri']);
$profile = trim(strtolower($_REQUEST['profile']));
$email = trim(strtolower($_REQUEST['email']));
$css = "http://192.39.226.51:8081/css-validator/validator?";
$usermedium = "all";
$warning = "1";
$lang = "en";
$output = "soap12";

if($profile =='')
 $profile="css21";
$address = $css."uri=".$uri."&profile=".$profile."&usermedium=".$usermedium."&warning=".$warning."&lang=".$lang."&output=".$output;
$result = file_get_contents($address);

$XSL = new DOMDocument();
$XSL->load( '/var/www/rest_style_css.xslt', LIBXML_NOCDATA);
$xslt = new XSLTProcessor();
$xslt->importStylesheet( $XSL );
$XML = new DOMDocument();
$XML->loadXML( $result );
$html = $xslt->transformToXML( $XML );

$dir = "reports/css/";
$report = "css-report-". date("H:i:s").".html";
$pathmyFile = "/var/www/".$dir.$report;
$fh = fopen($pathmyFile, 'w') or die("can't open file");
fwrite($fh, $html);
fclose($fh);

if($email !=''){
 $to = $email;
 $subject = 'CSS validation';
 $addresstomyfile = "<a href=http://".$_SERVER['SERVER_ADDR']."/".$dir.$report.">".$report."</a>";
 $message = "Report generated: ".$addresstomyfile." on ".date("j F, Y, g:i a")."\n".$html;
 $headers  = "From: Selenium Server<selenium.server@gmail.com>\r\n";
 $headers .= 'MIME-Version: 1.0' . "\r\n";
 $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
 mail($to, $subject, $message, $headers);
}

header('Content-type: text/xml');
echo $result;
?>

Si suppone dunque che:

  1. avete  la libreria xml e xsl per php (riavviate apache dopo averla installata)
  2. avete creato la cartella reports/css sotto la var/www
  3. avete creato un file xslt (che trovate alla fine dell’articolo) nella var/www
  4. abbiate una applicazione come sendmail che è in ascolto per mandare email

Il codice è facile da leggere:

  • una volta estratti i parametri li concateniamo per chiamare il validator con il metodo file_get_content(),
  • convertiamo il file xml ottenuto in html tramite il file xslt
  • salviamo tale file nella cartella reports/css
  • se l’email era stata passata come opzione allora mandiamo email l’html ottenuto
  • restituiamo (possiamo vedere anche tramite browser) il risultato xml

Potremmo in futuro passare solo una parte del risultato xml per risparmiare banda usata.

Ora potete fare lo stesso con w3c validator (su Ubuntu installate w3c-markup-validator), rss validator (ho testato in remoto ma non installato), l’achecker per l’accessibilità (che potete traquillamente installare (vi consiglio da svn).

File xslt da usare:

<?xml version="1.0"?>
<xsl:stylesheet xmlns:m="http://www.w3.org/2005/07/css-validator" version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
 <xsl:output method="html" encoding="UTF-8"/>
 <xsl:template match="m:cssvalidationresponse">
 <html>
 <head>
 <title>CSS report</title>
 </head>
 <body>
 <table width="100%">
 <TR bgcolor="#f7f3fd">
 <TD colspan="6">Analyzed web page address:
 <a href="{m:uri}" onclick="popup('{m:uri}; return false;')" title="{m:uri}" target="_new">
 <xsl:value-of select="m:uri" />
 </a>
 </TD>
 </TR>
 <TR bgcolor="#f7f3fd">
 <TD colspan="3"><B>Errors</B></TD>
 </TR>
 <TR bgcolor="#f7f3fd">
 <TD><B>Line</B></TD>
 <TD><B>Error Type</B></TD>
 <TD><B>Context</B></TD>
 <TD><B>Error Subtype</B></TD>
 <TD><B>Skipped String</B></TD>
 <TD><B>Message</B></TD>
 </TR>
 <xsl:for-each select="m:result/m:errors/m:errorlist/m:error">
 <tr>
 <xsl:if test="(position() mod 2 = 1)">
 <xsl:attribute name="bgcolor">#EEEEFF</xsl:attribute>
 </xsl:if>
 <TD><xsl:value-of select="m:line" /></TD>
 <TD><xsl:value-of select="m:errortype" /></TD>
 <TD><xsl:value-of select="m:context" /></TD>
 <TD><xsl:value-of select="m:errorsubtype" /></TD>
 <TD><xsl:value-of select="m:skippedstring" /></TD>
 <TD><xsl:value-of select="m:message" /></TD>
 </tr>
 </xsl:for-each>
 </table>
 <br/>
 <table width="100%">
 <TR rowspan="4" bgcolor="#f7f3fd">
 <TD width="10%"><B>Warnings</B></TD>
 </TR>
 <TR bgcolor="#f7f3fd">
 <TD width="10%"><B>Line</B></TD>
 <TD width="10%"><B>Level</B></TD>
 <TD width="70%"><B>Message</B></TD>
 <TD width="10%"><B>Context</B></TD>
 </TR>
 <xsl:for-each select="m:result/m:warnings/m:warninglist/m:warning">
 <tr>
 <xsl:if test="(position() mod 2 = 1)">
 <xsl:attribute name="bgcolor">#EEEEFF</xsl:attribute>
 </xsl:if>
 <TD width="10%"><xsl:value-of select="m:line" /></TD>
 <TD width="10%"><xsl:value-of select="m:level" /></TD>
 <TD width="70%"><xsl:value-of select="m:message" /></TD>
 <TD width="10%"><xsl:value-of select="m:context" /></TD>
 </tr>
 </xsl:for-each>
 </table>
 </body>
 </html>
 </xsl:template>
</xsl:stylesheet>
Advertisements

Esempio con XML e XSLT

Oggi in azienda mi è stato chiesto di fare una breve lista di software libero che puo’ essere interessante da usare per testing, bug tracking; cosi ho preso a scrivere l’elenco in xml per transformalo in una tabella HTML:

<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="open_source_tools.xslt"?>
<tools>
 <tool>
 <name>Hudson</name>
 <url>http://hudson-ci.org/</url>
 <description>Hudson is a scalable continuous integration server, it allows to do automatic building, document generation, perform unit tests and support for several language, Java in particular</description>
 <license>MIT license</license>
 <requirements>JDK, an Application Server is optional but recommended</requirements>
 <documentation>http://wiki.hudson-ci.org/display/HUDSON/Use+Hudson</documentation>
 <latestversion>1.340, 11 January 2010</latestversion>
 </tool>
 <tool>
 <name>Junit</name>
 <url>http://www.junit.org/</url>
 <description>Junit allows to perform unit test on the java source code</description>
 <license>Common Public License 1.0</license>
 <requirements>JDK</requirements>
 <documentation>http://junit.sourceforge.net/</documentation>
 <latestversion>4.8.1, 8 December 2009</latestversion>
 </tool>
 <tool>
 <name>Jmeter</name>
 <url>http://jakarta.apache.org/jmeter/</url>
 <description>Java desktop application designed to load test functional behavior and measure performance</description>
 <license>Apache License 2.0</license>
 <requirements>JVM 1.4+</requirements>
 <documentation>http://jakarta.apache.org/jmeter/usermanual/index.html</documentation>
 <latestversion>2.3.4, 17 June 2009</latestversion>
 </tool>
 <tool>
 <name>soapUI</name>
 <url>http://www.soapui.org/</url>
 <description>Tool for Web Service Testing</description>
 <license>GNU Library or Lesser General Public License (LGPL)</license>
 <requirements>JVM</requirements>
 <documentation>http://www.soapui.org/userguide/index.html</documentation>
 <latestversion>3.5, 15 January 2010</latestversion>
 </tool>
 <tool>
 <name>Selenium</name>
 <url>http://seleniumhq.org/</url>
 <description>Selenium allows to do automatic User Interface test</description>
 <license>Apache License 2.0</license>
 <requirements>IDE Based on Firefox, RC based on Java</requirements>
 <documentation>http://seleniumhq.org/docs/</documentation>
 <latestversion>1.0.2, 30 June 30 2009 </latestversion>
 </tool>
 <tool>
 <name>Sonar</name>
 <url>http://sonar.codehaus.org/</url>
 <description>Sonar allows to evaluate the quality of the source code using a combination of tools like PMD, Checkstile and Findbugs</description>
 <license>GNU General Public License</license>
 <requirements>JDK, Maven, Database (Derby/MySQL/Oracle/PostgreSQL)</requirements>
 <documentation>http://sonar.codehaus.org/documentation/</documentation>
 <latestversion>1.12, 7 December 2009</latestversion>
 </tool>
 <tool>
 <name>Bugzilla</name>
 <url>http://www.bugzilla.org/</url>
 <description>Bug tracking tool</description>
 <license>Mozilla Public License</license>
 <requirements>Web server (Apache), Perl, Database (MySQL/PostgreSQL)</requirements>
 <documentation>http://www.bugzilla.org/docs/</documentation>
 <latestversion>3.4.4, 18 November 2009</latestversion>
 </tool>
 <tool>
 <name>Redmine</name>
 <url>http://www.redmine.org/</url>
 <description>Bug tracking tool</description>
 <license>GNU General Public License</license>
 <requirements>Ruby, Database (MySQL/PostgresSQL, SQLite)</requirements>
 <documentation>http://www.redmine.org/wiki/redmine/Guide</documentation>
 <latestversion>0.8.7 15 November 2009</latestversion>
 </tool>
</tools>

Come potete vedere il file xml contiene alla radice il nodo tools con dentro i singoli nodi tool ognuno con suoi sotto nodi. E’ un semplice file XML con incluso il file xslt nella prima riga.

Vediamo ora il file XSLT:

<?xml version="1.0"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" encoding="UTF-8"/>
<xsl:template match="/">
<html>
<head><title>Open Source Tools</title>
</head>
<body>
<table width="100%" border="1">
 <thead>
 <tr>
 <td width="5%"><b>Name</b></td>
 <td width="15%"><b>URL</b></td>
 <td width="35%"><b>Description</b></td>
 <td width="15%"><b>License</b></td>
 <td width="10%"><b>Requirements</b></td>
 <td width="10%"><b>Documentation</b></td>
 <td width="10%"><b>Latest Version</b></td>
 </tr>
 </thead>
 <tbody>
 <xsl:for-each select="tools/tool">
 <xsl:sort select="name"/>
 <tr>
 <xsl:if test="(position() mod 2 = 1)">
 <xsl:attribute name="bgcolor">#EEEEFF</xsl:attribute>
 </xsl:if>
 <td width="5%">
 <xsl:value-of select="name" />
 </td>
 <td width="15%">
 <a href="{url}">
 <xsl:value-of select="url"/>
 </a>
 </td>
 <td width="35%">
 <xsl:value-of select="description" />
 </td>
 <td width="15%">
 <xsl:value-of select="license" />
 </td>
 <td width="10%">
 <xsl:value-of select="requirements" />
 </td>
 <td width="10%">
 <a href="{documentation}">
 <xsl:value-of select="documentation" />
 </a>
 </td>
 <td width="10%">
 <xsl:value-of select="latestversion" />
 </td>
 </tr>
 </xsl:for-each>
 </tbody>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>

Come notiamo che:

  • alla riga 02 diciamo che vogliamo generare un output html con codifica UTF-8
  • alla riga 03 usiamo il tag template che punta alla radice del file XML di origine (carattere /)
  • dalla riga 04 alla 20 inseriamo il codice per una tabella HTML dove indichiamo da mettere tutti sottocampi dei nodi tool uno per ogni colonna
  • alla riga 21 usiamo il tag for-each dicendo di selezionare tutti nodi tool sotto il nodo originale tools.
  • alla riga 22 usiamo il tag sort diciamo di ordinare i nodi tool per i loro sottonodi name
  • alla riga 23 iniziamo a scrivere la riga che dovrà comparire e dovremo estrarre i vari campi uno per ogni cella
  • alla riga 24-25 inserisco una condizione che mi permette di aggiungere il colore alle righe dispari (position() mod 2 = 1), il metodo position() parte da 1; dunque se le condizione if è soddisfatta aggiungiamo, con la riga 25, l’attributo bgcolor alla riga tramite il tag attribute
  • ora per ogni cella td dalla riga 27 alla riga 51 estraiamo il ogni singolo sottonodo attraverso il tag value-of
  • Siccome vorrei creare un link al sito ufficiale per ogni software trasformo il testo nel sottonodo url in un hyperlink (html tag a) usando le parentesi graffe per indicare tramite XPATH il sottonodo (url per esempio) ed inserisco il valore dello stesso sottonodo usando il tag value-of .

Aprite il file xml con il vostro browser. A voi un po di divertimento nel provare.

XML, Java e dintorni

Nel mio ultimo progetto ho lavorato molto con l’XML per via dei web services e dei relativi data-binding. Più che altro sono stato incuriosito da questo libro e cosi’ ho cominciato a spulciare in rete se ne vale l’acquisto, partendo dalle origini delle librerie JAVA per XML perchè dovete sapere che al di là di uno standard ci sono le sue implementazioni….

Per chi non lo sapesse in pratica esistono 2 famosi parser XML chiamati DOM (giunto alla versione 3 nell’Aprile 2004) e SAX (giunto alla versione 2.0.2 nello stesso mese), a cui si è aggiunto nel tempo STAX cercando di prendere i vantaggi da entrambi.

Per cercare di omogeneizzare l’XML estrapolato da DOM, SAX e STAX, quelli di SUN (principalmente Jeff Suttor, Norman Walsh) realizzano una serie di interfacce e classi  sotto il nome di JAXP 1.3, sorgente che viene donato nell’aprile 2005 (Neeraj Bajaj compare tra i nomi della documentazione java) a quelli di Apache.

Vediamo poi che JAXP 1.3 finisce il suo corso nel Febbraio 2008 a cui segue JAXP 1.4  per essere incluso in JAVA SE 6. Tuttavia JAXP 1.3 è ancora un punto di riferimento.

Affianco ai parser troviamo l’XSL che include:

  • XSLT per trasformare un documento XML in un altro che sia anche HTML o WML, ha bisogno di un processore XSLT che sappia interpretare il foglio di stile XSLT.
  • XPath che è un linguaggio usato da XSLT per accedere a parti di un documento XML
  • XSL-FO usato per formattare documenti XML la cui implementazione è realizzata dalle librerie Apache FOP ( il cui sito è davvero interessante) principalmente pensato per convertire il documento in PDF ma non solo.

Tornando alle librerie Java abbiamo:

  • Xalan 2.7.1 che è un XSLT processor il quale si basa su JAXP 1.3, XSLT 1.0 e XPATH 1.0
  • Xerces 1.4.4 che è un parser java basato su XML 1.0, DOM 1/2 e SAx 1/2

Tornando indietro nel tempo, il 23 gennaio 2007 al W3C i vari working group rilasciano diverse specifiche che coinvolgono XQuery 1.0, XPath 2.0 e XSLT 2.0. Nei working group vediamo principalmente IBM, SUN (ritroviamo Norman Walsh coinvolto) e Oracle.

XQuery nasce come linguaggio per fare query su database in XML, il linguaggio è, diciamo, più naturale del XSLT.

L’unico editor dell’ XSLT 2.0 è Michael Kay, il quale prima lavorava per Software AG e poi si mette in proprio per fondare Saxonica da cui Saxon l’XSLT processor.

Saxon è quindi l’unico ad implementare XSLT 2.0 (ci dovrebbe essere uno di Oracle) che rispetta le specifiche …del suo stesso autore :-) . Saxon, viene rilasciato nella versione Saxon-B come open source mentre la versione Saxon-SA rilasciato con licenza commerciale; solo che la versione open souce è veramente limitata.

Di conseguenza non credo per ora di prendere il libro anche se puo’ essere uno stimolo per studiare XSLT 1.0 almeno.

Note: