preload

XML/XSL Transformation: Tree to Table

Posted by Albert Gareev on Mar 04, 2011 | Categories: ReportingSource codeXML Data

Parent page: Generating Test Reports

Today I present XML Tree to HTML Table transformation example.
Here’s our XML record simulating logged test steps.

XML Source

<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet type="text/xsl" href=".\Tree2Table.xsl"?>
<log>
  <step type="GUI Step">
    <description>Pasted data [User1234] in edit box [Username] </description>
  </step>
  <step type="GUI Step">
    <description>Pasted data [Password1234] in edit box [Password]</description>
  </step>
  <step type="GUI Step">
    <description>Clicked on button [Login]</description>
  </step>
</log>

Did you notice the following line?

<?xml-stylesheet type=”text/xsl” href=”.\Tree2Table.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">&#160;</xsl:variable>

<xsl:template match="/">

<html>

<head>
<title>automation-beyond.com | Tree2Table XML/XSL Transformation Example by Albert Gareev</title>
</head>

<body bgcolor="#c0c0c0">

<H1 align="center">Tree2Table</H1>
<H4 align="center">XML/XSL Transformation Example by <A HREF="http://automation-beyond.com/about/">Albert Gareev</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>
  <TD><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>
</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

  • Define template of a table
  • Select XML elements in a lop (with xsl:for-each)
  • Insert node values into table cells (with xsl:value-of)

 

And here is the package containing the original XML and XSL files.


  • One response to "XML/XSL Transformation: Tree to Table"

  • Shmuel Gershon
    5th March 2011 at 16:01

    Pretty cool Albert.
    Humm… Thinking now about a certain CSV to XML transformation… :)

    [ Albert’s reply. Sh-sh-sh, that’s supposed to be a surprise :) ]

Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported
This work by Albert Gareev is licensed under a Creative Commons Attribution-NonCommercial-NoDerivs 3.0 Unported.