Modified components ui to address concern of all the time disabled check update button.

chrome/browser/resources/components.js

 // Copyright 2013 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.
 
 'use strict';
 
 /**
  * Takes the |componentsData| input argument which represents data about the
  * currently installed components and populates the html jstemplate with
  * that data. It expects an object structure like the above.
  * @param {Object} componentsData Detailed info about installed components.
  *      Same expected format as returnComponentsData().
  */
 function renderTemplate(componentsData) {
   // This is the javascript code that processes the template:
   var input = new JsEvalContext(componentsData);
-  var output = $('componentTemplate');
+  var output = $('component-template').cloneNode(true);
+  $('component-placeholder').innerHTML = '';
+  $('component-placeholder').appendChild(output);
   jstProcess(input, output);
+  output.removeAttribute('hidden');
 }
 
 /**
  * Asks the C++ ComponentsDOMHandler to get details about the installed
  * components.
  * The ComponentsDOMHandler should reply to returnComponentsData() (below).
  */
 function requestComponentsData() {
   chrome.send('requestComponentsData');
 }
@@ skipping 37 matching lines @@
 
   // Disable some controls for Guest in ChromeOS.
   if (cr.isChromeOS)
     uiAccountTweaks.UIAccountTweaks.applyGuestModeVisibility(document);
 
   bodyContainer.style.visibility = 'visible';
   body.className = 'show-tmi-mode-initial';
 }
 
 /**
+ * This is a fallback function, which handles the case when
+ * component updater service doesn't fire onComponentEvent in response

[Sorin Jianu, 2014/05/08 22:07:24]

I've been thinking about this case. Indeed, we don't guarantee that a
notification is fired every time checkUpdate is called.

First, do we have to disable the button? The code in the component updater
handles successive calls correctly. Related to this, there is currently a period
of cooldown for calling on demand, which will interfere with the operation of
this page. It only allows one call every 30 mins for each component. I am open
to refactor the code so that the page has unrestricted access for OnDemand.
Please double check  this with Carlos and I will make the change.

Second, we could add more notifications for state transitions in
CrxUpdateService::ChangeItemState so that we also get events when the component
goes to kChecking, kDownloading, kDownloadingDiff. Nice to have, I will add
these events as well.

In summary, we should try to not disable the button but make the underlying code
work.

[Shrikant Kelkar, 2014/05/15 23:12:43]

Done.

+ * to checkUpdate.
+ * @param {HTMLElement} node The HTML element representing the component.
+ */
+function updateComponentStatus(node) {
+  if (node.disabled) {
+    // If component button is still disabled, we
+    // report status as timeout and re-enable button.
+    $('status-' + node.id).textContent = 'timeout';
+    node.disabled = false;
+  }
+}
+
+var timeoutMonitor = new Object();
+
+/**
+ * This event function is called from component ui indicating changed state
+ * of component updater service.
+ * @param {Object} eventArgs Contains event and component id. Component id is
+ * optional.
+ */
+function onComponentEvent(eventArgs) {
+  if (eventArgs['id']) {
+    var id = eventArgs['id'];
+    $('status-' + id).textContent = eventArgs['event'];
+
+    if (eventArgs['event'] != 'UpdateFound' &&
+        eventArgs['event'] != 'UpdateReady') {
+      $(id).disabled = false;
+      timeoutMonitor[id] && clearTimeout(timeoutMonitor[id]);
+    }
+  }
+}
+
+// 5 second refresh interval.
+var STATUS_REFRESH_INTERVAL = 5000;
+
+/**
  * Handles an 'enable' or 'disable' button getting clicked.
  * @param {HTMLElement} node The HTML element representing the component
  *     being checked for update.
  */
 function handleCheckUpdate(node) {
   node.disabled = true;
+
+  $('status-' + String(node.id)).textContent = 'Checking for update...';
+
   // Tell the C++ ComponentssDOMHandler to check for update.
   chrome.send('checkUpdate', [String(node.id)]);
+
+  timeoutMonitor[node.id] = window.setTimeout(
+                            function() { updateComponentStatus(node); },
+                            STATUS_REFRESH_INTERVAL);
 }
 
 // Get data and have it displayed upon loading.
 document.addEventListener('DOMContentLoaded', requestComponentsData);
-
-// Add handlers to static HTML elements.
-$('button-check-update').onclick = handleCheckUpdate;