Skip to content

Commit

Permalink
Refactor report tabs to allow multiple levels (#31822)
Browse files Browse the repository at this point in the history
  • Loading branch information
big-guy authored Dec 18, 2024
2 parents 542b4f4 + f0205ce commit 3d14150
Show file tree
Hide file tree
Showing 5 changed files with 136 additions and 119 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -34,23 +34,19 @@ public void clear() {

@Override
public void render(T model, SimpleHtmlWriter htmlWriterWriter) throws IOException {
htmlWriterWriter.startElement("div").attribute("id", "tabs");
htmlWriterWriter.startElement("div").attribute("class", "tab-container");
htmlWriterWriter.startElement("ul").attribute("class", "tabLinks");
for (int i = 0; i < this.tabs.size(); i++) {
TabDefinition tab = this.tabs.get(i);
String tabId = "tab" + i;
for (TabDefinition tab : this.tabs) {
htmlWriterWriter.startElement("li");
htmlWriterWriter.startElement("a").attribute("href", "#" + tabId).characters(tab.title).endElement();
htmlWriterWriter.startElement("a").attribute("href", "#").characters(tab.title).endElement();
htmlWriterWriter.endElement();
}
htmlWriterWriter.endElement();

for (int i = 0; i < this.tabs.size(); i++) {
TabDefinition tab = this.tabs.get(i);
String tabId = "tab" + i;
htmlWriterWriter.startElement("div").attribute("id", tabId).attribute("class", "tab");
htmlWriterWriter.startElement("h2").characters(tab.title).endElement();
tab.renderer.render(model, htmlWriterWriter);
for (TabDefinition tab : this.tabs) {
htmlWriterWriter.startElement("div").attribute("class", "tab");
htmlWriterWriter.startElement("h2").characters(tab.title).endElement();
tab.renderer.render(model, htmlWriterWriter);
htmlWriterWriter.endElement();
}
htmlWriterWriter.endElement();
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -42,11 +42,12 @@ class TabsRendererTest extends Specification {

def html = html(writer.toString());
then:
html.select("div#tabs > ul > li > a").find { it.text() == "tab 1" }
html.select("div#tabs > ul > li > a").find { it.text() == "tab 2" }
html.select("div.tab-container > ul > li > a").find { it.text() == "tab 1" }
html.select("div.tab-container > ul > li > a").find { it.text() == "tab 2" }

html.select("div#tabs > div#tab0 > h2").find { it.text() == "tab 1" }
html.select("div#tabs > div#tab1 > h2").find { it.text() == "tab 2" }
// There is a <ul> for the tabs above, so this starts from 2 and not 1 for the :nth-child selector
html.select("div.tab-container > div:nth-child(2) > h2").find { it.text() == "tab 1" }
html.select("div.tab-container > div:nth-child(3) > h2").find { it.text() == "tab 2" }
}

Document html(String renderedString) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -111,22 +111,23 @@ public void render(TestTreeModel model, SimpleHtmlWriter htmlWriter) throws IOEx

@Override
protected ReportRenderer<TestTreeModel, SimpleHtmlWriter> getContentRenderer() {
final TabsRenderer<TestTreeModel> tabsRenderer = new TabsRenderer<>();
TabsRenderer<TestTreeModel> rootTabsRenderer = new TabsRenderer<>();
getModel().getPerRootInfo().forEach((rootName, info) -> {
// If there is only one root, don't show the root name in the tab title, since it's just confusing.
String tabPrefix = rootDisplayNames.size() == 1 ? "" : ("'" + rootDisplayNames.get(rootName) + "' ");
tabsRenderer.add(tabPrefix + "summary", new PerRootTabRenderer.ForSummary(rootName));
final TabsRenderer<TestTreeModel> tabsRenderer = new TabsRenderer<>();
tabsRenderer.add("summary", new PerRootTabRenderer.ForSummary(rootName));
SerializableTestResultStore.OutputReader outputReader = outputReaders.get(rootName);
if (outputReader.hasOutput(info.getOutputId(), TestOutputEvent.Destination.StdOut)) {
tabsRenderer.add(tabPrefix + "standard output", new PerRootTabRenderer.ForOutput(rootName, outputReader, TestOutputEvent.Destination.StdOut));
tabsRenderer.add("standard output", new PerRootTabRenderer.ForOutput(rootName, outputReader, TestOutputEvent.Destination.StdOut));
}
if (outputReader.hasOutput(info.getOutputId(), TestOutputEvent.Destination.StdErr)) {
tabsRenderer.add(tabPrefix + "error output", new PerRootTabRenderer.ForOutput(rootName, outputReader, TestOutputEvent.Destination.StdErr));
tabsRenderer.add("error output", new PerRootTabRenderer.ForOutput(rootName, outputReader, TestOutputEvent.Destination.StdErr));
}
if (!info.getMetadatas().isEmpty()) {
tabsRenderer.add(tabPrefix + "metadata", new PerRootTabRenderer.ForMetadata(rootName, metadataRendererRegistry));
tabsRenderer.add("metadata", new PerRootTabRenderer.ForMetadata(rootName, metadataRendererRegistry));
}

rootTabsRenderer.add(rootDisplayNames.get(rootName), tabsRenderer);
});
return tabsRenderer;
return rootTabsRenderer;
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,7 @@ body, a, a:visited {
}

#content {
padding-left: 50px;
padding-right: 50px;
padding-top: 30px;
padding-bottom: 30px;
padding: 30px 50px;
}

#content h1 {
Expand Down Expand Up @@ -52,39 +49,42 @@ h2 {
font-size: 120%;
}

.tab-container .tab-container {
margin-left: 8px;
}

ul.tabLinks {
padding-left: 0;
padding-top: 10px;
padding-bottom: 10px;
padding: 0;
margin-bottom: 0;
overflow: auto;
min-width: 800px;
width: auto !important;
width: 800px;
width: auto;
border-bottom: solid 1px #aaa;
}

ul.tabLinks li {
float: left;
height: 100%;
list-style: none;
padding-left: 10px;
padding-right: 10px;
padding-top: 5px;
padding-bottom: 5px;
margin-bottom: 0;
-moz-border-radius: 7px;
border-radius: 7px;
margin-right: 25px;
border: solid 1px #d4d4d4;
padding: 5px 10px;
border-radius: 7px 7px 0 0;
border: solid 1px transparent;
border-bottom: none;
margin-right: 6px;
background-color: #f0f0f0;
}

ul.tabLinks li.deselected > a {
color: #6d6d6d;
}

ul.tabLinks li:hover {
background-color: #fafafa;
}

ul.tabLinks li.selected {
background-color: #c5f0f5;
border-color: #c5f0f5;
border-color: #aaa;
}

ul.tabLinks a {
Expand Down Expand Up @@ -114,13 +114,12 @@ div.deselected {

div.tab table {
min-width: 350px;
width: auto !important;
width: 350px;
width: auto;
border-collapse: collapse;
}

div.tab th, div.tab table {
border-bottom: solid #d0d0d0 1px;
border-bottom: solid 1px #d0d0d0;
}

div.tab th {
Expand Down Expand Up @@ -150,22 +149,18 @@ div.tab td.numeric, div.tab th.numeric {

span.code {
display: inline-block;
margin-top: 0em;
margin-top: 0;
margin-bottom: 1em;
}

span.code pre {
font-size: 11pt;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
padding: 10px;
margin: 0;
background-color: #f7f7f7;
border: solid 1px #d0d0d0;
min-width: 700px;
width: auto !important;
width: 700px;
width: auto;
}

span.wrapped pre {
Expand All @@ -176,4 +171,4 @@ span.wrapped pre {

label.hidden {
display: none;
}
}
Loading

0 comments on commit 3d14150

Please sign in to comment.