Commit inline editable list changes when window loses focus.

chrome/browser/resources/options/inline_editable_list.js

 // Copyright (c) 2010 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('options', function() {
   const DeletableItem = options.DeletableItem;
   const DeletableItemList = options.DeletableItemList;
 
   /**
    * Creates a new list item with support for inline editing.
@@ skipping 54 matching lines @@
      * @type {HTMLElement}
      * @private
      */
     editClickTarget_: null,
 
     /** @inheritDoc */
     decorate: function() {
       DeletableItem.prototype.decorate.call(this);
 
       this.editFields_ = [];
-      this.addEventListener('mousedown', this.handleMouseDown_.bind(this));
-      this.addEventListener('keydown', this.handleKeyDown_.bind(this));
+      this.addEventListener('mousedown', this.handleMouseDown_);
+      this.addEventListener('keydown', this.handleKeyDown_);
       this.addEventListener('leadChange', this.handleLeadChange_);
     },
 
     /** @inheritDoc */
     selectionChanged: function() {
       this.updateEditState();
     },
 
     /**
      * Called when this element gains or loses 'lead' status. Updates editing
@@ skipping 234 matching lines @@
       for (var i = 0; i < editFields.length; i++) {
         if (editFields[i] == clickTarget ||
             editFields[i].staticVersion == clickTarget) {
           this.editClickTarget_ = editFields[i];
           return;
         }
       }
     },
   };
 
+  /**
+   * Takes care of committing changes to inline editable list items when the
+   * window loses focus.
+   */
+  function handleWindowBlurs() {
+    window.addEventListener('blur', function(e) {
+      var itemAncestor = findAncestor(document.activeElement, function(node) {
+        return node instanceof InlineEditableItem;
+      });
+      if (itemAncestor);
+        document.activeElement.blur();
+    });
+  }
+  handleWindowBlurs();
+
   var InlineEditableItemList = cr.ui.define('list');
 
   InlineEditableItemList.prototype = {
     __proto__: DeletableItemList.prototype,
 
     /** @inheritDoc */
     decorate: function() {
       DeletableItemList.prototype.decorate.call(this);
       this.setAttribute('inlineeditable', '');
       this.addEventListener('hasElementFocusChange',
@@ skipping 16 matching lines @@
       }
     },
   };
 
   // Export
   return {
     InlineEditableItem: InlineEditableItem,
     InlineEditableItemList: InlineEditableItemList,
   };
 });