Diagnostics: Add a skeleton routine-result-list

- Will later hold a list of routine results with the ability to update
  the status of the items

Bug: 1125150
Test: browser_tests --gtest_filter=DiagnosticsApp*
Change-Id: Iaebb25b50b7fc35c8dbf67043e495762e3f2dec2
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2462381
Commit-Queue: Zentaro Kavanagh <zentaro@chromium.org>
Reviewed-by: Bailey Berro <baileyberro@chromium.org>
Cr-Commit-Position: refs/heads/master@{#815435}

chrome/test/data/webui/chromeos/diagnostics/diagnostics_browsertest.js

@@ -22,6 +22,7 @@ GEN('#include "content/public/test/browser_test.h"');
  ['FakeSystemDataProvider', 'diagnostics/fake_system_data_provider_test.js'],
  ['FakeMethodProvider', 'diagnostics/fake_method_provider_test.js'],
  ['RoutineResultEntry', 'diagnostics/routine_result_entry_test.js'],
+ ['RoutineResultList', 'diagnostics/routine_result_list_test.js'],
  ['PercentBarChart', 'diagnostics/percent_bar_chart_test.js'], [
    'FakeSystemRoutineController',
    'diagnostics/fake_system_routine_controller_test.js'

chrome/test/data/webui/chromeos/diagnostics/routine_result_list_test.js

+// Copyright 2020 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+// TODO(jimmyxgong): Use es6 module for mojo binding (crbug/1004256).
+import 'chrome://resources/mojo/mojo/public/js/mojo_bindings_lite.js';
+import 'chrome://diagnostics/routine_result_list.js';
+import {flushTasks} from 'chrome://test/test_util.m.js';
+
+suite('RoutineResultListTest', () => {
+  /** @type {?HTMLElement} */
+  let routineResultListElement = null;
+
+  setup(function() {
+    PolymerTest.clearBody();
+  });
+
+  teardown(function() {
+    if (routineResultListElement) {
+      routineResultListElement.remove();
+    }
+    routineResultListElement = null;
+  });
+
+  function initializeRoutineResultList() {
+    assertFalse(!!routineResultListElement);
+
+    // Add the entry to the DOM.
+    routineResultListElement = document.createElement('routine-result-list');
+    assertTrue(!!routineResultListElement);
+    document.body.appendChild(routineResultListElement);
+
+    return flushTasks();
+  }
+
+  test('ElementRendered', () => {
+    return initializeRoutineResultList().then(() => {
+      // Verify the element rendered.
+      let div = routineResultListElement.$$('#resultListContainer');
+      assertTrue(!!div);
+    });
+  });
+});

chromeos/components/diagnostics_ui/resources/BUILD.gn

@@ -27,6 +27,7 @@ js_type_check("closure_compile_module") {
     ":percent_bar_chart",
     ":realtime_cpu_chart",
     ":routine_result_entry",
+    ":routine_result_list",
   ]
 }
 
@@ -140,6 +141,12 @@ js_library("routine_result_entry") {
   ]
 }
 
+js_library("routine_result_list") {
+  deps = [
+    "//third_party/polymer/v3_0/components-chromium/polymer:polymer_bundled",
+  ]
+}
+
 html_to_js("web_components") {
   js_files = [
     "battery_status_card.js",
@@ -154,5 +161,6 @@ html_to_js("web_components") {
     "percent_bar_chart.js",
     "realtime_cpu_chart.js",
     "routine_result_entry.js",
+    "routine_result_list.js",
   ]
 }

chromeos/components/diagnostics_ui/resources/diagnostics_app_resources.grd

@@ -32,6 +32,7 @@
       <include name="IDR_DIAGNOSTICS_PERCENT_BAR_CHART_JS" file="${root_gen_dir}/chromeos/components/diagnostics_ui/resources/percent_bar_chart.js" use_base_dir="false" type="BINDATA"/>
       <include name="IDR_DIAGNOSTICS_REALTIME_CPU_CHART_JS" file="${root_gen_dir}/chromeos/components/diagnostics_ui/resources/realtime_cpu_chart.js" use_base_dir="false" type="BINDATA"/>
       <include name="IDR_DIAGNOSTICS_ROUTINE_RESULT_ENTRY_JS" file="${root_gen_dir}/chromeos/components/diagnostics_ui/resources/routine_result_entry.js" use_base_dir="false" type="BINDATA"/>
+      <include name="IDR_DIAGNOSTICS_ROUTINE_RESULT_LIST_JS" file="${root_gen_dir}/chromeos/components/diagnostics_ui/resources/routine_result_list.js" use_base_dir="false" type="BINDATA"/>
       <include name="IDR_DIAGNOSTICS_SHARED_CSS_JS" file="${root_gen_dir}/chromeos/components/diagnostics_ui/resources/diagnostics_shared_css.js" use_base_dir="false" type="BINDDATA"/>
       <include name="IDR_DIAGNOSTICS_TYPES_JS" file="diagnostics_types.js" type="BINDATA"/>
     </includes>

chromeos/components/diagnostics_ui/resources/routine_result_list.html

+<style include="diagnostics-shared">
+</style>
+
+<div id="resultListContainer">
+</div>

chromeos/components/diagnostics_ui/resources/routine_result_list.js

+// Copyright 2020 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import './diagnostics_card.js';
+import './diagnostics_shared_css.js';
+
+import {html, Polymer} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
+
+/**
+ * @fileoverview
+ * 'routine-result-list' shows a list of routine result entries.
+ */
+Polymer({
+  is: 'routine-result-list',
+
+  _template: html`{__html_template__}`,
+
+  properties: {},
+
+  /** @override */
+  created() {},
+});