Display test environment configs that are different for result files in a table. Fix js issue with Show Config button.Update .css to use a more fluid layout for test configs that can accomodate different sized strings.

2018-08-20 09:01:30 -07:00 · 2018-08-20 09:01:30 -07:00 · ca21363f1a
--- a/UnityPerformanceBenchmarkReporter/Report/ReportWriter.cs
+++ b/UnityPerformanceBenchmarkReporter/Report/ReportWriter.cs
@ -407,7 +407,7 @@ namespace UnityPerformanceBenchmarkReporter.Report
        {
            rw.WriteLine("function showTestConfiguration() {");
            rw.WriteLine("	var x = document.getElementById(\"testconfig\");");
-            rw.WriteLine("	if (x.style.display === \"none\") {");
+            rw.WriteLine("	if (x.style.display === \"\" || x.style.display === \"none\") {");
            rw.WriteLine("		x.style.display = \"block\";");
 rw.WriteLine("	document.getElementById(\"toggleconfig\").innerHTML=\"Hide Test Configuration\";");
            rw.WriteLine("	} else {");
@ -683,15 +683,17 @@ rw.WriteLine("	document.getElementById(\"toggleconfig\").innerHTML=\"Show Test C
        {
            var thisObject = (T)instance;
            rw.WriteLine("<div><hr></div><div class=\"typename\">{0}</div><div><hr></div>", thisObject.GetType().Name);
-            rw.WriteLine(wideLayout ? "<div class=\"systeminfowide\">" : "<div class=\"systeminfo\">");
+            rw.WriteLine(wideLayout ? "<div class=\"systeminfowide\"><pre>" : "<div class=\"systeminfo\"><pre>");

            var sb = new StringBuilder();
            foreach (var field in thisObject.GetType().GetFields())
            {
+                
                if (excludedFields != null && excludedFields.Contains(field.Name))
                {
                    continue;
                }
+                sb.Append("<div class=\"fieldgroup\">");

                // if field is an IEnumberable, enumerate and append each value to the sb
                if (typeof(IEnumerable).IsAssignableFrom(field.FieldType) && field.FieldType != typeof(string))
@ -716,34 +718,42 @@ rw.WriteLine("	document.getElementById(\"toggleconfig\").innerHTML=\"Show Test C
                }
                else
                {
-                    sb.Append(string.Format("<div class=\"fieldgroup\"><div class=\"fieldname\"><pre>{0}</pre></div>", field.Name));
+                    sb.Append(string.Format("<div class=\"fieldname\">{0}</div>", field.Name));
                    if (mismatchedValues.Count > 0 && mismatchedValues.ContainsKey(field.Name))
                    {
                        var mismatchedValue = mismatchedValues[field.Name];

+                        sb.Append("<div class=\"fieldvaluewarning\">");
+                        sb.Append("<table class=\"warningtable\">");
+                        sb.Append("<tr><th>Value</th><th>Result File</th><th>Path</th></tr>");
                        
                        for (int i = 0; i < resultFiles.Length; i++)
                        {
-                            sb.Append(string.Format("<div class=\"fieldvaluewarning\" title=\"{0}\"><pre>", resultFiles[i]));
-
-                            var value = mismatchedValue.Any(kv => kv.Key.Equals(resultFiles[i])) ? 
-                                mismatchedValue.First(kv => kv.Key.Equals(resultFiles[i])).Value : 
+                            
+                            var resultFile = resultFiles[i];
+                            var value = mismatchedValue.Any(kv => kv.Key.Equals(resultFile)) ? 
+                                mismatchedValue.First(kv => kv.Key.Equals(resultFile)).Value : 
                                mismatchedValue.First(kv => kv.Key.Equals(resultFiles[0])).Value;
-                            sb.Append(string.Format("|&nbsp;{0}:&nbsp;&nbsp;&nbsp;&nbsp;{1}&nbsp;|", metadataValidator.ResizeString(resultFiles[i], 20), value));

-                            sb.Append(i == resultFiles.Length - 1 ? "</pre></div >" : "</pre><br></div >");
+                            var pathParts = resultFile.Split('\\');
+                            var path = string.Join('\\', pathParts.Take(pathParts.Length - 1));
+
+                            sb.Append(string.Format("<tr><td>{0}</td><td>{1}</td><td>{2}</td></tr>", value, pathParts[pathParts.Length - 1], path));
                        }
+                        
+                        sb.Append("</table></div>");
                    }
                    else
                    {
-                        sb.Append(string.Format("<div class=\"fieldvalue\"><pre>{0}</pre></div>", field.GetValue(thisObject)));
+                        sb.Append(string.Format("<div class=\"fieldvalue\">{0}</div>", field.GetValue(thisObject)));
                    }

-                    sb.Append("</div>");
+                    
                }
+                sb.Append("</div>");
            }
            rw.WriteLine(sb.ToString());
-            rw.WriteLine("</div>");
+            rw.WriteLine("</pre></div>");
        }

        private List<TestResult> GetResultsForThisTest(string distinctTestName)
--- a/UnityPerformanceBenchmarkReporter/Report/styles.css
+++ b/UnityPerformanceBenchmarkReporter/Report/styles.css
@ -50,25 +50,7 @@ h3 {
    display: none
 }

-.systeminfo > div {
-    display: inline-block;
-    *display: inline; /* For IE7 */
-    zoom: 1; /* Trigger hasLayout */
-    width: 20%;
-    text-align: left;
-    vertical-align: text-top;
-    font-family: 'Arial', 'Helvetica', 'Helvetica Neue', sans-serif;
-}

-.systeminfowide > div {
-    display: inline-block;
-    *display: inline; /* For IE7 */
-    zoom: 1; /* Trigger hasLayout */
-    width: 50%;
-    text-align: left;
-    vertical-align: text-top;
-    font-family: 'Arial', 'Helvetica', 'Helvetica Neue', sans-serif;
-}

 .testnamecell {
    background-color: lightgray;
@ -102,9 +84,9 @@ h3 {
    font-weight: bold;
 }

-    .button:hover {
-        background-color: #2196F3 !important;
-    }
+.button:hover {
+    background-color: #2196F3 !important;
+}

 .buttondiv {
    display: inline;
@ -125,40 +107,73 @@ h3 {
    padding: 5px 5px 5px 0px;
 }

+
+.systeminfo > div {
+    flex: 1 1 160px;
+    margin: 5px;
+}
+
+.systeminfowide > div {
+    flex: 1 1 160px;
+    margin: 5px;
+}
+
 .typename {
    text-align: left;
    font-weight: bold;
-    font-size: 1.25vh;
-    background-color: black;
-    color: white;
+    font-size: 1.35vh;
+    background-color: lightgray;
+    color: black;
    font-family: 'Arial', 'Helvetica', 'Helvetica Neue', sans-serif;
    padding: 5px 5px 5px 10px;
 }

 .fieldgroup {
+    display: inline-block !important;
+    border: 1px solid lightgray;
+    border-radius: 4px;
+    margin: 5px;
 }

 .fieldname {
    font-weight: bold;
-    font-size: 1.15vh;
+    font-size: 1.25vh;
    overflow-wrap: break-word;
+    font-family: 'Arial', 'Helvetica', 'Helvetica Neue', sans-serif;
+    margin: 4px;
 }

 .fieldvalue {
-    font-size: 1vh;
+    font-size: 1.1vh;
+    margin: 4px;
 }

 .fieldvaluewarning {
-    font-size: 1vh;
-    color: darkorange;
+    font-size: 1.1vh;
+    color: chocolate;
 }

+.warningtable {
+    padding: 5px 5px 5px 5px;
+    width: 100%;
+    text-align: left;
+}
+
+.warningtable > tbody > tr > td {
+    padding: 5px;
+}
+
+    .warningtable > tbody > tr:nth-child(even) {
+        background-color: #f2f2f2;
+    }
+
 pre {
    white-space: pre-wrap; /* Since CSS 2.1 */
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
+    margin: 5px;
 }

 .containerLabel {
@ -176,12 +191,12 @@ pre {
    font-family: 'Arial', 'Helvetica', 'Helvetica Neue', sans-serif;
 }

-    /* Hide the browser's default checkbox */
-    .containerLabel input {
-        position: absolute;
-        opacity: 0;
-        cursor: pointer;
-    }
+/* Hide the browser's default checkbox */
+.containerLabel input {
+    position: absolute;
+    opacity: 0;
+    cursor: pointer;
+}

 /* Create a custom checkbox */
 .checkmark {
@ -246,31 +261,31 @@ pre {
    font-family: 'Arial', 'Helvetica', 'Helvetica Neue', sans-serif;
 }

-    /* Hide the browser's default checkbox */
-    .disabledContainerLabel input {
-        position: absolute;
-        opacity: 0;
-        cursor: pointer;
-    }
+/* Hide the browser's default checkbox */
+.disabledContainerLabel input {
+    position: absolute;
+    opacity: 0;
+    cursor: pointer;
+}

-    .disabledContainerLabel .tooltiptext {
-        visibility: hidden;
-        width: 120px;
-        background-color: #2196F3;
-        color: #fff;
-        text-align: center;
-        border-radius: 6px;
-        padding: 5px 0;
-        z-index: 1;
-        top: -5px;
-        left: 105%;
-        padding: 5px 5px 5px 5px;
-        font-family: 'Arial', 'Helvetica', 'Helvetica Neue', sans-serif;
-    }
+.disabledContainerLabel .tooltiptext {
+    visibility: hidden;
+    width: 120px;
+    background-color: #2196F3;
+    color: #fff;
+    text-align: center;
+    border-radius: 6px;
+    padding: 5px 0;
+    z-index: 1;
+    top: -5px;
+    left: 105%;
+    padding: 5px 5px 5px 5px;
+    font-family: 'Arial', 'Helvetica', 'Helvetica Neue', sans-serif;
+}

-    .disabledContainerLabel:hover .tooltiptext {
-        visibility: visible;
-    }
+.disabledContainerLabel:hover .tooltiptext {
+    visibility: visible;
+}

 .visualizationTable {
    width: 100%;