MD Settings: Display: Fix runtime error

chrome/browser/resources/settings/device_page/display_layout.js

 // Copyright 2016 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.
 
 /**
  * @fileoverview
  * 'display-layout' presents a visual representation of the layout of one or
  * more displays and allows them to be arranged.
  */
 
@@ skipping 57 matching lines @@
         !this.mirroring, this.$.displayArea, this.onDrag_.bind(this));
   },
 
   /**
    * Calculates the visual offset and scale for the display area
    * (i.e. the ratio of the display area div size to the area required to
    * contain the DisplayUnitInfo bounding boxes).
    * @return {boolean} Whether the calculation was successful.
    * @private
    */
-  calculateVisualScale_() {
+  calculateVisualScale_: function() {
     var displayAreaDiv = this.$.displayArea;
     if (!displayAreaDiv || !displayAreaDiv.offsetWidth || !this.displays ||
         !this.displays.length) {
       return false;
     }
 
     var display = this.displays[0];
     var bounds = this.getCalculatedDisplayBounds(display.id);
     var boundsBoundingBox = {
       left: bounds.left,
@@ skipping 119 matching lines @@
       // Make sure the dragged display is also selected.
       if (id != this.selectedDisplay.id)
         this.fire('select-display', id);
 
       var calculatedBounds = this.getCalculatedDisplayBounds(id);
       newBounds =
           /** @type {chrome.system.display.Bounds} */ (
               Object.assign({}, calculatedBounds));
       newBounds.left += Math.round(amount.x / this.visualScale);
       newBounds.top += Math.round(amount.y / this.visualScale);
-      newBounds = this.updateDisplayBounds(id, newBounds);
+
+      if (this.displays.length >= 2)
+        newBounds = this.updateDisplayBounds(id, newBounds);
     }
     var left =
         this.visualOffset_.left + Math.round(newBounds.left * this.visualScale);
     var top =
         this.visualOffset_.top + Math.round(newBounds.top * this.visualScale);
     var div = this.$$('#_' + id);
     div.style.left = '' + left + 'px';

[dpapad, 2016/11/23 18:18:43]

Unrelated drive-by question: What is the point of using '' here? Why not just?
div.style.left = left + 'px';

Also this file is not consistent with itself, since it makes use of ES6 template
literals like `${left}px` in some places, but not here.

[stevenjb, 2016/11/23 18:44:32]

Some of this code is new, some of it was copy/pasted from options.

I expect the '' + ... is a C++ ish thing where string << number can be a valid
string concatenation but number << string is not.

When I am in here next I'll try to remember to do a pass to make everything use
ES6 template literals.

[dpapad, 2016/11/23 18:51:21]

I suggest holding off ES6-ifying this file, because we actually might need to go
the opposite direction for the purposes of vulcaniz-ation. There are known
issues, for example template string literals `${foo}` are not handled yet by
vulcanize.

     div.style.top = '' + top + 'px';
   },
 
 });
 
 })();