Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 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 |
| 3 | // found in the LICENSE file. |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 4 | |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 5 | import * as Common from '../common/common.js'; |
| 6 | import * as SDK from '../sdk/sdk.js'; |
| 7 | import * as UI from '../ui/ui.js'; |
| 8 | |
Peter Marshall | 14e5fbd | 2020-09-01 11:04:12 | [diff] [blame] | 9 | import {AccessibilityNode, CoreAxPropertyName, CoreOrProtocolAxProperty} from './AccessibilityModel.js'; // eslint-disable-line no-unused-vars |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 10 | import {AXAttributes, AXNativeSourceTypes, AXSourceTypes} from './AccessibilityStrings.js'; |
| 11 | import {AccessibilitySubPane} from './AccessibilitySubPane.js'; |
| 12 | |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 13 | /** |
| 14 | * @unrestricted |
| 15 | */ |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 16 | export class AXNodeSubPane extends AccessibilitySubPane { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 17 | constructor() { |
| 18 | super(ls`Computed Properties`); |
| 19 | |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 20 | /** |
| 21 | * @protected |
| 22 | * @suppress {accessControls} |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 23 | * @type {?AccessibilityNode} |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 24 | */ |
| 25 | this._axNode = null; |
| 26 | |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 27 | this.contentElement.classList.add('ax-subpane'); |
| 28 | |
| 29 | this._noNodeInfo = this.createInfo(ls`No accessibility node`); |
| 30 | this._ignoredInfo = this.createInfo(ls`Accessibility node not exposed`, 'ax-ignored-info hidden'); |
| 31 | |
| 32 | this._treeOutline = this.createTreeOutline(); |
| 33 | this._ignoredReasonsTree = this.createTreeOutline(); |
| 34 | |
| 35 | this.element.classList.add('accessibility-computed'); |
Jack Franklin | 71519f8 | 2020-11-03 12:08:59 | [diff] [blame^] | 36 | this.registerRequiredCSS('accessibility/accessibilityNode.css', {enableLegacyPatching: true}); |
Rob Paveza | 84d4144 | 2019-10-10 23:01:09 | [diff] [blame] | 37 | this._treeOutline.setFocusable(true); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 38 | } |
| 39 | |
| 40 | /** |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 41 | * @param {?AccessibilityNode} axNode |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 42 | * @override |
| 43 | */ |
| 44 | setAXNode(axNode) { |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 45 | if (this._axNode === axNode) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 46 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 47 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 48 | this._axNode = axNode; |
| 49 | |
| 50 | const treeOutline = this._treeOutline; |
| 51 | treeOutline.removeChildren(); |
| 52 | const ignoredReasons = this._ignoredReasonsTree; |
| 53 | ignoredReasons.removeChildren(); |
| 54 | |
| 55 | if (!axNode) { |
| 56 | treeOutline.element.classList.add('hidden'); |
| 57 | this._ignoredInfo.classList.add('hidden'); |
| 58 | ignoredReasons.element.classList.add('hidden'); |
| 59 | |
| 60 | this._noNodeInfo.classList.remove('hidden'); |
| 61 | this.element.classList.add('ax-ignored-node-pane'); |
| 62 | |
| 63 | return; |
| 64 | } |
| 65 | |
| 66 | if (axNode.ignored()) { |
| 67 | this._noNodeInfo.classList.add('hidden'); |
| 68 | treeOutline.element.classList.add('hidden'); |
| 69 | this.element.classList.add('ax-ignored-node-pane'); |
| 70 | |
| 71 | this._ignoredInfo.classList.remove('hidden'); |
| 72 | ignoredReasons.element.classList.remove('hidden'); |
| 73 | /** |
| 74 | * @param {!Protocol.Accessibility.AXProperty} property |
| 75 | */ |
| 76 | function addIgnoredReason(property) { |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 77 | ignoredReasons.appendChild( |
| 78 | new AXNodeIgnoredReasonTreeElement(property, /** @type {!AccessibilityNode} */ (axNode))); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 79 | } |
| 80 | const ignoredReasonsArray = /** @type {!Array<!Protocol.Accessibility.AXProperty>} */ (axNode.ignoredReasons()); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 81 | for (const reason of ignoredReasonsArray) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 82 | addIgnoredReason(reason); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 83 | } |
| 84 | if (!ignoredReasons.firstChild()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 85 | ignoredReasons.element.classList.add('hidden'); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 86 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 87 | return; |
| 88 | } |
| 89 | this.element.classList.remove('ax-ignored-node-pane'); |
| 90 | |
| 91 | this._ignoredInfo.classList.add('hidden'); |
| 92 | ignoredReasons.element.classList.add('hidden'); |
| 93 | this._noNodeInfo.classList.add('hidden'); |
| 94 | |
| 95 | treeOutline.element.classList.remove('hidden'); |
| 96 | |
| 97 | /** |
Peter Marshall | 14e5fbd | 2020-09-01 11:04:12 | [diff] [blame] | 98 | * @param {!CoreOrProtocolAxProperty} property |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 99 | */ |
| 100 | function addProperty(property) { |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 101 | treeOutline.appendChild( |
| 102 | new AXNodePropertyTreePropertyElement(property, /** @type {!AccessibilityNode} */ (axNode))); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 103 | } |
| 104 | |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 105 | for (const property of axNode.coreProperties()) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 106 | addProperty(property); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 107 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 108 | |
Peter Marshall | 14e5fbd | 2020-09-01 11:04:12 | [diff] [blame] | 109 | const role = axNode.role(); |
| 110 | if (role) { |
| 111 | /** @type {!CoreOrProtocolAxProperty} */ |
| 112 | const roleProperty = {name: CoreAxPropertyName.Role, value: role}; |
| 113 | addProperty(roleProperty); |
| 114 | } |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 115 | for (const property of /** @type {!Array.<!Protocol.Accessibility.AXProperty>} */ (axNode.properties())) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 116 | addProperty(property); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 117 | } |
Rob Paveza | 84d4144 | 2019-10-10 23:01:09 | [diff] [blame] | 118 | |
| 119 | const firstNode = treeOutline.firstChild(); |
| 120 | if (firstNode) { |
| 121 | firstNode.select(/* omitFocus= */ true, /* selectedByUser= */ false); |
| 122 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 123 | } |
| 124 | |
| 125 | /** |
| 126 | * @override |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 127 | * @param {?SDK.DOMModel.DOMNode} node |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 128 | */ |
| 129 | setNode(node) { |
| 130 | super.setNode(node); |
| 131 | this._axNode = null; |
| 132 | } |
Paul Lewis | f16142c | 2019-11-07 15:56:04 | [diff] [blame] | 133 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 134 | |
| 135 | /** |
| 136 | * @unrestricted |
| 137 | */ |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 138 | export class AXNodePropertyTreeElement extends UI.TreeOutline.TreeElement { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 139 | /** |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 140 | * @param {!AccessibilityNode} axNode |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 141 | */ |
| 142 | constructor(axNode) { |
| 143 | // Pass an empty title, the title gets made later in onattach. |
| 144 | super(''); |
| 145 | this._axNode = axNode; |
| 146 | } |
| 147 | |
| 148 | /** |
| 149 | * @param {?Protocol.Accessibility.AXValueType} type |
| 150 | * @param {string} value |
| 151 | * @return {!Element} |
| 152 | */ |
| 153 | static createSimpleValueElement(type, value) { |
| 154 | let valueElement; |
| 155 | const AXValueType = Protocol.Accessibility.AXValueType; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 156 | if (!type || type === AXValueType.ValueUndefined || type === AXValueType.ComputedString) { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 157 | valueElement = document.createElement('span'); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 158 | } else { |
Tim van der Lippe | f49e232 | 2020-05-01 15:03:09 | [diff] [blame] | 159 | valueElement = document.createElement('span'); |
| 160 | valueElement.classList.add('monospace'); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 161 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 162 | let valueText; |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 163 | const isStringProperty = type && StringProperties.has(type); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 164 | if (isStringProperty) { |
| 165 | // Render \n as a nice unicode cr symbol. |
| 166 | valueText = '"' + value.replace(/\n/g, '\u21B5') + '"'; |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 167 | } else { |
| 168 | valueText = String(value); |
| 169 | } |
| 170 | |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 171 | if (type && type in TypeStyles) { |
| 172 | valueElement.classList.add(TypeStyles[type]); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 173 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 174 | |
| 175 | valueElement.setTextContentTruncatedIfNeeded(valueText || ''); |
| 176 | |
| 177 | valueElement.title = String(value) || ''; |
| 178 | |
| 179 | return valueElement; |
| 180 | } |
| 181 | |
| 182 | /** |
| 183 | * @param {string} tooltip |
| 184 | * @return {!Element} |
| 185 | */ |
| 186 | static createExclamationMark(tooltip) { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 187 | const exclamationElement = |
| 188 | /** @type {!UI.UIUtils.DevToolsIconLabel} */ (document.createElement('span', {is: 'dt-icon-label'})); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 189 | exclamationElement.type = 'smallicon-warning'; |
| 190 | exclamationElement.title = tooltip; |
| 191 | return exclamationElement; |
| 192 | } |
| 193 | |
| 194 | /** |
| 195 | * @param {string} name |
| 196 | */ |
| 197 | appendNameElement(name) { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 198 | const nameElement = document.createElement('span'); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 199 | if (name in AXAttributes) { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 200 | // @ts-ignore TS can't cast name here but we checked it's valid. |
| 201 | const attribute = AXAttributes[name]; |
| 202 | nameElement.textContent = attribute.name; |
| 203 | nameElement.title = attribute.description; |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 204 | nameElement.classList.add('ax-readable-name'); |
| 205 | } else { |
| 206 | nameElement.textContent = name; |
| 207 | nameElement.classList.add('ax-name'); |
| 208 | nameElement.classList.add('monospace'); |
| 209 | } |
| 210 | this.listItemElement.appendChild(nameElement); |
| 211 | } |
| 212 | |
| 213 | /** |
| 214 | * @param {!Protocol.Accessibility.AXValue} value |
| 215 | */ |
| 216 | appendValueElement(value) { |
| 217 | const AXValueType = Protocol.Accessibility.AXValueType; |
| 218 | if (value.type === AXValueType.Idref || value.type === AXValueType.Node || value.type === AXValueType.IdrefList || |
| 219 | value.type === AXValueType.NodeList) { |
| 220 | this.appendRelatedNodeListValueElement(value); |
| 221 | return; |
Mathias Bynens | f06e8c0 | 2020-02-28 13:58:28 | [diff] [blame] | 222 | } |
| 223 | if (value.sources) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 224 | const sources = value.sources; |
| 225 | for (let i = 0; i < sources.length; i++) { |
| 226 | const source = sources[i]; |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 227 | const child = new AXValueSourceTreeElement(source, this._axNode); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 228 | this.appendChild(child); |
| 229 | } |
| 230 | this.expand(); |
| 231 | } |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 232 | const element = AXNodePropertyTreeElement.createSimpleValueElement(value.type, String(value.value)); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 233 | this.listItemElement.appendChild(element); |
| 234 | } |
| 235 | |
| 236 | /** |
| 237 | * @param {!Protocol.Accessibility.AXRelatedNode} relatedNode |
| 238 | * @param {number} index |
| 239 | */ |
| 240 | appendRelatedNode(relatedNode, index) { |
| 241 | const deferredNode = |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 242 | new SDK.DOMModel.DeferredDOMNode(this._axNode.accessibilityModel().target(), relatedNode.backendDOMNodeId); |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 243 | const nodeTreeElement = |
| 244 | new AXRelatedNodeSourceTreeElement({deferredNode: deferredNode, idref: undefined}, relatedNode); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 245 | this.appendChild(nodeTreeElement); |
| 246 | } |
| 247 | |
| 248 | /** |
| 249 | * @param {!Protocol.Accessibility.AXRelatedNode} relatedNode |
| 250 | */ |
| 251 | appendRelatedNodeInline(relatedNode) { |
| 252 | const deferredNode = |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 253 | new SDK.DOMModel.DeferredDOMNode(this._axNode.accessibilityModel().target(), relatedNode.backendDOMNodeId); |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 254 | const linkedNode = new AXRelatedNodeElement({deferredNode: deferredNode, idref: undefined}, relatedNode); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 255 | this.listItemElement.appendChild(linkedNode.render()); |
| 256 | } |
| 257 | |
| 258 | /** |
| 259 | * @param {!Protocol.Accessibility.AXValue} value |
| 260 | */ |
| 261 | appendRelatedNodeListValueElement(value) { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 262 | if (value.relatedNodes && value.relatedNodes.length === 1 && !value.value) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 263 | this.appendRelatedNodeInline(value.relatedNodes[0]); |
| 264 | return; |
| 265 | } |
| 266 | |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 267 | if (value.relatedNodes) { |
| 268 | value.relatedNodes.forEach(this.appendRelatedNode, this); |
| 269 | } |
| 270 | if (value.relatedNodes && value.relatedNodes.length <= 3) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 271 | this.expand(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 272 | } else { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 273 | this.collapse(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 274 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 275 | } |
Paul Lewis | f16142c | 2019-11-07 15:56:04 | [diff] [blame] | 276 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 277 | |
| 278 | /** @type {!Object<string, string>} */ |
Paul Lewis | f16142c | 2019-11-07 15:56:04 | [diff] [blame] | 279 | export const TypeStyles = { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 280 | attribute: 'ax-value-string', |
| 281 | boolean: 'object-value-boolean', |
| 282 | booleanOrUndefined: 'object-value-boolean', |
| 283 | computedString: 'ax-readable-string', |
| 284 | idref: 'ax-value-string', |
| 285 | idrefList: 'ax-value-string', |
| 286 | integer: 'object-value-number', |
| 287 | internalRole: 'ax-internal-role', |
| 288 | number: 'ax-value-number', |
| 289 | role: 'ax-role', |
| 290 | string: 'ax-value-string', |
| 291 | tristate: 'object-value-boolean', |
| 292 | valueUndefined: 'ax-value-undefined' |
| 293 | }; |
| 294 | |
| 295 | /** @type {!Set.<!Protocol.Accessibility.AXValueType>} */ |
Paul Lewis | f16142c | 2019-11-07 15:56:04 | [diff] [blame] | 296 | export const StringProperties = new Set([ |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 297 | Protocol.Accessibility.AXValueType.String, Protocol.Accessibility.AXValueType.ComputedString, |
| 298 | Protocol.Accessibility.AXValueType.IdrefList, Protocol.Accessibility.AXValueType.Idref |
| 299 | ]); |
| 300 | |
| 301 | /** |
| 302 | * @unrestricted |
| 303 | */ |
Paul Lewis | f16142c | 2019-11-07 15:56:04 | [diff] [blame] | 304 | export class AXNodePropertyTreePropertyElement extends AXNodePropertyTreeElement { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 305 | /** |
Peter Marshall | 14e5fbd | 2020-09-01 11:04:12 | [diff] [blame] | 306 | * @param {!CoreOrProtocolAxProperty} property |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 307 | * @param {!AccessibilityNode} axNode |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 308 | */ |
| 309 | constructor(property, axNode) { |
| 310 | super(axNode); |
| 311 | |
| 312 | this._property = property; |
| 313 | this.toggleOnClick = true; |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 314 | |
| 315 | this.listItemElement.classList.add('property'); |
| 316 | } |
| 317 | |
| 318 | /** |
| 319 | * @override |
| 320 | */ |
| 321 | onattach() { |
| 322 | this._update(); |
| 323 | } |
| 324 | |
| 325 | _update() { |
| 326 | this.listItemElement.removeChildren(); |
| 327 | |
| 328 | this.appendNameElement(this._property.name); |
| 329 | |
Mathias Bynens | 7d8cd34 | 2019-09-17 13:32:10 | [diff] [blame] | 330 | this.listItemElement.createChild('span', 'separator').textContent = ':\xA0'; |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 331 | |
| 332 | this.appendValueElement(this._property.value); |
| 333 | } |
Paul Lewis | f16142c | 2019-11-07 15:56:04 | [diff] [blame] | 334 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 335 | |
| 336 | /** |
| 337 | * @unrestricted |
| 338 | */ |
Paul Lewis | f16142c | 2019-11-07 15:56:04 | [diff] [blame] | 339 | export class AXValueSourceTreeElement extends AXNodePropertyTreeElement { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 340 | /** |
| 341 | * @param {!Protocol.Accessibility.AXValueSource} source |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 342 | * @param {!AccessibilityNode} axNode |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 343 | */ |
| 344 | constructor(source, axNode) { |
| 345 | super(axNode); |
| 346 | this._source = source; |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 347 | } |
| 348 | |
| 349 | /** |
| 350 | * @override |
| 351 | */ |
| 352 | onattach() { |
| 353 | this._update(); |
| 354 | } |
| 355 | |
| 356 | /** |
| 357 | * @param {!Protocol.Accessibility.AXRelatedNode} relatedNode |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 358 | * @param {string} idref |
| 359 | */ |
Meredith Lane | 4be4e9a | 2020-02-05 06:07:02 | [diff] [blame] | 360 | appendRelatedNodeWithIdref(relatedNode, idref) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 361 | const deferredNode = |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 362 | new SDK.DOMModel.DeferredDOMNode(this._axNode.accessibilityModel().target(), relatedNode.backendDOMNodeId); |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 363 | const nodeTreeElement = new AXRelatedNodeSourceTreeElement({deferredNode: deferredNode, idref: idref}, relatedNode); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 364 | this.appendChild(nodeTreeElement); |
| 365 | } |
| 366 | |
| 367 | /** |
| 368 | * @param {!Protocol.Accessibility.AXValue} value |
| 369 | */ |
| 370 | appendIDRefValueElement(value) { |
Meredith Lane | 4be4e9a | 2020-02-05 06:07:02 | [diff] [blame] | 371 | if (value.value === null) { |
| 372 | return; |
| 373 | } |
| 374 | |
| 375 | const relatedNodes = value.relatedNodes || []; |
| 376 | |
| 377 | // Content attribute is empty, but if the relationship was set via the IDL |
| 378 | // then there may be related nodes. |
| 379 | if (value.value === '') { |
| 380 | for (const node of relatedNodes) { |
| 381 | const idref = node.idref || ''; |
| 382 | this.appendRelatedNodeWithIdref(node, idref); |
| 383 | } |
| 384 | return; |
| 385 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 386 | |
| 387 | const idrefs = value.value.trim().split(/\s+/); |
Meredith Lane | 4be4e9a | 2020-02-05 06:07:02 | [diff] [blame] | 388 | for (const idref of idrefs) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 389 | const matchingNode = relatedNodes.find(node => node.idref === idref); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 390 | |
Meredith Lane | 4be4e9a | 2020-02-05 06:07:02 | [diff] [blame] | 391 | // If there is exactly one related node, it is rendered on the same line |
| 392 | // of the label. If there are more, they are each rendered on their own |
| 393 | // line below the label. |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 394 | // TODO(aboxhall): exclamation mark if not idreflist type |
Meredith Lane | 4be4e9a | 2020-02-05 06:07:02 | [diff] [blame] | 395 | if (matchingNode) { |
| 396 | this.appendRelatedNodeWithIdref(matchingNode, idref); |
| 397 | } else if (idrefs.length === 1) { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 398 | this.listItemElement.appendChild(new AXRelatedNodeElement({deferredNode: undefined, idref: idref}).render()); |
Meredith Lane | 4be4e9a | 2020-02-05 06:07:02 | [diff] [blame] | 399 | } else { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 400 | this.appendChild(new AXRelatedNodeSourceTreeElement({deferredNode: undefined, idref: idref})); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 401 | } |
| 402 | } |
| 403 | } |
| 404 | |
| 405 | /** |
| 406 | * @param {!Protocol.Accessibility.AXValue} value |
| 407 | * @override |
| 408 | */ |
| 409 | appendRelatedNodeListValueElement(value) { |
| 410 | const relatedNodes = value.relatedNodes; |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 411 | const numNodes = relatedNodes ? relatedNodes.length : 0; |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 412 | |
| 413 | if (value.type === Protocol.Accessibility.AXValueType.IdrefList || |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 414 | value.type === Protocol.Accessibility.AXValueType.Idref) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 415 | this.appendIDRefValueElement(value); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 416 | } else { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 417 | super.appendRelatedNodeListValueElement(value); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 418 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 419 | |
| 420 | |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 421 | if (numNodes <= 3) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 422 | this.expand(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 423 | } else { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 424 | this.collapse(); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 425 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 426 | } |
| 427 | |
| 428 | /** |
| 429 | * @param {!Protocol.Accessibility.AXValueSource} source |
| 430 | */ |
| 431 | appendSourceNameElement(source) { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 432 | const nameElement = document.createElement('span'); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 433 | const AXValueSourceType = Protocol.Accessibility.AXValueSourceType; |
| 434 | const type = source.type; |
| 435 | switch (type) { |
| 436 | case AXValueSourceType.Attribute: |
| 437 | case AXValueSourceType.Placeholder: |
| 438 | case AXValueSourceType.RelatedElement: |
| 439 | if (source.nativeSource) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 440 | const nativeSource = source.nativeSource; |
Mandy Chen | ba6de38 | 2019-06-07 21:38:50 | [diff] [blame] | 441 | nameElement.textContent = AXNativeSourceTypes[nativeSource].name; |
| 442 | nameElement.title = AXNativeSourceTypes[nativeSource].description; |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 443 | nameElement.classList.add('ax-readable-name'); |
| 444 | break; |
| 445 | } |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 446 | nameElement.textContent = source.attribute || null; |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 447 | nameElement.classList.add('ax-name'); |
| 448 | nameElement.classList.add('monospace'); |
| 449 | break; |
| 450 | default: |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 451 | if (type in AXSourceTypes) { |
Mandy Chen | ba6de38 | 2019-06-07 21:38:50 | [diff] [blame] | 452 | nameElement.textContent = AXSourceTypes[type].name; |
| 453 | nameElement.title = AXSourceTypes[type].description; |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 454 | nameElement.classList.add('ax-readable-name'); |
| 455 | } else { |
| 456 | console.warn(type, 'not in AXSourceTypes'); |
Mandy Chen | ba6de38 | 2019-06-07 21:38:50 | [diff] [blame] | 457 | nameElement.textContent = type; |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 458 | } |
| 459 | } |
| 460 | this.listItemElement.appendChild(nameElement); |
| 461 | } |
| 462 | |
| 463 | _update() { |
| 464 | this.listItemElement.removeChildren(); |
| 465 | |
| 466 | if (this._source.invalid) { |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 467 | const exclamationMark = AXNodePropertyTreeElement.createExclamationMark(ls`Invalid source.`); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 468 | this.listItemElement.appendChild(exclamationMark); |
| 469 | this.listItemElement.classList.add('ax-value-source-invalid'); |
| 470 | } else if (this._source.superseded) { |
| 471 | this.listItemElement.classList.add('ax-value-source-unused'); |
| 472 | } |
| 473 | |
| 474 | this.appendSourceNameElement(this._source); |
| 475 | |
Mathias Bynens | 7d8cd34 | 2019-09-17 13:32:10 | [diff] [blame] | 476 | this.listItemElement.createChild('span', 'separator').textContent = ':\xA0'; |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 477 | |
| 478 | if (this._source.attributeValue) { |
| 479 | this.appendValueElement(this._source.attributeValue); |
Sigurd Schneider | 23c5297 | 2020-10-13 09:31:14 | [diff] [blame] | 480 | UI.UIUtils.createTextChild(this.listItemElement, '\xA0'); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 481 | } else if (this._source.nativeSourceValue) { |
| 482 | this.appendValueElement(this._source.nativeSourceValue); |
Sigurd Schneider | 23c5297 | 2020-10-13 09:31:14 | [diff] [blame] | 483 | UI.UIUtils.createTextChild(this.listItemElement, '\xA0'); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 484 | if (this._source.value) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 485 | this.appendValueElement(this._source.value); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 486 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 487 | } else if (this._source.value) { |
| 488 | this.appendValueElement(this._source.value); |
| 489 | } else { |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 490 | const valueElement = AXNodePropertyTreeElement.createSimpleValueElement( |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 491 | Protocol.Accessibility.AXValueType.ValueUndefined, ls`Not specified`); |
| 492 | this.listItemElement.appendChild(valueElement); |
| 493 | this.listItemElement.classList.add('ax-value-source-unused'); |
| 494 | } |
| 495 | |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 496 | if (this._source.value && this._source.superseded) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 497 | this.listItemElement.classList.add('ax-value-source-superseded'); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 498 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 499 | } |
Paul Lewis | f16142c | 2019-11-07 15:56:04 | [diff] [blame] | 500 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 501 | |
| 502 | /** |
| 503 | * @unrestricted |
| 504 | */ |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 505 | export class AXRelatedNodeSourceTreeElement extends UI.TreeOutline.TreeElement { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 506 | /** |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 507 | * @param {{deferredNode: (!SDK.DOMModel.DeferredDOMNode|undefined), idref: (string|undefined)}} node |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 508 | * @param {!Protocol.Accessibility.AXRelatedNode=} value |
| 509 | */ |
| 510 | constructor(node, value) { |
| 511 | super(''); |
| 512 | |
| 513 | this._value = value; |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 514 | this._axRelatedNodeElement = new AXRelatedNodeElement(node, value); |
Rob Paveza | 84d4144 | 2019-10-10 23:01:09 | [diff] [blame] | 515 | this.selectable = true; |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 516 | } |
| 517 | |
| 518 | /** |
| 519 | * @override |
| 520 | */ |
| 521 | onattach() { |
| 522 | this.listItemElement.appendChild(this._axRelatedNodeElement.render()); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 523 | if (!this._value) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 524 | return; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 525 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 526 | |
| 527 | if (this._value.text) { |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 528 | this.listItemElement.appendChild(AXNodePropertyTreeElement.createSimpleValueElement( |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 529 | Protocol.Accessibility.AXValueType.ComputedString, this._value.text)); |
| 530 | } |
| 531 | } |
Rob Paveza | 84d4144 | 2019-10-10 23:01:09 | [diff] [blame] | 532 | |
| 533 | /** |
| 534 | * @override |
| 535 | */ |
| 536 | onenter() { |
| 537 | this._axRelatedNodeElement.revealNode(); |
| 538 | return true; |
| 539 | } |
Paul Lewis | f16142c | 2019-11-07 15:56:04 | [diff] [blame] | 540 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 541 | |
| 542 | /** |
| 543 | * @unrestricted |
| 544 | */ |
Paul Lewis | f16142c | 2019-11-07 15:56:04 | [diff] [blame] | 545 | export class AXRelatedNodeElement { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 546 | /** |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 547 | * @param {{deferredNode: (!SDK.DOMModel.DeferredDOMNode|undefined), idref: (string|undefined)}} node |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 548 | * @param {!Protocol.Accessibility.AXRelatedNode=} value |
| 549 | */ |
| 550 | constructor(node, value) { |
| 551 | this._deferredNode = node.deferredNode; |
| 552 | this._idref = node.idref; |
| 553 | this._value = value; |
| 554 | } |
| 555 | |
| 556 | /** |
| 557 | * @return {!Element} |
| 558 | */ |
| 559 | render() { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 560 | const element = document.createElement('span'); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 561 | |
| 562 | if (this._deferredNode) { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 563 | const valueElement = document.createElement('span'); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 564 | element.appendChild(valueElement); |
Alice Boxhall | 6ac4343 | 2018-11-22 08:24:18 | [diff] [blame] | 565 | this._deferredNode.resolvePromise().then(node => { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 566 | Common.Linkifier.Linkifier.linkify(node, {tooltip: undefined, preventKeyboardFocus: true}) |
Jeff Fisher | 3f5f19c | 2019-08-28 19:10:02 | [diff] [blame] | 567 | .then(linkfied => valueElement.appendChild(linkfied)); |
Alice Boxhall | 6ac4343 | 2018-11-22 08:24:18 | [diff] [blame] | 568 | }); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 569 | } else if (this._idref) { |
| 570 | element.classList.add('invalid'); |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 571 | const valueElement = AXNodePropertyTreeElement.createExclamationMark(ls`No node with this ID.`); |
Sigurd Schneider | 23c5297 | 2020-10-13 09:31:14 | [diff] [blame] | 572 | UI.UIUtils.createTextChild(valueElement, this._idref); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 573 | element.appendChild(valueElement); |
| 574 | } |
| 575 | |
| 576 | return element; |
| 577 | } |
Rob Paveza | 84d4144 | 2019-10-10 23:01:09 | [diff] [blame] | 578 | |
| 579 | /** |
| 580 | * Attempts to cause the node referred to by the related node to be selected in the tree. |
| 581 | */ |
| 582 | revealNode() { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 583 | if (this._deferredNode) { |
| 584 | this._deferredNode.resolvePromise().then(node => Common.Revealer.reveal(node)); |
| 585 | } |
Rob Paveza | 84d4144 | 2019-10-10 23:01:09 | [diff] [blame] | 586 | } |
Paul Lewis | f16142c | 2019-11-07 15:56:04 | [diff] [blame] | 587 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 588 | |
| 589 | /** |
| 590 | * @unrestricted |
| 591 | */ |
Paul Lewis | f16142c | 2019-11-07 15:56:04 | [diff] [blame] | 592 | export class AXNodeIgnoredReasonTreeElement extends AXNodePropertyTreeElement { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 593 | /** |
| 594 | * @param {!Protocol.Accessibility.AXProperty} property |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 595 | * @param {!AccessibilityNode} axNode |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 596 | */ |
| 597 | constructor(property, axNode) { |
| 598 | super(axNode); |
| 599 | this._property = property; |
| 600 | this._axNode = axNode; |
| 601 | this.toggleOnClick = true; |
| 602 | this.selectable = false; |
| 603 | } |
| 604 | |
| 605 | /** |
| 606 | * @param {?string} reason |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 607 | * @param {?AccessibilityNode} axNode |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 608 | * @return {?Element} |
| 609 | */ |
| 610 | static createReasonElement(reason, axNode) { |
| 611 | let reasonElement = null; |
| 612 | switch (reason) { |
| 613 | case 'activeModalDialog': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 614 | reasonElement = UI.UIUtils.formatLocalized('Element is hidden by active modal dialog:\xA0', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 615 | break; |
| 616 | case 'ancestorIsLeafNode': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 617 | reasonElement = UI.UIUtils.formatLocalized('Ancestor\'s children are all presentational:\xA0', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 618 | break; |
| 619 | case 'ariaHiddenElement': { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 620 | const ariaHiddenSpan = document.createElement('span', {is: 'source-code'}).textContent = 'aria-hidden'; |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 621 | reasonElement = UI.UIUtils.formatLocalized('Element is %s.', [ariaHiddenSpan]); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 622 | break; |
| 623 | } |
| 624 | case 'ariaHiddenSubtree': { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 625 | const ariaHiddenSpan = document.createElement('span', {is: 'source-code'}).textContent = 'aria-hidden'; |
| 626 | const trueSpan = document.createElement('span', {is: 'source-code'}).textContent = 'true'; |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 627 | reasonElement = UI.UIUtils.formatLocalized('%s is %s on ancestor:\xA0', [ariaHiddenSpan, trueSpan]); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 628 | break; |
| 629 | } |
| 630 | case 'emptyAlt': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 631 | reasonElement = UI.UIUtils.formatLocalized('Element has empty alt text.', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 632 | break; |
| 633 | case 'emptyText': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 634 | reasonElement = UI.UIUtils.formatLocalized('No text content.', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 635 | break; |
| 636 | case 'inertElement': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 637 | reasonElement = UI.UIUtils.formatLocalized('Element is inert.', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 638 | break; |
| 639 | case 'inertSubtree': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 640 | reasonElement = UI.UIUtils.formatLocalized('Element is in an inert subtree from\xA0', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 641 | break; |
| 642 | case 'inheritsPresentation': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 643 | reasonElement = UI.UIUtils.formatLocalized('Element inherits presentational role from\xA0', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 644 | break; |
| 645 | case 'labelContainer': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 646 | reasonElement = UI.UIUtils.formatLocalized('Part of label element:\xA0', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 647 | break; |
| 648 | case 'labelFor': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 649 | reasonElement = UI.UIUtils.formatLocalized('Label for\xA0', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 650 | break; |
| 651 | case 'notRendered': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 652 | reasonElement = UI.UIUtils.formatLocalized('Element is not rendered.', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 653 | break; |
| 654 | case 'notVisible': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 655 | reasonElement = UI.UIUtils.formatLocalized('Element is not visible.', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 656 | break; |
| 657 | case 'presentationalRole': { |
Peter Marshall | 7e33f4d | 2020-09-02 08:59:09 | [diff] [blame] | 658 | const role = axNode && axNode.role() || ''; |
| 659 | const rolePresentationSpan = document.createElement('span', {is: 'source-code'}).textContent = 'role=' + role; |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 660 | reasonElement = UI.UIUtils.formatLocalized('Element has %s.', [rolePresentationSpan]); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 661 | break; |
| 662 | } |
| 663 | case 'probablyPresentational': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 664 | reasonElement = UI.UIUtils.formatLocalized('Element is presentational.', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 665 | break; |
| 666 | case 'staticTextUsedAsNameFor': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 667 | reasonElement = UI.UIUtils.formatLocalized('Static text node is used as name for\xA0', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 668 | break; |
| 669 | case 'uninteresting': |
Tim van der Lippe | 8f15c8d | 2020-02-13 14:59:41 | [diff] [blame] | 670 | reasonElement = UI.UIUtils.formatLocalized('Element not interesting for accessibility.', []); |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 671 | break; |
| 672 | } |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 673 | if (reasonElement) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 674 | reasonElement.classList.add('ax-reason'); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 675 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 676 | return reasonElement; |
| 677 | } |
| 678 | |
| 679 | /** |
| 680 | * @override |
| 681 | */ |
| 682 | onattach() { |
| 683 | this.listItemElement.removeChildren(); |
| 684 | |
Tim van der Lippe | 6d1e03c | 2020-01-22 14:05:58 | [diff] [blame] | 685 | this._reasonElement = AXNodeIgnoredReasonTreeElement.createReasonElement(this._property.name, this._axNode); |
Changhao Han | c1817b2 | 2020-09-07 09:04:18 | [diff] [blame] | 686 | if (this._reasonElement) { |
| 687 | this.listItemElement.appendChild(this._reasonElement); |
| 688 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 689 | |
| 690 | const value = this._property.value; |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 691 | if (value.type === Protocol.Accessibility.AXValueType.Idref) { |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 692 | this.appendRelatedNodeListValueElement(value); |
Tim van der Lippe | 1d6e57a | 2019-09-30 11:55:34 | [diff] [blame] | 693 | } |
Blink Reformat | 4c46d09 | 2018-04-07 15:32:37 | [diff] [blame] | 694 | } |
Paul Lewis | f16142c | 2019-11-07 15:56:04 | [diff] [blame] | 695 | } |