diff --git a/src/plugins/layout/Inspector.js b/src/plugins/layout/Inspector.js index 3aebb9fb2..0ca405dfa 100644 --- a/src/plugins/layout/Inspector.js +++ b/src/plugins/layout/Inspector.js @@ -66,6 +66,18 @@ export default class Inspector extends Component { : this.props.persistedState.elements; }; + focused = () => { + if (!this.props.ax) { + return null; + } + // $FlowFixMe: Object.values returns Array + const elements: Array = Object.values( + this.props.persistedState.AXelements, + ); + return elements.find(i => i?.data?.Accessibility?.['accessibility-focused']) + ?.id; + }; + componentDidMount() { this.props.client.call(this.call().GET_ROOT).then((root: Element) => { this.props.setPersistedState({ @@ -102,6 +114,16 @@ export default class Inspector extends Component { this.getAndExpandPath(path); }, ); + + if (this.props.ax) { + this.props.client.subscribe('axFocusEvent', () => { + // update all nodes, to find new focused node + this.getNodes(Object.keys(this.props.persistedState.AXelements), { + force: true, + ax: true, + }); + }); + } } componentDidUpdate(prevProps: Props) { @@ -234,6 +256,7 @@ export default class Inspector extends Component { selected={this.selected()} root={this.root()} elements={this.elements()} + focused={this.focused()} /> ) : null; } diff --git a/src/ui/components/elements-inspector/elements.js b/src/ui/components/elements-inspector/elements.js index 2a6906a57..dab428caf 100644 --- a/src/ui/components/elements-inspector/elements.js +++ b/src/ui/components/elements-inspector/elements.js @@ -27,7 +27,7 @@ const backgroundColor = props => { if (props.selected) { return colors.macOSTitleBarIconSelected; } else if (props.focused) { - return colors.lime; + return '#00CF52'; } else if (props.even) { return colors.light02; } else { @@ -39,7 +39,7 @@ const backgroundColorHover = props => { if (props.selected) { return colors.macOSTitleBarIconSelected; } else if (props.focused) { - return colors.lime; + return '#00CF52'; } else { return '#EBF1FB'; }