Diagnostics: Add skeleton routine-result-entry element

- This is will represent a line item in the list of routine results

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

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

@@ -21,6 +21,7 @@ GEN('#include "content/public/test/browser_test.h"');
  ['FakeMojoInterface', 'diagnostics/mojo_interface_provider_test.js'],
  ['FakeSystemDataProvider', 'diagnostics/fake_system_data_provider_test.js'],
  ['FakeMethodProvider', 'diagnostics/fake_method_provider_test.js'],
+ ['RoutineResultEntry', 'diagnostics/routine_result_entry_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_entry_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_entry.js';
+import {flushTasks} from 'chrome://test/test_util.m.js';
+
+suite('RoutineResultEntryTest', () => {
+  /** @type {?HTMLElement} */
+  let routineResultEntryElement = null;
+
+  setup(function() {
+    PolymerTest.clearBody();
+  });
+
+  teardown(function() {
+    if (routineResultEntryElement) {
+      routineResultEntryElement.remove();
+    }
+    routineResultEntryElement = null;
+  });
+
+  function initializeRoutineResultEntry() {
+    assertFalse(!!routineResultEntryElement);
+
+    // Add the entry to the DOM.
+    routineResultEntryElement = document.createElement('routine-result-entry');
+    assertTrue(!!routineResultEntryElement);
+    document.body.appendChild(routineResultEntryElement);
+
+    return flushTasks();
+  }
+
+  test('ElementRendered', () => {
+    return initializeRoutineResultEntry().then(() => {
+      // Verify the element rendered.
+      let div = routineResultEntryElement.$$('.entryRow');
+      assertTrue(!!div);
+    });
+  });
+});

chromeos/components/diagnostics_ui/resources/BUILD.gn

@@ -26,6 +26,7 @@ js_type_check("closure_compile_module") {
     ":overview_card",
     ":percent_bar_chart",
     ":realtime_cpu_chart",
+    ":routine_result_entry",
   ]
 }
 
@@ -133,6 +134,12 @@ js_library("realtime_cpu_chart") {
   ]
 }
 
+js_library("routine_result_entry") {
+  deps = [
+    "//third_party/polymer/v3_0/components-chromium/polymer:polymer_bundled",
+  ]
+}
+
 html_to_js("web_components") {
   js_files = [
     "battery_status_card.js",
@@ -146,5 +153,6 @@ html_to_js("web_components") {
     "overview_card.js",
     "percent_bar_chart.js",
     "realtime_cpu_chart.js",
+    "routine_result_entry.js",
   ]
 }

chromeos/components/diagnostics_ui/resources/diagnostics_app_resources.grd

@@ -31,6 +31,7 @@
       <include name="IDR_DIAGNOSTICS_OVERVIEW_CARD_JS" file="${root_gen_dir}/chromeos/components/diagnostics_ui/resources/overview_card.js" use_base_dir="false" type="BINDATA"/>
       <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_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_entry.html

+<style include="diagnostics-shared">
+</style>
+
+<div class="entryRow">
+</div>

chromeos/components/diagnostics_ui/resources/routine_result_entry.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-entry' shows the status of a single test routine.
+ */
+Polymer({
+  is: 'routine-result-entry',
+
+  _template: html`{__html_template__}`,
+
+  properties: {},
+
+  /** @override */
+  created() {},
+});