Bug 1143742 - part3: multiline inplace-editor autocomplete behavior;r=gl

The default inplace-editor autocomplete behavior is not userfriendly
when combined with a multiline inplace-editor. Navigating up/down might
trigger an autocomplete suggestion.

Also, the autocomplete popup is not displayed at the correct position and
should take the multiline into account.

MozReview-Commit-ID: JTiCQ3HK5bn

--HG--
extra : rebase_source : 001becbe7cfde064b2163e7c2ebcc4aa82e22610

devtools/client/shared/inplace-editor.js

@@ -1326,7 +1326,8 @@ InplaceEditor.prototype = {
       if (finalList.length > 1) {
         // Calculate the popup horizontal offset.
         let indent = this.input.selectionStart - query.length;
-        let offset = indent * this.inputCharWidth;
+        let offset = indent * this.inputCharDimensions.width;
+        offset = this._isSingleLine() ? offset : 0;
 
         // Select the most relevantItem if autoInsert is allowed
         let selectedIndex = autoInsert ? mostRelevantIndex : -1;
@@ -1342,6 +1343,16 @@ InplaceEditor.prototype = {
       this._doValidation();
     }, 0);
   },
+
+  /**
+   * Check if the current input is displaying more than one line of text.
+   *
+   * @return {Boolean} true if the input has a single line of text
+   */
+  _isSingleLine: function() {
+    let inputRect = this.input.getBoundingClientRect();
+    return inputRect.height < 2 * this.inputCharDimensions.height;
+  },
 };
 
 /**