Fix for broken CertificateViewerUITest.testDetails.

chrome/browser/resources/certificate_viewer.js

 // Copyright (c) 2012 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.
 
 cr.define('cert_viewer', function() {
   'use strict';
 
   /**
    * Initialize the certificate viewer dialog by wiring up the close button,
    * substituting in translated strings and requesting certificate details.
    */
   function initialize() {
     cr.ui.decorate('tabbox', cr.ui.TabBox);
 
     i18nTemplate.process(document, templateData);
 
-    var args = JSON.parse(chrome.dialogArguments);
-    getCertificateInfo(args);
-
     // The second tab's contents aren't visible on startup, so we can
     // shorten startup by not populating those controls until after we
     // have had a chance to draw the visible controls the first time.
     // The value of 200ms is quick enough that the user couldn't open the
     // tab in that time but long enough to allow the first tab to draw on
     // even the slowest machine.
-    setTimeout(function() {
-      initializeTree($('hierarchy'), showCertificateFields);
-      initializeTree($('cert-fields'), showCertificateFieldValue);
-      createCertificateHierarchy(args.hierarchy);
-    }, 200);
+    setTimeout(initializeSecondTab, 200);

[flackr, 2012/05/17 15:46:56]

Can we also hook this up to the tab change and use a tab change to trigger the
method from the test?

[Kevin Greer, 2012/05/17 15:56:12]

Are you sure?  That seems a little hackish and adds an extra layer of
indirection to both the code and the test, for no benefit (IMO).
On 2012/05/17 15:46:56, flackr wrote:

[flackr, 2012/05/17 16:56:58]

By triggering it on selecting the details tab the test will simulate a user
really quickly clicking on details rather than calling a special exported
function to initialize the tab. In the regular user case this will just be a
noop event handler since it is a one shot function: i.e.

$('tabbox').addEventListener('selectedChange', function f(e) {
  $('tabbox').removeEventListener('selectedChange', f);
  initializeSecondTab();
}

On 2012/05/17 15:56:12, Kevin Greer wrote:

 
     stripGtkAccessorKeys();
 
     $('export').onclick = exportCertificate;
 
     // TODO(kochi): ESC key should be handled in the views window side.
     document.addEventListener('keydown', function(e) {
       if (e.keyCode == 27)  // ESC
         chrome.send('DialogClose');
     });
   }
 
   /**
+   * Decorate a function so that it can only be invoked once.
+   */
+  function oneShot(fn) {
+    var fired = false;
+    return function() {
+       if (fired) return;
+       fn();
+       fired = true;
+    };
+  }
+
+  /**
+   * Initialize the second tab's contents.
+   * This is a 'oneShot' function, meaning it will only be invoked once,
+   * no matter how many times it is called.  This is done for unit-testing
+   * purposes in case a test needs to initialize the tab before the timer
+   * fires.
+   */
+  var initializeSecondTab = oneShot(function() {

[flackr, 2012/05/17 15:46:56]

nit: Call this initializeDetailsTab.

[Kevin Greer, 2012/05/17 15:56:12]

Agreed.  That's a better name.  Changed.
On 2012/05/17 15:46:56, flackr wrote:

+    var args = JSON.parse(chrome.dialogArguments);
+    getCertificateInfo(args);
+    initializeTree($('hierarchy'), showCertificateFields);
+    initializeTree($('cert-fields'), showCertificateFieldValue);
+    createCertificateHierarchy(args.hierarchy);
+  });
+
+  /**
    * Initialize a cr.ui.Tree object from a given element using the specified
    * change handler.
    * @param {HTMLElement} tree The HTMLElement to style as a tree.
    * @param {function()} handler Function to call when a node is selected.
    */
   function initializeTree(tree, handler) {
     cr.ui.decorate(tree, cr.ui.Tree);
     tree.detail = {payload: {}, children: {}};
     tree.addEventListener('change', handler);
   }
@@ skipping 130 matching lines @@
       chrome.send('exportCertificate', [item.detail.payload.index]);
   }
 
   return {
     initialize: initialize,
     getCertificateFields: getCertificateFields,
   };
 });
 
 document.addEventListener('DOMContentLoaded', cert_viewer.initialize);