Stop rebuilding all elements in chrome://extensions to preserve focus on refresh

chrome/browser/resources/extensions/create_node.js

+// TODO(hcarmona): Remove this temporary file.
+
+    /**
+     * Synthesizes and initializes an HTML element for the extension metadata
+     * given in |extension|.
+     * @param {ExtensionData} extension A dictionary of extension metadata.
+     * @private
+     */
+    createNode_: function(extension) {
+      var template = $('template-collection').querySelector(
+          '.extension-list-item-wrapper');
+      var node = template.cloneNode(true);
+      node.id = extension.id;
+
+      // The 'Show Browser Action' button.
+      var showButton = node.querySelector('.show-button');
+      showButton.showButtonHandler = function(e) {
+        chrome.send('extensionSettingsShowButton', [extension.id]);
+      };
+
+      // The 'allow in incognito' checkbox.
+      var incognito = node.querySelector('.incognito-control input');
+      incognito.changeHandler = function(e) {
+        var checked = e.target.checked;
+        butterBarVisibility[extension.id] = checked;
+        var butterBar = node.querySelector('.butter-bar');
+        butterBar.hidden = !checked || extension.is_hosted_app;
+        chrome.send('extensionSettingsEnableIncognito',
+            [extension.id, String(checked)]);
+      };
+
+      // The 'collect errors' checkbox. This should only be visible if the
+      // error console is enabled - we can detect this by the existence of the
+      // |errorCollectionEnabled| property.
+      var errorCollection =
+          node.querySelector('.error-collection-control input');
+      errorCollection.changeHandler = function(e) {
+        chrome.send('extensionSettingsEnableErrorCollection',
+            [extension.id, String(e.target.checked)]);
+      };
+
+      // The 'allow on all urls' checkbox. This should only be visible if
+      // active script restrictions are enabled. If they are not enabled, no
+      // extensions should want all urls.
+      var allUrls = node.querySelector('.all-urls-control');
+      allUrls.clickHandler = function(e) {
+        chrome.send('extensionSettingsAllowOnAllUrls',
+                    [extension.id, String(e.target.checked)]);
+      };
+
+      // The 'allow file:// access' checkbox.
+      var fileAccess = node.querySelector('.file-access-control');
+      fileAccess.clickHandler = function(e) {
+        chrome.send('extensionSettingsAllowFileAccess',
+                    [extension.id, String(e.target.checked)]);
+      };
+
+      // The 'Options' button or link, depending on its behaviour.
+      var optionsLink = node.querySelector('.options-link');
+      // Set an href to get the correct mouse-over appearance (link,
+      // footer) - but the actual link opening is done through chrome.send
+      // with a preventDefault().
+      optionsLink.setAttribute('href', extension.optionsPageHref);
+      optionsLink.clickHanlder = function() {
+        chrome.send('extensionSettingsOptions', [extension.id]);
+      };
+
+      var optionsButton = options = node.querySelector('.options-button');
+      optionsButton.clickHanlder = function() {
+        this.showEmbeddedExtensionOptions_(extension.id, false);
+      }.bind(this);
+
+      // The 'Permissions' link.
+      var permissions = node.querySelector('.permissions-link');
+      permissions.addEventListener('click', function(e) {
+        chrome.send('extensionSettingsPermissions', [extension.id]);
+        e.preventDefault();
+      });
+
+      // The 'Reload' link.
+      var reload = node.querySelector('.reload-link');
+      reload.clickHanlder = function(e) {
+        chrome.send('extensionSettingsReload', [extension.id]);
+        extensionReloadedTimestamp[extension.id] = Date.now();
+      };
+
+      // The 'Launch' link.
+      var launch = node.querySelector('.launch-link');
+      launch.clickHandler = function(e) {
+        chrome.send('extensionSettingsLaunch', [extension.id]);
+      };
+
+      // The 'Reload' terminated link.
+      var terminatedReload = node.querySelector('.terminated-reload-link');
+      terminatedReload.clickHandler = function() {
+        chrome.send('extensionSettingsReload', [extension.id]);
+      };
+
+      // The 'Repair' corrupted link.
+      var repair = node.querySelector('.corrupted-repair-button');
+      repair.clickHandler = function() {
+        chrome.send('extensionSettingsRepair', [extension.id]);
+      };
+
+      // The 'Enabled' checkbox.
+      var enable = node.querySelector('.enable-checkbox');
+      enable.clickHandler = function(e) {
+        // When e.target is the label instead of the checkbox, it doesn't
+        // have the checked property and the state of the checkbox is
+        // left unchanged.
+        var checked = e.target.checked;
+        if (checked == undefined)
+          checked = !e.currentTarget.querySelector('input').checked;
+        chrome.send('extensionSettingsEnable',
+                    [extension.id, checked ? 'true' : 'false']);
+
+        // This may seem counter-intuitive (to not set/clear the checkmark)
+        // but this page will be updated asynchronously if the extension
+        // becomes enabled/disabled. It also might not become enabled or
+        // disabled, because the user might e.g. get prompted when enabling
+        // and choose not to.
+        e.preventDefault();
+      };
+
+      // 'Remove' button.
+      var trashTemplate = $('template-collection').querySelector('.trash');
+      var trash = trashTemplate.cloneNode(true);
+      trash.title = loadTimeData.getString('extensionUninstall');
+      trash.addEventListener('click', function(e) {
+        butterBarVisibility[extension.id] = false;
+        chrome.send('extensionSettingsUninstall', [extension.id]);
+      });
+      node.querySelector('.enable-controls').appendChild(trash);
+
+      // Developer mode ////////////////////////////////////////////////////////
+
+      // Then the path, if provided by unpacked extension.
+      var loadPath = node.querySelector('.load-path');
+      var pathLink = loadPath.querySelector('a:nth-of-type(1)');
+      pathLink.clickHandler = function(e) {
+        chrome.send('extensionSettingsShowPath', [String(extension.id)]);
+        e.preventDefault();
+      };
+
+      this.appendChild(node);
+      this.updateNode_(extension, node);
+    },