Skip to content

Concepts for SASUnit style

KLandwich edited this page Jan 31, 2024 · 1 revision

Introduction

Due to the fact that SASUnit renders reports via ODS and uses css files you can easily change the style.

SASUnit Style needs four css-files and one PROC TEMPLATE

In order to maintain or create new styles with little manual doing we decide to use separate css files. You can find them in your SASUnit installation under .../resources/css.

  • CallGraph.css
  • SASUnit.css
  • SASUnit_PROC_TEMPLATE.css
  • SASUnit_classic.css
  • SASUnit_classic_PROC_TEMPLATE.css
  • Treeview.css

Each of them has a special purpose.

CallGraph.css

Callgraph.css holds the style for rendering the cross reference. In my opinion this can be left unchanged for different styles.

<StyleName>.css

This file is the master css file. It is referenced in the HTML files. It does the following

  • Reference the other css files
    • <StyleName>_PROC_TEMPLATE.css
    • Treeview.css
  • Updates link defintion of SAS generated css file
  • Holds the style defintioen for the tabs
  • SASUnit classic tabs are based on this article

<StyleName>_PROC_TEMPLATE.css

For ease of use this file is created via SAS Statements and left unchanged. It holds the style definition styles.<StyleName> created by PROC TEMPLATE.

Treeview css

This css file holds the style for the HTML tree view. The treeview is inspired by this article

Style definition in PROC TEMPLATE

Now it's time to tell what you need to specify in a PROC TEMPLATE style definition. The current styles are copies from styles.default. You can start with any parent. So you don't need to copy styles.default. The definition needs to be placed in this SASUnit macro: saspgm/_reportcreatestyle.sas.

What the style consists of

The style defintion should hold all the style elements defined by SAS. In addition there are some special style elements we use in SASUnit. These must be included in your style.

List of new style elements

Here is the complete list of additonal style elements:

Color definitions

The color_list holds these new color definitions:

style color_list

     ... all SAS color definitions
     
     /* Testcoverage */
     'fgTcgCovered'    = cx00BE00
     'fgTcgNonCovered' = cxFF8020
     'fgTcgComment'    = cx828282
     'fgTcgNonContrib' = cx8020FF
     'fgErrorCount'    = red
     /* Program documentation */
     'bgPgmDocTodo'   = Bisque
     'bgPgmDocTest'   = LightBlue
     'bgPgmDocBug'    = LightCoral
     'bgPgmDocRemark' = LightGreen
     'fgPgmDocDep'    = white
     'bgPgmDocDep'    = cx808080
     'fgPgmDocSource' = cx606060

New style elements for SASUnit reports

Style elements for a table that looks like background (blindTable)
blindTable from table "Table that appears like background" 
blindData from data "Data cell in a blind Table"
blindHeader from header "Header cell in a blind Table"
blindCaption from blindData "Caption row in a blind Table"
blindDataStrong from DataStrong "Strong data cell in a blind Table"
blindFixedFontData from blindData "Fixed font data cell in a blind Table"
Style elements for test coverage report
tcgCoveredData "data cell with covered code in tcg report"
tcgNonCoveredData "data cell with non-covered code in tcg report"
tcgCommentData "data cell with commented code in tcg report"
tcgNonContribData "data cell with non-contributing code in tcg report"
Style elements for rendering overview pages
logerrcountmsg from blindData "Count of scenario error messages in test case overview"
datacolumnerror "Renders an error in a column"
Style elements for JQuery tablesorter
tablesorterheader "Tablesorter-header for jQuery TableSorter"
headerSortUp "HeaderSortUp for jQuery TableSorter"
tablesorterheaderSortUp "Ablesorter-headerSortUp for jQuery TableSorter"
tablesorterheaderAsc "Tablesorter-headerAsc for jQuery TableSorter"
headerSortDown "HeaderSortDown for jQuery TableSorter"
tablesorterheaderSortDown "Tablesorter-headerSortDown for jQuery TableSorter"
tablesorterheaderDesc "Tablesorter-headerDesc for jQuery TableSorter"
Style elements for SASUnit program documentation
pgmDocHeader from Header "Header of pgmdoc report"
pgmDocTodoHeader from Header "Header of ToDo section in pgmdoc report"
pgmDocTestHeader from Header "Header of Test section in pgmdoc report"
pgmDocBugHeader from Header "Header of Bug section in pgmdoc report"
pgmDocRemarkHeader from Header "Header of Remark section in pgmdoc report"
pgmDocDepHeader from Header "Header of Deprecated section in pgmdoc report"
pgmDocData from Data "data cell of pgmdoc report"
pgmDocDataStrong from DataStrong "strong data cell of pgmdoc report"
pgmDocSource from blindFixedFontData "strong data cell of pgmdoc report"
pgmDocBlindData from blindData "data cell of pgmdoc report"
pgmDocBlindDataStrong from blindDataStrong "strong data cell of pgmdoc report"
pgmDocTodoData from  pgmDocTodoHeader "data cell of ToDo section in pgmdoc report"
pgmDocTestData from pgmDocTestHeader "data cell of Test section in pgmdoc report"
pgmDocBugData from pgmDocBugHeader "data cell of Bug section in pgmdoc report"
pgmDocRemarkData from pgmDocRemarkHeader  "data cell of Remark section in pgmdoc report"
pgmDocDepData from pgmDocDepHeader "data cell of Deprecated section in pgmdoc report"
Clone this wiki locally