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 }}">
  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="{{ _expand }}"></paper-icon-button>
  53           </div>
  54         </template>
  55       </template>
  56     </template>
  57   </template>
  58   <script>
  59     Polymer('ct-test-list', {
  60       testsChanged: function() {
  61         var groups = {};
  62         if (this.tests) {
  63           this.tests.forEach(function(test) {
  64             if (!groups[test.step])
  65               groups[test.step] = {};
  66             var testName = test.reasonGroupName();
  67             if (!groups[test.step][testName])
  68               groups[test.step][testName] = [];
  69             groups[test.step][testName].push(test);
  70           }.bind(this));
  71         }
  72         this.testGroups_ = [];
  73         Object.keys(groups, function(step, testsByName) {
  74           var tests = [];
  75           Object.keys(testsByName, function(name, testList) {
  76             if (name == 'undefined')
  77               name = undefined;
  78             tests.push({'name': name, 'tests': testList, 'expanded': false});
  79           }.bind(this));
  80           tests.sortBy('name');
  81           this.testGroups_.push({'step': step, 'tests': tests});
  82         }.bind(this));
  83         this.testGroups_.sortBy('step');
  84       },
  85
  86       _expand: function(evt) {
  87         step = evt.target.attributes['step'].value;
  88         name = evt.target.attributes['group'].value;
  89         this.testGroups_.forEach(function(testGroup) {
  90           if (testGroup.step == step) {
  91             testGroup.tests.forEach(function(test) {
  92               // FIXME: This attribute should be persisted over reloads.
  93               if (test.name == name)
  94                 test.expanded = true;
  95             });
  96           }
  97         });
  98       },
  99
 100       flakinessDashboardURL: function(test) {
 101         return test.flakinessDashboardURL();
 102       },
 103     });
 104   </script>
 105 </polymer-element>