1 files changed, 229 insertions, 70 deletions

diff --git a/chromium/chrome/browser/resources/inspect/inspect.js b/chromium/chrome/browser/resources/inspect/inspect.js
index b322b4e76de..a5bcb2f8bb2 100644
--- a/chromium/chrome/browser/resources/inspect/inspect.js
+++ b/chromium/chrome/browser/resources/inspect/inspect.js
@@ -7,6 +7,20 @@ var MIN_VERSION_TARGET_ID = 26;
 var MIN_VERSION_NEW_TAB = 29;
 var MIN_VERSION_TAB_ACTIVATE = 30;
 
+var queryParamsObject = {};
+
+(function() {
+var queryParams = window.location.search;
+if (!queryParams)
+    return;
+var params = queryParams.substring(1).split('&');
+for (var i = 0; i < params.length; ++i) {
+    var pair = params[i].split('=');
+    queryParamsObject[pair[0]] = pair[1];
+}
+
+})();
+
 function sendCommand(command, args) {
   chrome.send(command, Array.prototype.slice.call(arguments, 1));
 }
@@ -15,6 +29,13 @@ function sendTargetCommand(command, target) {
   sendCommand(command, target.source, target.id);
 }
 
+function sendServiceWorkerCommand(action, worker) {
+  $('serviceworker-internals').contentWindow.postMessage({
+    'action': action,
+    'worker': worker
+  },'chrome://serviceworker-internals');
+}
+
 function removeChildren(element_id) {
   var element = $(element_id);
   element.textContent = '';
@@ -34,27 +55,85 @@ function onload() {
     tabHeader.addEventListener('click', selectTab.bind(null, tabContent.id));
     $('navigation').appendChild(tabHeader);
   }
-  var selectedTabName = window.location.hash.slice(1) || 'devices';
-  selectTab(selectedTabName);
+  onHashChange();
   initSettings();
   sendCommand('init-ui');
+  window.addEventListener('message', onMessage.bind(this), false);
+}
+
+function onMessage(event) {
+  if (event.origin != 'chrome://serviceworker-internals') {
+    return;
+  }
+  populateServiceWorkers(event.data.partition_id,
+                         event.data.workers);
 }
 
