src/third_party/WebKit/Tools/GardeningServer/ui/ct-test-list.html

   1 <!--
   2 Copyright 2014 The Chromium Authors. All rights reserved.
   3 Use of this source code is governed by a BSD-style license that can be
   4 found in the LICENSE file.
   5 -->
   6
   7 <link rel="import" href="../bower_components/paper-icon-button/paper-icon-button.html">
   8
   9 <polymer-element name="ct-test-list" attributes="tests">
  10   <template>
  11     <style>
  12       :host {
  13         display: block;
  14       }
  15
  16       :host > div {
  17         /* Be at least the height of a paper-icon-button.
  18            So things line up nicely. */
  19         min-height: 24px;
  20       }
  21
  22       .test-failures {
  23         margin-left: 15px;
  24       }
  25
  26       paper-icon-button {
  27         vertical-align: middle;
  28       }
  29
  30       paper-icon-button::shadow #icon {
  31         margin: 0;
  32       }
  33     </style>
  34     <template repeat="{{ groups in testGroups_ }}">
  35       <template if="{{ groups.tests.length }}">
  36         <div><span style="font-weight: bold">Step:</span> {{ groups.step }}</div>
  37       </template>
  38
  39       <template repeat="{{ group in groups.tests | maybeTruncate(groups.expanded) }}">
  40         <!-- Case 1: single test failure -->
  41         <template if="{{ group.name && (group.tests.length == 1 || group.expanded) }}">
  42           <template repeat="{{ test in group.tests }}">
  43             <div class="test-failures">
  44               <a href="{{ test | flakinessDashboardURL }}">{{ test.testName }}</a>
  45             </div>
  46           </template>
  47         </template>
  48         <!-- Case 2: group of tests failed -->
  49         <template if="{{ group.name && group.tests.length > 1 && !group.expanded }}">
  50           <div class="test-failures">
  51             {{ group.name }} ({{ group.tests.length }} Tests)
  52             <paper-icon-button id="expand" icon="unfold-more" step="{{ groups.step }}" group="{{ group.name }}" on-click="{{ _innerExpand }}"></paper-icon-button>
  53           </div>
  54         </template>
  55       </template>
  56       <template if="{{ !groups.expanded }}">
  57         <div class="test-failures">
  58           {{ groups.tests.length - kMaxTestsPerStep }} more
  59           <paper-icon-button id="outerExpand" icon="unfold-more" step="{{ groups.step }}" on-click="{{ _outerExpand }}"></paper-icon-button>
  60         </div>
  61       </template>
  62     </template>
  63   </template>
  64   <script>
  65     Polymer('ct-test-list', {
  66       kMaxTestsPerStep: 10,
  67
  68       testsChanged: function() {
  69         var groups = {};
  70         if (this.tests) {
  71           this.tests.forEach(function(test) {
  72             if (!groups[test.step])
  73               groups[test.step] = {};
  74             var testName = test.reasonGroupName();
  75             if (!groups[test.step][testName])
  76               groups[test.step][testName] = [];
  77             groups[test.step][testName].push(test);
  78           }.bind(this));
  79         }
  80         this.testGroups_ = [];
  81         Object.keys(groups, function(step, testsByName) {
  82           var tests = [];
  83           Object.keys(testsByName, function(name, testList) {
  84             if (name == 'undefined')
  85               name = undefined;
  86             tests.push({'name': name, 'tests': testList, 'expanded': false});
  87           }.bind(this));
  88           tests.sortBy('name');
  89           // The + 1 is to make sure at least 2 tests are hidden by the message.
  90           this.testGroups_.push({'step': step, 'tests': tests, 'expanded': tests.length <= (this.kMaxTestsPerStep + 1)});
  91         }.bind(this));
  92         this.testGroups_.sortBy('step');
  93       },
  94
  95       _innerExpand: function(evt) {
  96         step = evt.target.attributes['step'].value;
  97         name = evt.target.attributes['group'].value;
  98         this.testGroups_.forEach(function(testGroup) {
  99           if (testGroup.step == step) {
 100             testGroup.tests.forEach(function(test) {
 101               // FIXME: This attribute should be persisted over reloads.
 102               if (test.name == name)
 103                 test.expanded = true;
 104             });
 105           }
 106         });
 107       },
 108
 109       _outerExpand: function(evt) {
 110         var step = evt.target.attributes['step'].value;
 111         this.testGroups_.forEach(function(testGroup) {
 112           if (testGroup.step == step) {
 113             testGroup.expanded = true;
 114           }
 115         });
 116       },
 117
 118       flakinessDashboardURL: function(test) {
 119         return test.flakinessDashboardURL();
 120       },
 121
 122       // FIXME: Remove maybeTruncate. Persist the expanded list as described in
 123       // http://crbug.com/417159.
 124       maybeTruncate: function(input, expanded) {
 125         if (expanded)
 126           return input;
 127         return input.slice(0, this.kMaxTestsPerStep);
 128       },
 129     });
 130   </script>
 131 </polymer-element>