Revert of Revert "Typecheck JS files for chrome://extensions"

chrome/browser/resources/extensions/extension_error_overlay.js

Index: chrome/browser/resources/extensions/extension_error_overlay.js
diff --git a/chrome/browser/resources/extensions/extension_error_overlay.js b/chrome/browser/resources/extensions/extension_error_overlay.js
index 537b6892b55bb24eeae734063ce2dd8c0d0cabd8..5d5978c046e59565fd102ca2bf38c4646c526146 100644
--- a/chrome/browser/resources/extensions/extension_error_overlay.js
+++ b/chrome/browser/resources/extensions/extension_error_overlay.js
@@ -1,6 +1,35 @@
 // 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.
+
+/**
+ * The type of the stack trace object. The definition is based on
+ * extensions/browser/extension_error.cc:RuntimeError::ToValue().
+ * @typedef {{columnNumber: number,
+ *            functionName: string,
+ *            lineNumber: number,
+ *            url: string}}
+ */
+var StackTrace;
+
+/**
+ * The type of the extension error trace object. The definition is based on
+ * extensions/browser/extension_error.cc:RuntimeError::ToValue().
+ * @typedef {{canInspect: (boolean|undefined),
+ *            contextUrl: (string|undefined),
+ *            extensionId: string,
+ *            fromIncognito: boolean,
+ *            level: number,
+ *            manifestKey: string,
+ *            manifestSpecific: string,
+ *            message: string,
+ *            renderProcessId: (number|undefined),
+ *            renderViewId: (number|undefined),
+ *            source: string,
+ *            stackTrace: (Array.<StackTrace>|undefined),
+ *            type: number}}
+ */
+var RuntimeError;
 
 cr.define('extensions', function() {
   'use strict';
@@ -85,24 +114,24 @@
 
     /**
      * The underlying error whose details are being displayed.
-     * @type {Object}
-     * @private
-     */
-    error_: undefined,
+     * @type {?RuntimeError}
+     * @private
+     */
+    error_: null,
 
     /**
      * The URL associated with this extension, i.e. chrome-extension://<id>/.
-     * @type {string}
-     * @private
-     */
-    extensionUrl_: undefined,
+     * @type {?string}
+     * @private
+     */
+    extensionUrl_: null,
 
     /**
      * The node of the stack trace which is currently active.
-     * @type {HTMLElement}
-     * @private
-     */
-    currentFrameNode_: undefined,
+     * @type {?HTMLElement}
+     * @private
+     */
+    currentFrameNode_: null,
 
     /**
      * Initialize the RuntimeErrorContent for the first time.
@@ -113,8 +142,8 @@
        * @type {HTMLElement}
        * @private
        */
-      this.stackTrace_ =
-          this.querySelector('.extension-error-overlay-stack-trace-list');
+      this.stackTrace_ = /** @type {HTMLElement} */(
+          this.querySelector('.extension-error-overlay-stack-trace-list'));
       assert(this.stackTrace_);
 
       /**
@@ -122,14 +151,15 @@
        * @type {HTMLElement}
        * @private
        */
-      this.contextUrl_ =
-          this.querySelector('.extension-error-overlay-context-url');
+      this.contextUrl_ = /** @type {HTMLElement} */(
+          this.querySelector('.extension-error-overlay-context-url'));
       assert(this.contextUrl_);
     },
 
     /**
      * Sets the error for the content.
-     * @param {Object} error The error whose content should be displayed.
+     * @param {RuntimeError} error The error whose content should
+     *     be displayed.
      * @param {string} extensionUrl The URL associated with this extension.
      */
     setError: function(error, extensionUrl) {
@@ -145,9 +175,9 @@
      * Wipe content associated with a specific error.
      */
     clearError: function() {
-      this.error_ = undefined;
-      this.extensionUrl_ = undefined;
-      this.currentFrameNode_ = undefined;
+      this.error_ = null;
+      this.extensionUrl_ = null;
+      this.currentFrameNode_ = null;
       clearElement(this.stackTrace_);
       this.stackTrace_.hidden = true;
     },
@@ -155,7 +185,7 @@
     /**
      * Makes |frame| active and deactivates the previously active frame (if
      * there was one).
-     * @param {HTMLElement} frame The frame to activate.
+     * @param {HTMLElement} frameNode The frame to activate.
      * @private
      */
     setActiveFrame_: function(frameNode) {
@@ -189,8 +219,8 @@
         // The description is a human-readable summation of the frame, in the
         // form "<relative_url>:<line_number> (function)", e.g.
         // "myfile.js:25 (myFunction)".
-        var description = getRelativeUrl(frame.url, this.extensionUrl_) +
-                          ':' + frame.lineNumber;
+        var description = getRelativeUrl(frame.url,
+            assert(this.extensionUrl_)) + ':' + frame.lineNumber;
         if (frame.functionName) {
           var functionName = frame.functionName == '(anonymous function)' ?
               loadTimeData.getString('extensionErrorOverlayAnonymousFunction') :
@@ -204,9 +234,6 @@
         // code with the line highlighted, and link the "Open DevTools" button
         // with that frame.
         frameNode.addEventListener('click', function(frame, frameNode, e) {
-          if (this.currStackFrame_ == frameNode)
-            return;
-
           this.setActiveFrame_(frameNode);
 
           // Request the file source with the section highlighted; this will
@@ -228,7 +255,8 @@
       // internal frames.)
       if (this.stackTrace_.children.length > 0) {
         this.stackTrace_.hidden = false;
-        this.setActiveFrame_(this.stackTrace_.firstChild);
+        this.setActiveFrame_(assertInstanceof(this.stackTrace_.firstChild,
+            HTMLElement));
       }
     },
 
@@ -344,10 +372,10 @@
   ExtensionErrorOverlay.prototype = {
     /**
      * The underlying error whose details are being displayed.
-     * @type {Object}
-     * @private
-     */
-    error_: undefined,
+     * @type {?RuntimeError}
+     * @private
+     */
+    error_: null,
 
     /**
      * Initialize the page.
@@ -370,12 +398,13 @@
        * @type {HTMLDivElement}
        * @private
        */
-      this.overlayDiv_ = $('extension-error-overlay');
+      this.overlayDiv_ = /** @type {HTMLDivElement} */(
+          $('extension-error-overlay'));
 
       /**
        * The portion of the overlay which shows the code relating to the error
        * and the corresponding line numbers.
-       * @type {ExtensionCode}
+       * @type {extensions.ExtensionCode}
        * @private
        */
       this.codeDiv_ =
@@ -383,7 +412,6 @@
 
       /**
        * The function to show or hide the ExtensionErrorOverlay.
-       * @type {function}
        * @param {boolean} isVisible Whether the overlay should be visible.
        */
       this.setVisible = function(isVisible) {
@@ -398,7 +426,8 @@
        * @type {HTMLButtonElement}
        * @private
        */
-      this.openDevtoolsButton_ = $('extension-error-overlay-devtools-button');
+      this.openDevtoolsButton_ = /** @type {HTMLButtonElement} */(
+          $('extension-error-overlay-devtools-button'));
       this.openDevtoolsButton_.addEventListener('click', function() {
           this.runtimeErrorContent_.openDevtools();
       }.bind(this));
@@ -429,7 +458,7 @@
         this.runtimeErrorContent_.clearError();
       }
 
-      this.error_ = undefined;
+      this.error_ = null;
     },
 
     /**
@@ -437,7 +466,7 @@
      * overlay, and, if possible, will populate the code section of the overlay
      * with the relevant file, load the stack trace, and generate links for
      * opening devtools (the latter two only happen for runtime errors).
-     * @param {Object} error The error to show in the overlay.
+     * @param {RuntimeError} error The error to show in the overlay.
      * @param {string} extensionUrl The URL of the extension, in the form
      *     "chrome-extension://<extension_id>".
      */
@@ -475,10 +504,12 @@
       }
     },
 
+
     /**
      * Set the code to be displayed in the code portion of the overlay.
      * @see ExtensionErrorOverlay.requestFileSourceResponse().
-     * @param {?Object} code The code to be displayed. If |code| is null, then
+     * @param {?ExtensionHighlight} code The code to be displayed. If |code| is
+     *     null, then
      *     a "Could not display code" message will be displayed instead.
      */
     setCode: function(code) {
@@ -495,11 +526,10 @@
   /**
    * Called by the ExtensionErrorHandler responding to the request for a file's
    * source. Populate the content area of the overlay and display the overlay.
-   * @param {Object?} result An object with four strings - the title,
-   *     beforeHighlight, afterHighlight, and highlight. The three 'highlight'
-   *     strings represent three portions of the file's content to display - the
-   *     portion which is most relevant and should be emphasized (highlight),
-   *     and the parts both before and after this portion. These may be empty.
+   * @param {?ExtensionHighlight} result The three 'highlight' strings represent
+   *     three portions of the file's content to display - the portion which is
+   *     most relevant and should be emphasized (highlight), and the parts both
+   *     before and after this portion. These may be empty.
    */
   ExtensionErrorOverlay.requestFileSourceResponse = function(result) {
     var overlay = extensions.ExtensionErrorOverlay.getInstance();