diff --git a/android/src/main/java/com/facebook/sonar/plugins/inspector/descriptors/utils/AccessibilityUtil.java b/android/src/main/java/com/facebook/sonar/plugins/inspector/descriptors/utils/AccessibilityUtil.java index dfccedda7..d0dae9271 100644 --- a/android/src/main/java/com/facebook/sonar/plugins/inspector/descriptors/utils/AccessibilityUtil.java +++ b/android/src/main/java/com/facebook/sonar/plugins/inspector/descriptors/utils/AccessibilityUtil.java @@ -686,7 +686,7 @@ public final class AccessibilityUtil { public static void addTalkbackProperties(SonarObject.Builder props, View view) { if (!AccessibilityEvaluationUtil.isTalkbackFocusable(view)) { props - .put("talkback-ignored", true) + .put("talkback-focusable", false) .put("talkback-ignored-reasons", getTalkbackIgnoredReasons(view)); } else { props @@ -729,7 +729,7 @@ public final class AccessibilityUtil { if (!AccessibilityEvaluationUtil.isTalkbackFocusable(view)) { String reason = getTalkbackIgnoredReasons(view); return new SonarObject.Builder() - .put("talkback-ignored", true) + .put("talkback-focusable", false) .put("talkback-ignored-reasons", reason == null ? "" : reason) .build(); } else { diff --git a/src/plugins/layout/index.js b/src/plugins/layout/index.js index aba54121d..b1f5a3906 100644 --- a/src/plugins/layout/index.js +++ b/src/plugins/layout/index.js @@ -935,6 +935,27 @@ export default class Layout extends SonarPlugin { }); }; + // returns object with all sidebar elements that should show more information + // on hover (needs to be kept up-to-date if names of properties change) + getAccessibilityTooltips() { + return { + 'accessibility-focused': + 'True if this element has the focus of an accessibility service', + 'content-description': + 'Text to label the content/functionality of this element ', + 'important-for-accessibility': + 'Marks this element as important to accessibility services, one of AUTO, YES, NO, NO_HIDE_DESCENDANTS', + 'talkback-focusable': 'True if Talkback can focus on this element', + 'talkback-focusable-reasons': 'Why Talkback can focus on this element', + 'talkback-ignored': 'True if Talkback cannot focus on this element', + 'talkback-ignored-reasons': 'Why Talkback cannot focus on the element', + 'talkback-output': + 'What Talkback will say when this element is focused (derived from role, content-description, and state of the element)', + 'talkback-hint': + 'What Talkback will say after output if hints are enabled', + }; + } + renderSidebar = () => { if (this.state.inAXMode) { // empty if no element selected w/in AX node tree @@ -942,6 +963,7 @@ export default class Layout extends SonarPlugin { this.state.AXselected && ( @@ -1001,7 +1023,7 @@ export default class Layout extends SonarPlugin { onClick={this.onToggleAccessibility} role="button" tabIndex={-1} - title="Toggle accessibility mode within the LayoutInspector"> + title="Toggle to see the accessibility hierarchy"> , + /** + * Object of properties that will have tooltips + */ + tooltips?: Object, }; const defaultValueExtractor: DataValueExtractor = (value: any) => { @@ -408,6 +412,7 @@ export default class DataInspector extends Component { path, ancestry, collapsed, + tooltips, } = this.props; // the data inspector makes values read only when setValue isn't set so we just need to set it @@ -493,6 +498,7 @@ export default class DataInspector extends Component { name={key} data={metadata.data} diff={metadata.diff} + tooltips={tooltips} /> ); @@ -523,7 +529,11 @@ export default class DataInspector extends Component { // create name components const nameElems = []; if (typeof name !== 'undefined') { - nameElems.push({name}); + nameElems.push( + + {name} + , + ); nameElems.push(: ); } @@ -549,6 +559,7 @@ export default class DataInspector extends Component { /> ); } + descriptionOrPreview = ( {nameElems} diff --git a/src/ui/components/data-inspector/ManagedDataInspector.js b/src/ui/components/data-inspector/ManagedDataInspector.js index 8a203f7a6..ea6b2bcb9 100644 --- a/src/ui/components/data-inspector/ManagedDataInspector.js +++ b/src/ui/components/data-inspector/ManagedDataInspector.js @@ -39,6 +39,10 @@ type ManagedDataInspectorProps = {| * Whether all objects and arrays should be collapsed by default. */ collapsed?: boolean, + /** + * Object of all properties that will have tooltips + */ + tooltips?: Object, |}; type ManagedDataInspectorState = {| @@ -99,6 +103,7 @@ export default class ManagedDataInspector extends PureComponent< onExpanded={this.onExpanded} expandRoot={this.props.expandRoot} collapsed={this.props.collapsed} + tooltips={this.props.tooltips} /> ); } diff --git a/src/ui/components/elements-inspector/sidebar.js b/src/ui/components/elements-inspector/sidebar.js index d39e1e307..97525413f 100644 --- a/src/ui/components/elements-inspector/sidebar.js +++ b/src/ui/components/elements-inspector/sidebar.js @@ -22,6 +22,7 @@ type InspectorSidebarSectionProps = { data: any, id: string, onValueChanged: ?OnValueChanged, + tooltips?: Object, }; class InspectorSidebarSection extends Component { @@ -65,6 +66,7 @@ class InspectorSidebarSection extends Component { extractValue={this.extractValue} expandRoot={true} collapsed={true} + tooltips={this.props.tooltips} /> ); @@ -73,6 +75,7 @@ class InspectorSidebarSection extends Component { type Props = {| element: ?Element, + tooltips?: Object, onValueChanged: ?OnValueChanged, client: PluginClient, |}; @@ -117,6 +120,7 @@ export class InspectorSidebar extends Component { for (const key in element.data) { sections.push(