Add a browser test for the chrome://site-engagement WebUI.

chrome/browser/resources/engagement/site_engagement.js

 // Copyright 2015 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';
 
+// Allow a function to be provided by tests, which will be called when
+// the page has been populated with site engagement details.
+var resolvePageIsPopulated = null;
+var pageIsPopulatedPromise = new Promise((resolve, reject) => {
+  resolvePageIsPopulated = resolve;
+});
+
+function whenPageIsPopulatedForTest() {
+  return pageIsPopulatedPromise;
+}
+
 define('main', [
     'chrome/browser/engagement/site_engagement.mojom',
     'content/public/renderer/frame_interfaces',
-], function(siteEngagementMojom, frameInterfaces) {
-  return function() {
+], (siteEngagementMojom, frameInterfaces) => {
+  return () => {
     var uiHandler = new siteEngagementMojom.SiteEngagementUIHandlerPtr(
         frameInterfaces.getInterface(
             siteEngagementMojom.SiteEngagementUIHandler.name));
 
     var engagementTableBody = $('engagement-table-body');
     var updateInterval = null;
     var info = null;
     var sortKey = 'score';
     var sortReverse = true;
 
     // Set table header sort handlers.
     var engagementTableHeader = $('engagement-table-header');
     var headers = engagementTableHeader.children;
     for (var i = 0; i < headers.length; i++) {
-      headers[i].addEventListener('click', function(e) {
+      headers[i].addEventListener('click', (e) => {
         var newSortKey = e.target.getAttribute('sort-key');
         if (sortKey == newSortKey) {
           sortReverse = !sortReverse;
         } else {
           sortKey = newSortKey;
           sortReverse = false;
         }
         var oldSortColumn = document.querySelector('.sort-column');
         oldSortColumn.classList.remove('sort-column');
         e.target.classList.add('sort-column');
@@ skipping 73 matching lines @@
      * Remove all rows from the engagement table.
      */
     function clearTable() {
       engagementTableBody.innerHTML = '';
     }
 
     /**
      * Sort the engagement info based on |sortKey| and |sortReverse|.
      */
     function sortInfo() {
-      info.sort(function(a, b) {
+      info.sort((a, b) => {
         return (sortReverse ? -1 : 1) *
                compareTableItem(sortKey, a, b);
       });
     }
 
     /**
      * Compares two SiteEngagementInfo objects based on |sortKey|.
      * @param {string} sortKey The name of the property to sort by.
      * @return {number} A negative number if |a| should be ordered before |b|, a
      * positive number otherwise.
@@ skipping 13 matching lines @@
       return 0;
     }
 
     /**
      * Regenerates the engagement table from |info|.
      */
     function renderTable() {
       clearTable();
       sortInfo();
       // Round each score to 2 decimal places.
-      info.forEach(function(info) {
+      info.forEach((info) => {
         info.score = Number(Math.round(info.score * 100) / 100);
         engagementTableBody.appendChild(createRow(info));
       });
+
+      resolvePageIsPopulated();
     }
 
     /**
      * Retrieve site engagement info and render the engagement table.
      */
     function updateEngagementTable() {
       // Populate engagement table.
-      uiHandler.getSiteEngagementInfo().then(function(response) {
+      uiHandler.getSiteEngagementInfo().then((response) => {
         info = response.info;
         renderTable(info);
       });
     };
 
     updateEngagementTable();
     enableAutoupdate();
   };
 });