Elide origins for passwords settings in CSS instead of JS

chrome/browser/resources/options/password_manager.js

Index: chrome/browser/resources/options/password_manager.js
diff --git a/chrome/browser/resources/options/password_manager.js b/chrome/browser/resources/options/password_manager.js
index 6263595fdd0e34b1deb478c70e4a59f54657b2b1..8322b5ff783e0a85fe8781500fe95d8234d142d2 100644
--- a/chrome/browser/resources/options/password_manager.js
+++ b/chrome/browser/resources/options/password_manager.js
@@ -171,56 +171,6 @@ cr.define('options', function() {
     },
 
     /**
-     * Updates eliding of origins. If there is no enough space to show the full
-     * origin, the origin is elided from the left with ellipsis.
-     * @param {!cr.ui.List} list The list to update eliding.
-     */
-    updateOriginsEliding_: function(list) {
-      var entries = list.getElementsByClassName('deletable-item');
-      if (entries.length == 0)
-        return;
-      var entry = entries[0];
-      var computedStyle = window.getComputedStyle(entry.urlDiv);
-      var columnWidth = entry.urlDiv.offsetWidth -
-          parseInt(computedStyle.webkitMarginStart, 10) -
-          parseInt(computedStyle.webkitPaddingStart, 10);
-
-      // We use a canvas context to compute text widths. This canvas is not
-      // part of the DOM and thus avoids layout thrashing when updating the
-      // contained text.
-      var canvas = document.createElement('canvas');
-      var ctx = canvas.getContext('2d');
-      ctx.font = computedStyle.font;
-
-      for (var i = 0; i < entries.length; ++i) {
-        entry = entries[i];
-        // For android://com.example, elide from the right.
-        if (!entry.isClickable)
-          continue;
-        var cellWidth = columnWidth;
-        if (entry.androidUriSuffix)
-          cellWidth -= entry.androidUriSuffix.offsetWidth;
-        var urlLink = entry.urlLink;
-        if (cellWidth <= 0) {
-          console.error('cellWidth <= 0. Skip origins eliding for ' +
-              urlLink.textContent);
-          continue;
-        }
-
-        var textContent = urlLink.textContent;
-        if (ctx.measureText(textContent).width <= cellWidth)
-          continue;
-
-        textContent = '…' + textContent.substring(1);
-        while (ctx.measureText(textContent).width > cellWidth)
-          textContent = '…' + textContent.substring(2);
-
-        // Write the elided origin back to the DOM.
-        urlLink.textContent = textContent;
-      }
-    },
-
-    /**
      * Updates the data model for the saved passwords list with the values from
      * |entries|.
      * @param {!Array} entries The list of saved password data.
@@ -247,9 +197,6 @@ cr.define('options', function() {
       }
       this.savedPasswordsList_.dataModel = new ArrayDataModel(entries);
       this.updateListVisibility_(this.savedPasswordsList_);
-      // updateOriginsEliding_ should be called after updateListVisibility_,
-      // otherwise updateOrigins... might be not able to read width of elements.
-      this.updateOriginsEliding_(this.savedPasswordsList_);
     },
 
     /**
@@ -260,9 +207,6 @@ cr.define('options', function() {
     setPasswordExceptionsList_: function(entries) {
       this.passwordExceptionsList_.dataModel = new ArrayDataModel(entries);
       this.updateListVisibility_(this.passwordExceptionsList_);
-      // updateOriginsEliding_ should be called after updateListVisibility_,
-      // otherwise updateOrigins... might be not able to read width of elements.
-      this.updateOriginsEliding_(this.passwordExceptionsList_);
     },
 
     /**