+function onHashChange() {
+  var hash = window.location.hash.slice(1).toLowerCase();
+  if (!selectTab(hash))
+    selectTab('devices');
+}
+
+/**
+ * @param {string} id Tab id.
+ * @return {boolean} True if successful.
+ */
 function selectTab(id) {
+  closePortForwardingConfig();
+
   var tabContents = document.querySelectorAll('#content > div');
   var tabHeaders = $('navigation').querySelectorAll('.tab-header');
+  var found = false;
   for (var i = 0; i != tabContents.length; i++) {
     var tabContent = tabContents[i];
     var tabHeader = tabHeaders[i];
     if (tabContent.id == id) {
       tabContent.classList.add('selected');
       tabHeader.classList.add('selected');
+      found = true;
     } else {
       tabContent.classList.remove('selected');
       tabHeader.classList.remove('selected');
     }
   }
+  if (!found)
+    return false;
   window.location.hash = id;
+  return true;
+}
+
+function populateServiceWorkers(partition_id, workers) {
+  var list = $('service-workers-list-' + partition_id);
+  if (workers.length == 0) {
+    if (list) {
+        list.parentNode.removeChild(list);
+    }
+    return;
+  }
+  if (list) {
+    list.textContent = '';
+  } else {
+    list = document.createElement('div');
+    list.id = 'service-workers-list-' + partition_id;
+    list.className = 'list';
+    $('service-workers-list').appendChild(list);
+  }
+  for (var i = 0; i < workers.length; i++) {
+    var worker = workers[i];
+    worker.hasCustomInspectAction = true;
+    var row = addTargetToList(worker, list, ['scope', 'url']);
+    addActionLink(
+        row,
+        'inspect',
+        sendServiceWorkerCommand.bind(null, 'inspect', worker),
+        false);
+    addActionLink(
+        row,
+        'terminate',
+        sendServiceWorkerCommand.bind(null, 'stop', worker),
+        false);
+  }
 }
 
 function populateTargets(source, data) {
@@ -93,6 +172,10 @@ function populateWorkerTargets(data) {
     addToWorkersList(data[i]);
 }
 
+function showIncognitoWarning() {
+  $('devices-incognito').hidden = false;
+}
+
 function populateRemoteTargets(devices) {
   if (!devices)
     return;
@@ -156,12 +239,10 @@ function populateRemoteTargets(devices) {
       deviceName.className = 'device-name';
       deviceHeader.appendChild(deviceName);
 
-      if (device.adbSerial) {
-        var deviceSerial = document.createElement('div');
-        deviceSerial.className = 'device-serial';
-        deviceSerial.textContent = '#' + device.adbSerial.toUpperCase();
-        deviceHeader.appendChild(deviceSerial);
-      }
+      var deviceSerial = document.createElement('div');
+      deviceSerial.className = 'device-serial';
+      deviceSerial.textContent = '#' + device.adbSerial.toUpperCase();
+      deviceHeader.appendChild(deviceSerial);
 
       var devicePorts = document.createElement('div');
       devicePorts.className = 'device-ports';
@@ -184,30 +265,6 @@ function populateRemoteTargets(devices) {
         device.adbConnected ? '' : 'Pending authentication: please accept ' +
           'debugging session on the device.';
 
-    var devicePorts = deviceSection.querySelector('.device-ports');
-    devicePorts.textContent = '';
-    if (device.adbPortStatus) {
-      for (var port in device.adbPortStatus) {
-        var status = device.adbPortStatus[port];
-        var portIcon = document.createElement('div');
-        portIcon.className = 'port-icon';
-        if (status > 0)
-          portIcon.classList.add('connected');
-        else if (status == -1 || status == -2)
-          portIcon.classList.add('transient');
-        else if (status < 0)
-          portIcon.classList.add('error');
-        devicePorts.appendChild(portIcon);
-
-        var portNumber = document.createElement('div');
-        portNumber.className = 'port-number';
-        portNumber.textContent = ':' + port;
-        if (status > 0)
-          portNumber.textContent += '(' + status + ')';
-        devicePorts.appendChild(portNumber);
-      }
-    }
-
     var browserList = deviceSection.querySelector('.browsers');
     var newBrowserIds =
         device.browsers.map(function(b) { return b.id });
@@ -220,6 +277,8 @@ function populateRemoteTargets(devices) {
 
       var majorChromeVersion = browser.adbBrowserChromeVersion;
 
+      var incompatibleVersion = browser.hasOwnProperty('compatibleVersion') &&
+                                !browser.compatibleVersion;
       var pageList;
       var browserSection = $(browser.id);
       if (browserSection) {
@@ -241,7 +300,14 @@ function populateRemoteTargets(devices) {
           browserName.textContent += ' (' + browser.adbBrowserVersion + ')';
         browserSection.appendChild(browserHeader);
 
-        if (majorChromeVersion >= MIN_VERSION_NEW_TAB) {
+        if (incompatibleVersion) {
+          var warningSection = document.createElement('div');
+          warningSection.className = 'warning';
+          warningSection.textContent =
+            'You may need a newer version of desktop Chrome. ' +
+            'Please try Chrome ' + browser.adbBrowserVersion + ' or later.';
+          browserHeader.appendChild(warningSection);
+        } else if (majorChromeVersion >= MIN_VERSION_NEW_TAB) {
           var newPage = document.createElement('div');
           newPage.className = 'open';
 
@@ -268,12 +334,33 @@ function populateRemoteTargets(devices) {
           browserHeader.appendChild(newPage);
         }
 
+        var browserInspector;
+        var browserInspectorTitle;
+        if ('trace' in queryParamsObject || 'tracing' in queryParamsObject) {
+          browserInspector = 'chrome://tracing';
+          browserInspectorTitle = 'trace';
+        } else {
+          browserInspector = queryParamsObject['browser-inspector'];
+          browserInspectorTitle = 'inspect';
+        }
+        if (browserInspector) {
+          var link = document.createElement('span');
+          link.classList.add('action');
+          link.setAttribute('tabindex', 1);
+          link.textContent = browserInspectorTitle;
+          browserHeader.appendChild(link);
+          link.addEventListener(
+              'click',
+              sendCommand.bind(null, 'inspect-browser', browser.source,
+                  browser.id, browserInspector), false);
+        }
+
         pageList = document.createElement('div');
         pageList.className = 'list pages';
         browserSection.appendChild(pageList);
       }
 
-      if (alreadyDisplayed(browserSection, browser))
+      if (incompatibleVersion || alreadyDisplayed(browserSection, browser))
         continue;
 
       pageList.textContent = '';
@@ -298,7 +385,7 @@ function populateRemoteTargets(devices) {
         }
         if (majorChromeVersion >= MIN_VERSION_TAB_CLOSE) {
           addActionLink(row, 'close',
-              sendTargetCommand.bind(null, 'close', page), page.attached);
+              sendTargetCommand.bind(null, 'close', page), false);
         }
       }
     }
@@ -308,30 +395,37 @@ function populateRemoteTargets(devices) {
 function addToPagesList(data) {
   var row = addTargetToList(data, $('pages-list'), ['name', 'url']);
   addFavicon(row, data);
+  if (data.guests)
+    addGuestViews(row, data.guests);
 }
 
 function addToExtensionsList(data) {
   var row = addTargetToList(data, $('extensions-list'), ['name', 'url']);
   addFavicon(row, data);
+  if (data.guests)
+    addGuestViews(row, data.guests);
 }
 
 function addToAppsList(data) {
   var row = addTargetToList(data, $('apps-list'), ['name', 'url']);
   addFavicon(row, data);
-  if (data.guests) {
-    Array.prototype.forEach.call(data.guests, function(guest) {
-      var guestRow = addTargetToList(guest, row, ['name', 'url']);
-      guestRow.classList.add('guest');
-      addFavicon(guestRow, guest);
-    });
-  }
+  if (data.guests)
+    addGuestViews(row, data.guests);
+}
+
+function addGuestViews(row, guests) {
+  Array.prototype.forEach.call(guests, function(guest) {
+    var guestRow = addTargetToList(guest, row, ['name', 'url']);
+    guestRow.classList.add('guest');
+    addFavicon(guestRow, guest);
+  });
 }
 
 function addToWorkersList(data) {
   var row =
       addTargetToList(data, $('workers-list'), ['name', 'description', 'url']);
   addActionLink(row, 'terminate',
-      sendTargetCommand.bind(null, 'close', data), data.attached);
+      sendTargetCommand.bind(null, 'close', data), false);
 }
 
 function addToOthersList(data) {
@@ -349,17 +443,18 @@ function formatValue(data, property) {
   if (text.length > 100)
     text = text.substring(0, 100) + '\u2026';
 
-  var span = document.createElement('div');
-  span.textContent = text;
-  span.className = property;
-  return span;
+  var div = document.createElement('div');
+  div.textContent = text;
+  div.className = property;
+  return div;
 }
 
 function addFavicon(row, data) {
   var favicon = document.createElement('img');
   if (data['faviconUrl'])
     favicon.src = data['faviconUrl'];
-  row.insertBefore(favicon, row.firstChild);
+  var propertiesBox = row.querySelector('.properties-box');
+  propertiesBox.insertBefore(favicon, propertiesBox.firstChild);
 }
 
 function addWebViewDetails(row, data) {
@@ -397,13 +492,11 @@ function addWebViewDescription(row, webview) {
     subRow.className += ' invisible-view';
   if (viewStatus.visibility)
     subRow.appendChild(formatValue(viewStatus, 'visibility'));
-  subRow.appendChild(formatValue(viewStatus, 'position'));
+  if (viewStatus.position)
+    subRow.appendChild(formatValue(viewStatus, 'position'));
   subRow.appendChild(formatValue(viewStatus, 'size'));
-  var mainSubrow = row.querySelector('.subrow.main');
-  if (mainSubrow.nextSibling)
-    mainSubrow.parentNode.insertBefore(subRow, mainSubrow.nextSibling);
-  else
-    mainSubrow.parentNode.appendChild(subRow);
+  var subrowBox = row.querySelector('.subrow-box');
+  subrowBox.insertBefore(subRow, row.querySelector('.actions'));
 }
 
 function addWebViewThumbnail(row, webview, screenWidth, screenHeight) {
@@ -450,34 +543,37 @@ function addWebViewThumbnail(row, webview, screenWidth, screenHeight) {
     screenRect.appendChild(viewRect);
   }
 
-  row.insertBefore(thumbnail, row.firstChild);
+  var propertiesBox = row.querySelector('.properties-box');
+  propertiesBox.insertBefore(thumbnail, propertiesBox.firstChild);
 }
 
 function addTargetToList(data, list, properties) {
   var row = document.createElement('div');
   row.className = 'row';
 
+  var propertiesBox = document.createElement('div');
+  propertiesBox.className = 'properties-box';
+  row.appendChild(propertiesBox);
+
   var subrowBox = document.createElement('div');
   subrowBox.className = 'subrow-box';
-  row.appendChild(subrowBox);
+  propertiesBox.appendChild(subrowBox);
 
   var subrow = document.createElement('div');
-  subrow.className = 'subrow main';
+  subrow.className = 'subrow';
   subrowBox.appendChild(subrow);
 
-  var description = null;
   for (var j = 0; j < properties.length; j++)
     subrow.appendChild(formatValue(data, properties[j]));
 
-  if (description)
-    addWebViewDescription(description, subrowBox);
-
   var actionBox = document.createElement('div');
   actionBox.className = 'actions';
   subrowBox.appendChild(actionBox);
 
-  addActionLink(row, 'inspect', sendTargetCommand.bind(null, 'inspect', data),
-      data.hasNoUniqueId || data.adbAttachedForeign);
+  if (!data.hasCustomInspectAction) {
+    addActionLink(row, 'inspect', sendTargetCommand.bind(null, 'inspect', data),
+        data.hasNoUniqueId || data.adbAttachedForeign);
+  }
 
   list.appendChild(row);
   return row;
@@ -486,6 +582,7 @@ function addTargetToList(data, list, properties) {
 function addActionLink(row, text, handler, opt_disabled) {
   var link = document.createElement('span');
   link.classList.add('action');
+  link.setAttribute('tabindex', 1);
   if (opt_disabled)
     link.classList.add('disabled');
   else
@@ -493,6 +590,13 @@ function addActionLink(row, text, handler, opt_disabled) {
 
   link.textContent = text;
   link.addEventListener('click', handler, true);
+  function handleKey(e) {
+    if (e.keyIdentifier == 'Enter' || e.keyIdentifier == 'U+0020') {
+      e.preventDefault();
+      handler();
+    }
+  }
+  link.addEventListener('keydown', handleKey, true);
   row.querySelector('.actions').appendChild(link);
 }
 
@@ -561,7 +665,7 @@ function unsetModal(dialog) {
     if (dialog.tabIndexes[i] === null)
       node.removeAttribute('tabindex');
     else
-      node.setAttribute('tabindex', tabIndexes[i]);
+      node.setAttribute('tabindex', dialog.tabIndexes[i]);
   }
 
   if (window.holdDevices) {
@@ -590,6 +694,9 @@ function openPortForwardingConfig() {
 }
 
 function closePortForwardingConfig() {
+  if (!$('port-forwarding-overlay').classList.contains('open'))
+    return;
+
   $('port-forwarding-overlay').classList.remove('open');
   document.removeEventListener('keyup', handleKey);
   unsetModal($('port-forwarding-overlay'));
@@ -662,8 +769,8 @@ function createConfigLine(port, location) {
         line.classList.contains('fresh') &&
         !line.classList.contains('empty')) {
       // Tabbing forward on the fresh line, try create a new empty one.
-      commitFreshLineIfValid(true);
-      e.preventDefault();
+      if (commitFreshLineIfValid(true))
+        e.preventDefault();
     }
   });
 
@@ -689,7 +796,7 @@ function validatePort(input) {
   if (!match)
     return false;
   var port = parseInt(match[1]);
-  if (port < 1024 || 10000 < port)
+  if (port < 1024 || 65535 < port)
     return false;
 
   var inputs = document.querySelectorAll('input.port:not(.invalid)');
@@ -703,11 +810,11 @@ function validatePort(input) {
 }
 
 function validateLocation(input) {
-  var match = input.value.match(/^([a-zA-Z0-9\.]+):(\d+)$/);
+  var match = input.value.match(/^([a-zA-Z0-9\.\-_]+):(\d+)$/);
   if (!match)
     return false;
   var port = parseInt(match[2]);
-  return port <= 10000;
+  return port <= 65535;
 }
 
 function createEmptyConfigLine() {
@@ -778,12 +885,64 @@ function unselectLine() {
 function commitFreshLineIfValid(opt_selectNew) {
   var line = document.querySelector('.port-forwarding-pair.fresh');
   if (line.querySelector('.invalid'))
-    return;
+    return false;
   line.classList.remove('fresh');
   var freshLine = createEmptyConfigLine();
   line.parentNode.appendChild(freshLine);
   if (opt_selectNew)
     freshLine.querySelector('.port').focus();
+  return true;
+}
+
+function populatePortStatus(devicesStatusMap) {
+  for (var deviceId in devicesStatusMap) {
+    if (!devicesStatusMap.hasOwnProperty(deviceId))
+      continue;
+    var deviceStatusMap = devicesStatusMap[deviceId];
+
+    var deviceSection = $(deviceId);
+    if (!deviceSection)
+      continue;
+
+    var devicePorts = deviceSection.querySelector('.device-ports');
+    devicePorts.textContent = '';
+    for (var port in deviceStatusMap) {
+      if (!deviceStatusMap.hasOwnProperty(port))
+        continue;
+
+      var status = deviceStatusMap[port];
+      var portIcon = document.createElement('div');
+      portIcon.className = 'port-icon';
+      // status === 0 is the default (connected) state.
+      // Positive values correspond to the tunnelling connection count
+      // (in DEBUG_DEVTOOLS mode).
+      if (status > 0)
+        portIcon.classList.add('connected');
+      else if (status === -1 || status === -2)
+        portIcon.classList.add('transient');
+      else if (status < 0)
+        portIcon.classList.add('error');
+      devicePorts.appendChild(portIcon);
+
+      var portNumber = document.createElement('div');
+      portNumber.className = 'port-number';
+      portNumber.textContent = ':' + port;
+      if (status > 0)
+        portNumber.textContent += '(' + status + ')';
+      devicePorts.appendChild(portNumber);
+    }
+  }
+
+  function clearPorts(deviceSection) {
+    if (deviceSection.id in devicesStatusMap)
+      return;
+    deviceSection.querySelector('.device-ports').textContent = '';
+  }
+
+  Array.prototype.forEach.call(
+      document.querySelectorAll('.device'), clearPorts);
 }
 
 document.addEventListener('DOMContentLoaded', onload);
+
+window.addEventListener('hashchange', onHashChange);