OLD | NEW |
1 // Copyright 2016 The Chromium Authors. All rights reserved. | 1 // Copyright 2016 The Chromium Authors. All rights reserved. |
2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | |
5 /** | 4 /** |
6 * @constructor | 5 * @unrestricted |
7 * @extends {WebInspector.AccessibilitySubPane} | |
8 */ | 6 */ |
9 WebInspector.AXTreePane = function() | 7 WebInspector.AXTreePane = class extends WebInspector.AccessibilitySubPane { |
10 { | 8 constructor() { |
11 WebInspector.AccessibilitySubPane.call(this, WebInspector.UIString("Accessib
ility Tree")); | 9 super(WebInspector.UIString('Accessibility Tree')); |
12 | 10 |
13 this._treeOutline = this.createTreeOutline(); | 11 this._treeOutline = this.createTreeOutline(); |
14 | 12 |
15 this.element.classList.add("accessibility-computed"); | 13 this.element.classList.add('accessibility-computed'); |
16 }; | 14 } |
17 | 15 |
| 16 /** |
| 17 * @param {!Array<!WebInspector.AccessibilityNode>} nodes |
| 18 */ |
| 19 setAXNodeAndAncestors(nodes) { |
| 20 this._nodes = nodes; |
18 | 21 |
19 WebInspector.AXTreePane.prototype = { | 22 var target = this.node().target(); |
20 /** | 23 var treeOutline = this._treeOutline; |
21 * @param {!Array<!WebInspector.AccessibilityNode>} nodes | 24 treeOutline.removeChildren(); |
22 */ | 25 treeOutline.element.classList.remove('hidden'); |
23 setAXNodeAndAncestors: function(nodes) | 26 var previous = treeOutline.rootElement(); |
24 { | 27 while (nodes.length) { |
25 this._nodes = nodes; | 28 var ancestor = nodes.pop(); |
26 | 29 var ancestorTreeElement = new WebInspector.AXNodeTreeElement(ancestor, tar
get); |
27 var target = this.node().target(); | 30 previous.appendChild(ancestorTreeElement); |
28 var treeOutline = this._treeOutline; | 31 previous.expand(); |
29 treeOutline.removeChildren(); | 32 previous = ancestorTreeElement; |
30 treeOutline.element.classList.remove("hidden"); | 33 } |
31 var previous = treeOutline.rootElement(); | 34 previous.selectable = true; |
32 while (nodes.length) { | 35 previous.select(true /* omitFocus */); |
33 var ancestor = nodes.pop(); | 36 } |
34 var ancestorTreeElement = new WebInspector.AXNodeTreeElement(ancesto
r, target); | |
35 previous.appendChild(ancestorTreeElement); | |
36 previous.expand(); | |
37 previous = ancestorTreeElement; | |
38 } | |
39 previous.selectable = true; | |
40 previous.select(true /* omitFocus */); | |
41 }, | |
42 | |
43 __proto__: WebInspector.AccessibilitySubPane.prototype | |
44 }; | 37 }; |
45 | 38 |
46 /** | 39 /** |
47 * @constructor | 40 * @unrestricted |
48 * @extends {TreeElement} | |
49 * @param {!WebInspector.AccessibilityNode} axNode | |
50 * @param {!WebInspector.Target} target | |
51 */ | 41 */ |
52 WebInspector.AXNodeTreeElement = function(axNode, target) | 42 WebInspector.AXNodeTreeElement = class extends TreeElement { |
53 { | 43 /** |
| 44 * @param {!WebInspector.AccessibilityNode} axNode |
| 45 * @param {!WebInspector.Target} target |
| 46 */ |
| 47 constructor(axNode, target) { |
54 // Pass an empty title, the title gets made later in onattach. | 48 // Pass an empty title, the title gets made later in onattach. |
55 TreeElement.call(this, ""); | 49 super(''); |
56 | 50 |
57 /** @type {!WebInspector.AccessibilityNode} */ | 51 /** @type {!WebInspector.AccessibilityNode} */ |
58 this._axNode = axNode; | 52 this._axNode = axNode; |
59 | 53 |
60 /** @type {!WebInspector.Target} */ | 54 /** @type {!WebInspector.Target} */ |
61 this._target = target; | 55 this._target = target; |
62 | 56 |
63 this.selectable = false; | 57 this.selectable = false; |
| 58 } |
| 59 |
| 60 /** |
| 61 * @override |
| 62 */ |
| 63 onattach() { |
| 64 this._update(); |
| 65 } |
| 66 |
| 67 _update() { |
| 68 this.listItemElement.removeChildren(); |
| 69 |
| 70 if (this._axNode.ignored()) { |
| 71 this._appendIgnoredNodeElement(); |
| 72 } else { |
| 73 this._appendRoleElement(this._axNode.role()); |
| 74 if ('name' in this._axNode && this._axNode.name().value) { |
| 75 this.listItemElement.createChild('span', 'separator').textContent = '\u0
0A0'; |
| 76 this._appendNameElement(/** @type {string} */ (this._axNode.name().value
)); |
| 77 } |
| 78 } |
| 79 } |
| 80 |
| 81 /** |
| 82 * @param {string} name |
| 83 */ |
| 84 _appendNameElement(name) { |
| 85 var nameElement = createElement('span'); |
| 86 nameElement.textContent = '"' + name + '"'; |
| 87 nameElement.classList.add('ax-readable-string'); |
| 88 this.listItemElement.appendChild(nameElement); |
| 89 } |
| 90 |
| 91 /** |
| 92 * @param {?AccessibilityAgent.AXValue} role |
| 93 */ |
| 94 _appendRoleElement(role) { |
| 95 if (!role) |
| 96 return; |
| 97 |
| 98 var roleElement = createElementWithClass('span', 'monospace'); |
| 99 roleElement.classList.add(WebInspector.AXNodeTreeElement.RoleStyles[role.typ
e]); |
| 100 roleElement.setTextContentTruncatedIfNeeded(role.value || ''); |
| 101 |
| 102 this.listItemElement.appendChild(roleElement); |
| 103 } |
| 104 |
| 105 _appendIgnoredNodeElement() { |
| 106 var ignoredNodeElement = createElementWithClass('span', 'monospace'); |
| 107 ignoredNodeElement.textContent = WebInspector.UIString('Ignored'); |
| 108 ignoredNodeElement.classList.add('ax-tree-ignored-node'); |
| 109 this.listItemElement.appendChild(ignoredNodeElement); |
| 110 } |
64 }; | 111 }; |
65 | 112 |
66 /** @type {!Object<string, string>} */ | 113 /** @type {!Object<string, string>} */ |
67 WebInspector.AXNodeTreeElement.RoleStyles = { | 114 WebInspector.AXNodeTreeElement.RoleStyles = { |
68 internalRole: "ax-internal-role", | 115 internalRole: 'ax-internal-role', |
69 role: "ax-role", | 116 role: 'ax-role', |
70 }; | 117 }; |
71 | |
72 WebInspector.AXNodeTreeElement.prototype = { | |
73 /** | |
74 * @override | |
75 */ | |
76 onattach: function() | |
77 { | |
78 this._update(); | |
79 }, | |
80 | |
81 _update: function() | |
82 { | |
83 this.listItemElement.removeChildren(); | |
84 | |
85 if (this._axNode.ignored()) { | |
86 this._appendIgnoredNodeElement(); | |
87 } else { | |
88 this._appendRoleElement(this._axNode.role()); | |
89 if ("name" in this._axNode && this._axNode.name().value) { | |
90 this.listItemElement.createChild("span", "separator").textConten
t = "\u00A0"; | |
91 this._appendNameElement(/** @type {string} */ (this._axNode.name
().value)); | |
92 } | |
93 } | |
94 }, | |
95 | |
96 /** | |
97 * @param {string} name | |
98 */ | |
99 _appendNameElement: function(name) | |
100 { | |
101 var nameElement = createElement("span"); | |
102 nameElement.textContent = '"' + name + '"'; | |
103 nameElement.classList.add("ax-readable-string"); | |
104 this.listItemElement.appendChild(nameElement); | |
105 }, | |
106 | |
107 /** | |
108 * @param {?AccessibilityAgent.AXValue} role | |
109 */ | |
110 _appendRoleElement: function(role) | |
111 { | |
112 if (!role) | |
113 return; | |
114 | |
115 var roleElement = createElementWithClass("span", "monospace"); | |
116 roleElement.classList.add(WebInspector.AXNodeTreeElement.RoleStyles[role
.type]); | |
117 roleElement.setTextContentTruncatedIfNeeded(role.value || ""); | |
118 | |
119 this.listItemElement.appendChild(roleElement); | |
120 }, | |
121 | |
122 _appendIgnoredNodeElement: function() | |
123 { | |
124 var ignoredNodeElement = createElementWithClass("span", "monospace"); | |
125 ignoredNodeElement.textContent = WebInspector.UIString("Ignored"); | |
126 ignoredNodeElement.classList.add("ax-tree-ignored-node"); | |
127 this.listItemElement.appendChild(ignoredNodeElement); | |
128 }, | |
129 | |
130 __proto__: TreeElement.prototype | |
131 }; | |
OLD | NEW |