blob: b35b114ca0b52e951c460bcbadd97d1e4dbb07f7 [file] [log] [blame]
// Copyright 2015 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.
/**
* @unrestricted
*/
export default class AccessibilitySidebarView extends UI.ThrottledWidget {
constructor() {
super();
this._node = null;
this._axNode = null;
this._skipNextPullNode = false;
this._sidebarPaneStack = UI.viewManager.createStackLocation();
this._breadcrumbsSubPane = new Accessibility.AXBreadcrumbsPane(this);
this._sidebarPaneStack.showView(this._breadcrumbsSubPane);
this._ariaSubPane = new Accessibility.ARIAAttributesPane();
this._sidebarPaneStack.showView(this._ariaSubPane);
this._axNodeSubPane = new Accessibility.AXNodeSubPane();
this._sidebarPaneStack.showView(this._axNodeSubPane);
this._sidebarPaneStack.widget().show(this.element);
UI.context.addFlavorChangeListener(SDK.DOMNode, this._pullNode, this);
this._pullNode();
}
/**
* @return {?SDK.DOMNode}
*/
node() {
return this._node;
}
/**
* @return {?Accessibility.AccessibilityNode}
*/
axNode() {
return this._axNode;
}
/**
* @param {?SDK.DOMNode} node
* @param {boolean=} fromAXTree
*/
setNode(node, fromAXTree) {
this._skipNextPullNode = !!fromAXTree;
this._node = node;
this.update();
}
/**
* @param {?Accessibility.AccessibilityNode} axNode
*/
accessibilityNodeCallback(axNode) {
if (!axNode) {
return;
}
this._axNode = axNode;
if (axNode.isDOMNode()) {
this._sidebarPaneStack.showView(this._ariaSubPane, this._axNodeSubPane);
} else {
this._sidebarPaneStack.removeView(this._ariaSubPane);
}
if (this._axNodeSubPane) {
this._axNodeSubPane.setAXNode(axNode);
}
if (this._breadcrumbsSubPane) {
this._breadcrumbsSubPane.setAXNode(axNode);
}
}
/**
* @override
* @protected
* @return {!Promise.<?>}
*/
doUpdate() {
const node = this.node();
this._axNodeSubPane.setNode(node);
this._ariaSubPane.setNode(node);
this._breadcrumbsSubPane.setNode(node);
if (!node) {
return Promise.resolve();
}
const accessibilityModel = node.domModel().target().model(Accessibility.AccessibilityModel);
accessibilityModel.clear();
return accessibilityModel.requestPartialAXTree(node).then(() => {
this.accessibilityNodeCallback(accessibilityModel.axNodeForDOMNode(node));
});
}
/**
* @override
*/
wasShown() {
super.wasShown();
// Pull down the latest date for this node.
this.doUpdate();
SDK.targetManager.addModelListener(SDK.DOMModel, SDK.DOMModel.Events.AttrModified, this._onAttrChange, this);
SDK.targetManager.addModelListener(SDK.DOMModel, SDK.DOMModel.Events.AttrRemoved, this._onAttrChange, this);
SDK.targetManager.addModelListener(
SDK.DOMModel, SDK.DOMModel.Events.CharacterDataModified, this._onNodeChange, this);
SDK.targetManager.addModelListener(
SDK.DOMModel, SDK.DOMModel.Events.ChildNodeCountUpdated, this._onNodeChange, this);
}
/**
* @override
*/
willHide() {
SDK.targetManager.removeModelListener(SDK.DOMModel, SDK.DOMModel.Events.AttrModified, this._onAttrChange, this);
SDK.targetManager.removeModelListener(SDK.DOMModel, SDK.DOMModel.Events.AttrRemoved, this._onAttrChange, this);
SDK.targetManager.removeModelListener(
SDK.DOMModel, SDK.DOMModel.Events.CharacterDataModified, this._onNodeChange, this);
SDK.targetManager.removeModelListener(
SDK.DOMModel, SDK.DOMModel.Events.ChildNodeCountUpdated, this._onNodeChange, this);
}
_pullNode() {
if (this._skipNextPullNode) {
this._skipNextPullNode = false;
return;
}
this.setNode(UI.context.flavor(SDK.DOMNode));
}
/**
* @param {!Common.Event} event
*/
_onAttrChange(event) {
if (!this.node()) {
return;
}
const node = event.data.node;
if (this.node() !== node) {
return;
}
this.update();
}
/**
* @param {!Common.Event} event
*/
_onNodeChange(event) {
if (!this.node()) {
return;
}
const node = event.data;
if (this.node() !== node) {
return;
}
this.update();
}
}
/**
* @unrestricted
*/
export class AccessibilitySubPane extends UI.SimpleView {
/**
* @param {string} name
*/
constructor(name) {
super(name);
this._axNode = null;
this.registerRequiredCSS('accessibility/accessibilityProperties.css');
}
/**
* @param {?Accessibility.AccessibilityNode} axNode
* @protected
*/
setAXNode(axNode) {
}
/**
* @return {?SDK.DOMNode}
*/
node() {
return this._node;
}
/**
* @param {?SDK.DOMNode} node
*/
setNode(node) {
this._node = node;
}
/**
* @param {string} textContent
* @param {string=} className
* @return {!Element}
*/
createInfo(textContent, className) {
const classNameOrDefault = className || 'gray-info-message';
const info = this.element.createChild('div', classNameOrDefault);
info.textContent = textContent;
return info;
}
/**
* @return {!UI.TreeOutline}
*/
createTreeOutline() {
const treeOutline = new UI.TreeOutlineInShadow();
treeOutline.registerRequiredCSS('accessibility/accessibilityNode.css');
treeOutline.registerRequiredCSS('accessibility/accessibilityProperties.css');
treeOutline.registerRequiredCSS('object_ui/objectValue.css');
treeOutline.element.classList.add('hidden');
treeOutline.hideOverflow();
this.element.appendChild(treeOutline.element);
return treeOutline;
}
}
/* Legacy exported object */
self.Accessibility = self.Accessibility || {};
/* Legacy exported object */
Accessibility = Accessibility || {};
/**
* @constructor
*/
Accessibility.AccessibilitySidebarView = AccessibilitySidebarView;
/**
* @constructor
*/
Accessibility.AccessibilitySubPane = AccessibilitySubPane;