Can Power BI custom visuals accept keyboard focus?

1
votes

I am trying to create a custom slicer that supports keyboard navigation.

I have come across the supportsKeyboardFocus property in capabilities.json, and I see that this changes the visual HTML element to look like the built in slicer which does support keyboard navigation (removes aria-hidden="true" and adds keyboard-shortcuts="ctrl-ArrowRight scoped") but am still unable to get keyboard focus inside a simple custom visual. Are there any working examples of a custom visual that supports keyboard navigation?

1
powerbipowerbi-custom-visuals

1 Answers

0
votes

There was a regression in custom visuals' keyboard focus support, it has been fixed a few months ago.

In order to enable keyboard focus and navigation, the visual should:

  1. Set supportsKeyboardFocus: true in capabilities.json file.
  2. Contain focusable elements1

Also note that in a Power BI report, visuals behave as context groups, so navigation between visuals is achieved using Tab, and navigation into a visual's context is done by ctrl+rightArrow (or cmd+rightArrow for Apple).

1: While there are many DOM elements which are focusable by default (e.g. buttons, text input etc.), many custom visuals are based purely on SVG graphics, so they can end up with no focusable elements. For the most basic tab based navigation, adding tabindex=0 to an element is enough. For good accessibility, depending on the visual, it's typically required to add keyboard support for selection and multi-selection, and better navigation (e.g. arrow based grid navigation, or some reasonable grouping of elements etc.)