Statistically significant A/B testing results should be color coded in details view
authorrniwa@webkit.org <rniwa@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 19 Feb 2016 00:51:46 +0000 (00:51 +0000)
committerrniwa@webkit.org <rniwa@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 19 Feb 2016 00:51:46 +0000 (00:51 +0000)
https://bugs.webkit.org/show_bug.cgi?id=154414

Reviewed by Chris Dumez.

Color code the statistically significant comparisions in TestGroupResultsTable as done in the analysis
results viewer.

* public/v3/components/customizable-test-group-form.js:
(CustomizableTestGroupForm.cssTemplate): Build fix after r196768.
* public/v3/components/test-group-results-table.js:
(TestGroupResultsTable.prototype.buildRowGroups): Add the status as a class name.
(TestGroupResultsTable.cssTemplate): Added styles to color-code statistically significant results.

git-svn-id: http://svn.webkit.org/repository/webkit/trunk@196787 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Websites/perf.webkit.org/ChangeLog
Websites/perf.webkit.org/public/v3/components/customizable-test-group-form.js
Websites/perf.webkit.org/public/v3/components/test-group-results-table.js

index 7751cff2a65b4395ba379f1be90f7bd97c8fc07c..4659aad2db1c061ee10f1bc92765e88ce4cce64b 100644 (file)
@@ -1,3 +1,19 @@
+2016-02-18  Ryosuke Niwa  <rniwa@webkit.org>
+
+        Statistically significant A/B testing results should be color coded in details view
+        https://bugs.webkit.org/show_bug.cgi?id=154414
+
+        Reviewed by Chris Dumez.
+
+        Color code the statistically significant comparisions in TestGroupResultsTable as done in the analysis
+        results viewer.
+
+        * public/v3/components/customizable-test-group-form.js:
+        (CustomizableTestGroupForm.cssTemplate): Build fix after r196768.
+        * public/v3/components/test-group-results-table.js:
+        (TestGroupResultsTable.prototype.buildRowGroups): Add the status as a class name.
+        (TestGroupResultsTable.cssTemplate): Added styles to color-code statistically significant results.
+
 2016-02-17  Ryosuke Niwa  <rniwa@webkit.org>
 
         v3 UI should allow custom revisions for A/B testing
index 849d5edf5d0ebdaf409505eec471405eaec4c086..4c209bd1cead7e5932c79f3111c714f5b6b3f46d 100644 (file)
@@ -129,7 +129,7 @@ class CustomizableTestGroupForm extends TestGroupForm {
 
     static cssTemplate()
     {
-        return super.cssTemplate() + `
+        return `
             .customize-link {
                 color: #333;
             }
index 872cfe4548583fa04c97d14e44c9ef74eff7908a..dfbf3fa667196b50e47c4d67b81c0df0ef683c83 100644 (file)
@@ -65,7 +65,8 @@ class TestGroupResultsTable extends ResultsTable {
                     continue;
 
                 var row = new ResultsTableRow(`${startConfig} to ${endConfig}`, null);
-                row.setLabelForWholeRow(result.fullLabel);
+                var element = ComponentBase.createElement;
+                row.setLabelForWholeRow(element('span', {class: 'results-label ' + result.status}, result.fullLabel));
                 comparisonRows.push(row);
             }
         }
@@ -74,6 +75,32 @@ class TestGroupResultsTable extends ResultsTable {
 
         return groups;
     }
+
+    static cssTemplate()
+    {
+        return super.cssTemplate() + `
+            .results-label {
+                padding: 0.1rem;
+                width: 100%;
+                height: 100%;
+            }
+
+            .results-label .failed {
+                color: rgb(128, 51, 128);
+            }
+            .results-label .unchanged {
+                color: rgb(128, 128, 128);
+            }
+            .results-label.worse {
+                color: rgb(255, 102, 102);
+                font-weight: bold;
+            }
+            .results-label.better {
+                color: rgb(102, 102, 255);
+                font-weight: bold;
+            }
+        `;
+    }
 }
 
 ComponentBase.defineElement('test-group-results-table', TestGroupResultsTable);