DevTools: Flesh out AccessibilityModel and use SDK objects instead of protocol objects

BUG=

Review-Url: https://chromiumcodereview.appspot.com/2436703003
Cr-Commit-Position: refs/heads/master@{#426537}

third_party/WebKit/LayoutTests/inspector/elements/accessibility/accessibility-pane-test.js

@@ -31,7 +31,7 @@ InspectorTest.dumpSelectedElementAccessibilityNode = function()
 }
 
 /**
- * @param {!AccessibilityAgent.AXNode} accessibilityNode
+ * @param {!WebInspector.AccessibilityNode} accessibilityNode
  */
 InspectorTest.dumpAccessibilityNode = function(accessibilityNode)
 {
@@ -42,11 +42,11 @@ InspectorTest.dumpAccessibilityNode = function(accessibilityNode)
     }
 
     var builder = [];
-    builder.push(accessibilityNode.role.value);
-    builder.push(accessibilityNode.name ? '"' + accessibilityNode.name.value + '"'
+    builder.push(accessibilityNode.role().value);
+    builder.push(accessibilityNode.name() ? '"' + accessibilityNode.name().value + '"'
                 : "<undefined>");
-    if ("properties" in accessibilityNode) {
-        for (var property of accessibilityNode.properties) {
+    if (accessibilityNode.properties()) {
+        for (var property of accessibilityNode.properties()) {
             if ("value" in property)
                 builder.push(property.name + '="' + property.value.value + '"');
         }

third_party/WebKit/Source/devtools/front_end/accessibility/ARIAAttributesView.js

@@ -46,14 +46,14 @@ WebInspector.ARIAAttributesPane.prototype = {
 
 /**
  * @constructor
- * @extends {WebInspector.AXNodePropertyTreeElement}
+ * @extends {TreeElement}
  * @param {!WebInspector.ARIAAttributesPane} parentPane
  * @param {!WebInspector.DOMNode.Attribute} attribute
  * @param {!WebInspector.Target} target
  */
 WebInspector.ARIAAttributesTreeElement = function(parentPane, attribute, target)
 {
-    WebInspector.AXNodePropertyTreeElement.call(this, target);
+    TreeElement.call(this, "");
 
     this._parentPane = parentPane;
     this._attribute = attribute;
@@ -80,7 +80,6 @@ WebInspector.ARIAAttributesTreeElement.prototype = {
     },
 
     /**
-     * @override
      * @param {string} name
      */
     appendNameElement: function(name)
@@ -192,7 +191,7 @@ WebInspector.ARIAAttributesTreeElement.prototype = {
         }
     },
 
-    __proto__: WebInspector.AXNodePropertyTreeElement.prototype
+    __proto__: TreeElement.prototype
 };
 
 /**

third_party/WebKit/Source/devtools/front_end/accessibility/AXTreePane.js

@@ -18,7 +18,7 @@ WebInspector.AXTreePane = function()
 
 WebInspector.AXTreePane.prototype = {
     /**
-     * @param {!Array<!AccessibilityAgent.AXNode>} nodes
+     * @param {!Array<!WebInspector.AccessibilityNode>} nodes
      */
     setAXNodeAndAncestors: function(nodes)
     {
@@ -46,12 +46,12 @@ WebInspector.AXTreePane.prototype = {
 /**
  * @constructor
  * @extends {TreeElement}
- * @param {!AccessibilityAgent.AXNode} axNode
+ * @param {!WebInspector.AccessibilityNode} axNode
  * @param {!WebInspector.Target} target
  */
 WebInspector.AXNodeTreeElement = function(axNode, target)
 {
-    /** @type {!AccessibilityAgent.AXNode} */
+    /** @type {!WebInspector.AccessibilityNode} */
     this._axNode = axNode;
 
     /** @type {!WebInspector.Target} */
@@ -82,13 +82,13 @@ WebInspector.AXNodeTreeElement.prototype = {
     {
         this.listItemElement.removeChildren();
 
-        if (this._axNode.ignored) {
+        if (this._axNode.ignored()) {
             this._appendIgnoredNodeElement();
         } else {
-            this._appendRoleElement(this._axNode.role);
-            if ("name" in this._axNode && this._axNode.name.value) {
+            this._appendRoleElement(this._axNode.role());
+            if ("name" in this._axNode && this._axNode.name().value) {
                 this.listItemElement.createChild("span", "separator").textContent = "\u00A0";
-                this._appendNameElement(/** @type {string} */ (this._axNode.name.value));
+                this._appendNameElement(/** @type {string} */ (this._axNode.name().value));
             }
         }
     },
@@ -105,7 +105,7 @@ WebInspector.AXNodeTreeElement.prototype = {
     },
 
     /**
-     * @param {!AccessibilityAgent.AXValue=} role
+     * @param {?AccessibilityAgent.AXValue} role
      */
     _appendRoleElement: function(role)
     {

third_party/WebKit/Source/devtools/front_end/accessibility/AccessibilityModel.js

@@ -2,6 +2,121 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+/**
+ * @constructor
+ * @extends {WebInspector.SDKObject}
+ * @param {!WebInspector.AccessibilityModel} accessibilityModel
+ * @param {!AccessibilityAgent.AXNode} payload
+ */
+WebInspector.AccessibilityNode = function(accessibilityModel, payload)
+{
+    WebInspector.SDKObject.call(this, accessibilityModel.target());
+    this._accessibilityModel = accessibilityModel;
+    this._agent = accessibilityModel._agent;
+
+    this._id = payload.nodeId;
+    accessibilityModel._setAXNodeForAXId(this._id, this);
+
+    this._ignored = payload.ignored;
+    if (this._ignored && "ignoredReasons" in payload)
+        this._ignoredReasons = payload.ignoredReasons;
+
+    this._role = payload.role || null;
+    this._name = payload.name || null;
+    this._description = payload.description || null;
+    this._value = payload.value || null;
+    this._properties = payload.properties || null;
+    this._parentId = payload.parentId || null;
+    this._childIds = payload.childIds || null;
+    this._domNodeId = payload.domNodeId || null;
+};
+
+WebInspector.AccessibilityNode.prototype = {
+    /**
+     * @return {boolean}
+     */
+    ignored: function()
+    {
+        return this._ignored;
+    },
+
+    /**
+     * @return {?Array<!AccessibilityAgent.AXProperty>}
+     */
+    ignoredReasons: function()
+    {
+        return this._ignoredReasons || null;
+    },
+
+    /**
+     * @return {?AccessibilityAgent.AXValue}
+     */
+    role: function()
+    {
+        return this._role || null;
+    },
+
+    /**
+     * @return {!Array<!AccessibilityAgent.AXProperty>}
+     */
+    coreProperties: function()
+    {
+        var properties = [];
+
+        if (this._name)
+            properties.push(/** @type {!AccessibilityAgent.AXProperty} */ ({name: "name", value: this._name}));
+        if (this._description)
+            properties.push(/** @type {!AccessibilityAgent.AXProperty} */ ({name: "description", value: this._description}));
+        if (this._value)
+            properties.push(/** @type {!AccessibilityAgent.AXProperty} */ ({name: "value", value: this._value}));
+
+        return properties;
+    },
+
+    /**
+     * @return {?AccessibilityAgent.AXValue}
+     */
+    name: function()
+    {
+        return this._name || null;
+    },
+
+    /**
+     * @return {?AccessibilityAgent.AXValue}
+     */
+    description: function()
+    {
+        return this._description || null;
+    },
+
+    /**
+     * @return {?AccessibilityAgent.AXValue}
+     */
+    value: function()
+    {
+        return this._value || null;
+    },
+
+    /**
+     * @return {?Array<!AccessibilityAgent.AXProperty>}
+     */
+    properties: function()
+    {
+        return this._properties || null;
+    },
+
+    /**
+     * @return {?WebInspector.AccessibilityNode}
+     */
+    parentNode: function()
+    {
+        if (!this._parentId)
+            return null;
+        return this._accessibilityModel.axNodeForId(this._parentId);
+    },
+
+    __proto__: WebInspector.SDKObject.prototype
+};
 
 /**
  * @constructor
@@ -12,31 +127,66 @@ WebInspector.AccessibilityModel = function(target)
 {
     WebInspector.SDKModel.call(this, WebInspector.AccessibilityModel, target);
     this._agent = target.accessibilityAgent();
+
+    /** @type {!Map<string, !WebInspector.AccessibilityNode>} */
+    this._axIdToAXNode = new Map();
 };
 
 WebInspector.AccessibilityModel.prototype = {
+
+    /**
+     * @param {string} axId
+     * @return {?WebInspector.AccessibilityNode}
+     */
+    axNodeForId: function(axId)
+    {
+        return this._axIdToAXNode.get(axId);
+    },
+
+    /**
+     * @param {string} axId
+     * @param {!WebInspector.AccessibilityNode} axNode
+     */
+    _setAXNodeForAXId: function(axId, axNode)
+    {
+        this._axIdToAXNode.set(axId, axNode);
+    },
+
     /**
-     * @param {!DOMAgent.NodeId} nodeId
-     * @return {!Promise.<?Array<!AccessibilityAgent.AXNode>>}
+     * @param {!WebInspector.DOMNode} node
+     * @return {!Promise<?Array<!WebInspector.AccessibilityNode>>}
      */
-    getAXNodeChain: function(nodeId)
+    getAXNodeChain: function(node)
     {
+        this._axIdToAXNode.clear();
+
         /**
+         * @this {WebInspector.AccessibilityModel}
          * @param {?string} error
-         * @param {!Array<!AccessibilityAgent.AXNode>=} nodes
-         * @return {?Array<!AccessibilityAgent.AXNode>}
+         * @param {!Array<!AccessibilityAgent.AXNode>=} payloads
+         * @return {?Array<!WebInspector.AccessibilityNode>}
          */
-        function parsePayload(error, nodes)
+        function parsePayload(error, payloads)
         {
-            if (error)
+            if (error) {
                 console.error("AccessibilityAgent.getAXNodeChain(): " + error);
-            return nodes || null;
+                return null;
+            }
+
+            if (!payloads)
+                return null;
+
+            var nodes = [];
+            for (var payload of payloads)
+                nodes.push(new WebInspector.AccessibilityNode(this, payload));
+
+            return nodes;
         }
-        return this._agent.getAXNodeChain(nodeId, true, parsePayload);
+        return this._agent.getAXNodeChain(node.id, true, parsePayload.bind(this));
     },
 
     __proto__: WebInspector.SDKModel.prototype
-}
+};
 
 WebInspector.AccessibilityModel._symbol = Symbol("AccessibilityModel");
 /**

third_party/WebKit/Source/devtools/front_end/accessibility/AccessibilityNodeView.js

@@ -22,7 +22,7 @@ WebInspector.AXNodeSubPane = function()
 
 WebInspector.AXNodeSubPane.prototype = {
     /**
-     * @param {?AccessibilityAgent.AXNode} axNode
+     * @param {?WebInspector.AccessibilityNode} axNode
      * @override
      */
     setAXNode: function(axNode)
@@ -35,7 +35,6 @@ WebInspector.AXNodeSubPane.prototype = {
         treeOutline.removeChildren();
         var ignoredReasons = this._ignoredReasonsTree;
         ignoredReasons.removeChildren();
-        var target = this.node().target();
 
         if (!axNode) {
             treeOutline.element.classList.add("hidden");
@@ -46,7 +45,9 @@ WebInspector.AXNodeSubPane.prototype = {
             this.element.classList.add("ax-ignored-node-pane");
 
             return;
-        } else if (axNode.ignored) {
+        }
+
+        if (axNode.ignored()) {
             this._noNodeInfo.classList.add("hidden");
             treeOutline.element.classList.add("hidden");
             this.element.classList.add("ax-ignored-node-pane");
@@ -58,9 +59,9 @@ WebInspector.AXNodeSubPane.prototype = {
              */
             function addIgnoredReason(property)
             {
-                ignoredReasons.appendChild(new WebInspector.AXNodeIgnoredReasonTreeElement(property, axNode, target));
+                ignoredReasons.appendChild(new WebInspector.AXNodeIgnoredReasonTreeElement(property, /** @type {!WebInspector.AccessibilityNode} */ (axNode)));
             }
-            var ignoredReasonsArray = /** @type {!Array<!AccessibilityAgent.AXProperty>} */(axNode.ignoredReasons);
+            var ignoredReasonsArray = /** @type {!Array<!AccessibilityAgent.AXProperty>} */(axNode.ignoredReasons());
             for (var reason of ignoredReasonsArray)
                 addIgnoredReason(reason);
             if (!ignoredReasons.firstChild())
@@ -80,21 +81,17 @@ WebInspector.AXNodeSubPane.prototype = {
          */
         function addProperty(property)
         {
-            treeOutline.appendChild(new WebInspector.AXNodePropertyTreePropertyElement(property, target));
+            treeOutline.appendChild(new WebInspector.AXNodePropertyTreePropertyElement(property, /** @type {!WebInspector.AccessibilityNode} */ (axNode)));
         }
 
-        for (var propertyName of ["name", "description", "help", "value"]) {
-            if (propertyName in axNode) {
-                var defaultProperty = /** @type {!AccessibilityAgent.AXProperty} */ ({name: propertyName, value: axNode[propertyName]});
-                addProperty(defaultProperty);
-            }
-        }
+        for (var property of axNode.coreProperties())
+            addProperty(property);
 
-        var roleProperty = /** @type {!AccessibilityAgent.AXProperty} */ ({name: "role", value: axNode.role});
+        var roleProperty = /** @type {!AccessibilityAgent.AXProperty} */ ({name: "role", value: axNode.role()});
         addProperty(roleProperty);
 
         var propertyMap = {};
-        var propertiesArray = /** @type {!Array.<!AccessibilityAgent.AXProperty>} */ (axNode.properties);
+        var propertiesArray = /** @type {!Array.<!AccessibilityAgent.AXProperty>} */ (axNode.properties());
         for (var property of propertiesArray)
             propertyMap[property.name] = property;
 
@@ -122,12 +119,12 @@ WebInspector.AXNodeSubPane.prototype = {
 
 /**
  * @constructor
+ * @param {!WebInspector.AccessibilityNode} axNode
  * @extends {TreeElement}
- * @param {!WebInspector.Target} target
  */
-WebInspector.AXNodePropertyTreeElement = function(target)
+WebInspector.AXNodePropertyTreeElement = function(axNode)
 {
-    this._target = target;
+    this._axNode = axNode;
 
     // Pass an empty title, the title gets made later in onattach.
     TreeElement.call(this, "");
@@ -239,7 +236,7 @@ WebInspector.AXNodePropertyTreeElement.prototype = {
             var sources = value.sources;
             for (var i = 0; i < sources.length; i++) {
                 var source = sources[i];
-                var child = new WebInspector.AXValueSourceTreeElement(source, this._target);
+                var child = new WebInspector.AXValueSourceTreeElement(source, this._axNode);
                 this.appendChild(child);
             }
             this.expand();
@@ -255,7 +252,7 @@ WebInspector.AXNodePropertyTreeElement.prototype = {
      */
     appendRelatedNode: function(relatedNode, index)
     {
-        var deferredNode = new WebInspector.DeferredDOMNode(this._target, relatedNode.backendNodeId);
+        var deferredNode = new WebInspector.DeferredDOMNode(this._axNode.target(), relatedNode.backendNodeId);
         var nodeTreeElement = new WebInspector.AXRelatedNodeSourceTreeElement({ deferredNode: deferredNode }, relatedNode);
         this.appendChild(nodeTreeElement);
     },
@@ -265,7 +262,7 @@ WebInspector.AXNodePropertyTreeElement.prototype = {
      */
     appendRelatedNodeInline: function(relatedNode)
     {
-        var deferredNode = new WebInspector.DeferredDOMNode(this._target, relatedNode.backendNodeId);
+        var deferredNode = new WebInspector.DeferredDOMNode(this._axNode.target(), relatedNode.backendNodeId);
         var linkedNode = new WebInspector.AXRelatedNodeElement({ deferredNode: deferredNode }, relatedNode);
         this.listItemElement.appendChild(linkedNode.render());
     },
@@ -294,15 +291,15 @@ WebInspector.AXNodePropertyTreeElement.prototype = {
  * @constructor
  * @extends {WebInspector.AXNodePropertyTreeElement}
  * @param {!AccessibilityAgent.AXProperty} property
- * @param {!WebInspector.Target} target
+ * @param {!WebInspector.AccessibilityNode} axNode
  */
-WebInspector.AXNodePropertyTreePropertyElement = function(property, target)
+WebInspector.AXNodePropertyTreePropertyElement = function(property, axNode)
 {
     this._property = property;
     this.toggleOnClick = true;
     this.selectable = false;
 
-    WebInspector.AXNodePropertyTreeElement.call(this, target);
+    WebInspector.AXNodePropertyTreeElement.call(this, axNode);
     this.listItemElement.classList.add("property");
 }
 
@@ -335,12 +332,12 @@ WebInspector.AXNodePropertyTreePropertyElement.prototype = {
  * @constructor
  * @extends {WebInspector.AXNodePropertyTreeElement}
  * @param {!AccessibilityAgent.AXValueSource} source
- * @param {!WebInspector.Target} target
+ * @param {!WebInspector.AccessibilityNode} axNode
  */
-WebInspector.AXValueSourceTreeElement = function(source, target)
+WebInspector.AXValueSourceTreeElement = function(source, axNode)
 {
     this._source = source;
-    WebInspector.AXNodePropertyTreeElement.call(this, target);
+    WebInspector.AXNodePropertyTreeElement.call(this, axNode);
     this.selectable = false;
 }
 
@@ -360,7 +357,7 @@ WebInspector.AXValueSourceTreeElement.prototype = {
      */
     appendRelatedNodeWithIdref: function(relatedNode, index, idref)
     {
-        var deferredNode = new WebInspector.DeferredDOMNode(this._target, relatedNode.backendNodeId);
+        var deferredNode = new WebInspector.DeferredDOMNode(this._axNode.target(), relatedNode.backendNodeId);
         var nodeTreeElement = new WebInspector.AXRelatedNodeSourceTreeElement({ deferredNode: deferredNode, idref: idref }, relatedNode);
         this.appendChild(nodeTreeElement);
     },
@@ -593,15 +590,14 @@ WebInspector.AXRelatedNodeElement.prototype = {
  * @constructor
  * @extends {WebInspector.AXNodePropertyTreeElement}
  * @param {!AccessibilityAgent.AXProperty} property
- * @param {?AccessibilityAgent.AXNode} axNode
- * @param {!WebInspector.Target} target
+ * @param {!WebInspector.AccessibilityNode} axNode
  */
-WebInspector.AXNodeIgnoredReasonTreeElement = function(property, axNode, target)
+WebInspector.AXNodeIgnoredReasonTreeElement = function(property, axNode)
 {
     this._property = property;
     this._axNode = axNode;
 
-    WebInspector.AXNodePropertyTreeElement.call(this, target);
+    WebInspector.AXNodePropertyTreeElement.call(this, axNode);
     this.toggleOnClick = true;
     this.selectable = false;
 }
@@ -627,7 +623,7 @@ WebInspector.AXNodeIgnoredReasonTreeElement.prototype = {
 
 /**
  * @param {?string} reason
- * @param {?AccessibilityAgent.AXNode} axNode
+ * @param {?WebInspector.AccessibilityNode} axNode
  * @return {?Element}
  */
 WebInspector.AXNodeIgnoredReasonTreeElement.createReasonElement = function(reason, axNode)
@@ -678,7 +674,7 @@ WebInspector.AXNodeIgnoredReasonTreeElement.createReasonElement = function(reaso
         reasonElement = WebInspector.formatLocalized("Element is not visible.", []);
         break;
     case "presentationalRole":
-        var rolePresentationSpan = createElement("span", "source-code").textContent = "role=" + axNode.role.value;
+        var rolePresentationSpan = createElement("span", "source-code").textContent = "role=" + axNode.role().value;
         reasonElement = WebInspector.formatLocalized("Element has %s.", [ rolePresentationSpan ]);
         break;
     case "probablyPresentational":

third_party/WebKit/Source/devtools/front_end/accessibility/AccessibilitySidebarView.js

@@ -10,6 +10,7 @@ WebInspector.AccessibilitySidebarView = function()
 {
     WebInspector.ThrottledWidget.call(this);
     this._node = null;
+    this._axNode = null;
     this._sidebarPaneStack = WebInspector.viewManager.createStackLocation();
     this._treeSubPane = new WebInspector.AXTreePane();
     this._sidebarPaneStack.showView(this._treeSubPane);
@@ -32,7 +33,7 @@ WebInspector.AccessibilitySidebarView.prototype = {
     },
 
     /**
-     * @param {?Array<!AccessibilityAgent.AXNode>} nodes
+     * @param {?Array<!WebInspector.AccessibilityNode>} nodes
      */
     accessibilityNodeCallback: function(nodes)
     {
@@ -62,7 +63,7 @@ WebInspector.AccessibilitySidebarView.prototype = {
         this._treeSubPane.setNode(node);
         this._axNodeSubPane.setNode(node);
         this._ariaSubPane.setNode(node);
-        return WebInspector.AccessibilityModel.fromTarget(node.target()).getAXNodeChain(node.id)
+        return WebInspector.AccessibilityModel.fromTarget(node.target()).getAXNodeChain(node)
             .then((nodes) => { this.accessibilityNodeCallback(nodes); });
     },
 
@@ -97,8 +98,6 @@ WebInspector.AccessibilitySidebarView.prototype = {
     _pullNode: function()
     {
         this._node = WebInspector.context.flavor(WebInspector.DOMNode);
-        this._ariaSubPane.setNode(this._node);
-        this._axNodeSubPane.setNode(this._node);
         this.update();
     },
 
@@ -147,7 +146,7 @@ WebInspector.AccessibilitySubPane = function(name)
 
 WebInspector.AccessibilitySubPane.prototype = {
     /**
-     * @param {?AccessibilityAgent.AXNode} axNode
+     * @param {?WebInspector.AccessibilityNode} axNode
      * @protected
      */
     setAXNode: function(axNode)

third_party/WebKit/Source/devtools/front_end/accessibility/AccessibilityStrings.js

@@ -220,6 +220,10 @@ WebInspector.AccessibilityStrings.AXNativeSourceTypes = {
         name: "From caption",
         description: "Value from table caption."
     },
+    "title": {
+        "name": "From title",
+        "description": "Value from title attribute."
+    },
     "other": {
         name: "From native HTML",
         description: "Value from native HTML (unknown source)."