DevTools: Add autocomplete for ARIA

third_party/WebKit/Source/devtools/front_end/accessibility/ARIAAttributesView.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.
 
 /**
  * @constructor
  * @extends {WebInspector.AccessibilitySubPane}
  */
 WebInspector.ARIAAttributesPane = function()
 {
@@ skipping 116 matching lines @@
          * @param {string} previousContent
          * @param {!Event} event
          * @this {WebInspector.ARIAAttributesTreeElement}
          */
         function blurListener(previousContent, event)
         {
             var text = event.target.textContent;
             this._editingCommitted(text, previousContent);
         }
 
-        this._prompt = new WebInspector.ARIAAttributesPane.ARIAAttributePrompt(this);
+        this._prompt = new WebInspector.ARIAAttributesPane.ARIAAttributePrompt(WebInspector.ariaMetadata().valuesForProperty(this._nameElement.textContent), this);
         this._prompt.setAutocompletionTimeout(0);
         var proxyElement = this._prompt.attachAndStartEditing(valueElement, blurListener.bind(this, previousContent));
 
         proxyElement.addEventListener("keydown", this._editingValueKeyDown.bind(this, previousContent), false);
 
         valueElement.getComponentSelection().setBaseAndExtent(valueElement, 0, valueElement, 1);
     },
 
     _removePrompt: function()
     {
@@ skipping 54 matching lines @@
 WebInspector.ARIAAttributesTreeElement.createARIAValueElement = function(value)
 {
     var valueElement = createElementWithClass("span", "monospace");
     // TODO(aboxhall): quotation marks?
     valueElement.setTextContentTruncatedIfNeeded(value || "");
     return valueElement;
 };
 
 /**
  * @constructor
- * TODO: completions; see StylesSidebarPane.js
  * @extends {WebInspector.TextPrompt}
+ * @param {!Array<string>} ariaCompletions
  * @param {!WebInspector.ARIAAttributesTreeElement} treeElement
  */
-WebInspector.ARIAAttributesPane.ARIAAttributePrompt = function(treeElement)
+WebInspector.ARIAAttributesPane.ARIAAttributePrompt = function(ariaCompletions, treeElement)
 {
     WebInspector.TextPrompt.call(this, this._buildPropertyCompletions.bind(this));
 
+    this.setSuggestBoxEnabled(true);
+
+    this._ariaCompletions = ariaCompletions;
     this._treeElement = treeElement;
 };
 
 WebInspector.ARIAAttributesPane.ARIAAttributePrompt.prototype = {
     /**
      * @param {!Element} proxyElement
      * @param {!Range} wordRange
      * @param {boolean} force
      * @param {function(!Array.<string>, number=)} completionsReadyCallback
      */
     _buildPropertyCompletions: function(proxyElement, wordRange, force, completionsReadyCallback)
     {
-        // TODO(aboxhall): replace placeholder implementation with real implementation
-        completionsReadyCallback([], 0);
+        var prefix = wordRange.toString().toLowerCase();
+        if (!prefix && !force && (this._isEditingName || proxyElement.textContent.length)) {
+            completionsReadyCallback([]);
+            return;
+        }
+
+        var results = this._ariaCompletions.filter((value) => value.startsWith(prefix));
+
+        completionsReadyCallback(results, 0);
     },
 
     __proto__: WebInspector.TextPrompt.prototype
 }
 
 
 WebInspector.ARIAAttributesPane._attributes = [
     "role",
     "aria-busy",
     "aria-checked",
@@ skipping 24 matching lines @@
     "aria-readonly",
     "aria-relevant",
     "aria-required",
     "aria-setsize",
     "aria-sort",
     "aria-valuemax",
     "aria-valuemin",
     "aria-valuenow",
     "aria-valuetext",
 ];