XML/XSL Transformation: Using Complex Nodes
Parent page: Generating Test Reports
Today I present example on dynamically building HTML nodes, with XSL, and from XML data.
Here’s our XML record simulating log data of a test session.
XML Source
<?xml version="1.0" encoding="utf-8"?> <?xml-stylesheet type="text/xsl" href=".\LogView1.xsl"?> <log> <step type="GUI Step"> <time>21/04/2011 11:45:31 AM</time> <description>Pasted data [User1234] in edit box [Username] </description> </step> <step type="GUI Step"> <time>21/04/2011 11:46:03 AM</time> <description>Pasted data [Password1234] in edit box [Password]</description> </step> <step type="GUI Step"> <time>21/04/2011 11:46:11 AM</time> <description>Clicked on button [Login]</description> </step> <step type="Screenshot"> <time>21/04/2011 11:46:33 AM</time> <filename>20111145_012852.jpg</filename> <description>Weird error dialog</description> </step> </log>
Did you notice the following line?
<?xml-stylesheet type=”text/xsl” href=”.\LogView1.xsl”?>
This is how we instruct the web browser to use XSL script for visualization of XML data.
Web-page Report
And here’s the source code of the script
XSL Source
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" xmlns:xs="http://www.w3.org/2001/XMLSchema"> <!-- variables --> <xsl:variable name="CHAR_SPC"> </xsl:variable> <xsl:template match="/"> <html> <head> <title>automation-beyond.com | TestLog XML/XSL Transformation Example by </title> </head> <body bgcolor="#c0c0c0"> <H1 align="center">Test Log</H1> <H4 align="center">XML/XSL Transformation Example by <A HREF="http://automation-beyond.com/about/"></A></H4> <BR /> <P /> <h3 align="center">Test Steps</h3> <BR /> <TABLE id="automation-beyond-2010" BORDER="1" width="650" align="center"> <TR> <TH width="150">Step Name</TH> <TH width="500">Step Description</TH> </TR> <xsl:for-each select="log/step"> <TR> <xsl:choose> <xsl:when test = " @type = 'Screenshot' "> <TD> <xsl:attribute name="title"><xsl:value-of select = "time" /></xsl:attribute> <xsl:value-of select = "@type" /> </TD> <TD> <xsl:attribute name="title">Click on the link to view the image attached</xsl:attribute> <A TARGET="_blank"> <xsl:attribute name="href"> <xsl:value-of select="filename" /> </xsl:attribute> <xsl:value-of select = "description" /> </A> </TD> </xsl:when> <xsl:otherwise> <TD> <xsl:attribute name="title"><xsl:value-of select = "time" /></xsl:attribute> <xsl:value-of select = "@type" /><xsl:value-of select = "$CHAR_SPC" /> </TD> <TD><xsl:value-of select = "description" /><xsl:value-of select = "$CHAR_SPC" /></TD> </xsl:otherwise> </xsl:choose> </TR> </xsl:for-each> </TABLE> <BR /> <div align="center"> <A HREF="http://automation-beyond.com/chapters/tutorials/test-reports/">Home</A> </div> <BR /> </body> </html> </xsl:template> </xsl:stylesheet>
How To
- Select type of XML node with xsl:choose
- Insert node values into table cells
- Add addtributes to HTML nodes with xsl:attribute
And here is the package containing the original XML and XSL files.
