Troubleshooting DirectionalNavigation

If directional navigation isn't working properly for you or is producing unexpected results, check here for troubleshooting steps for issues that you might encounter.

No Element Appears to Have Focus

To determine the element that currently has input focus, type document.activeElement in the JavaScript console during a debugging session. See JavaScript Console on MSDN for more information.

Some questions to ask are:

• Is the active element off screen?
• Does the active element have an opacity of zero?

Elements with an opacity of zero are still focusable even though they are not visible. Setting opacity to zero to hide an element is generally a bad practice. Setting the CSS visibility property to hidden, or the display property to none, are the preferred methods for hiding elements.

You can also call document.activeElement within your app to programmatically determine the element that has focus.

Why Can't I Navigate to a Particular Element?

If you are trying to navigate to an element but focus won't go there, here are a few questions to ask: •* Is TVJS.DirectionalNavigation.focusRoot the element you expect it to be? Focus is restricted to elements that are descendants of the focus root. If the element you want to receive focus is not a descendant of the focus root, the element will not receive focus.

• If your element is an element, is it disabled?
• Are any of the following true? If so, the element is not eligible for automatic focus selection:
  • tab index of zero or −1
  • display style of "none"
  • visibility style of "hidden"
  • height or width of zero
• Is the element a focusable element? If not, did you add a valid tab index? Only the following elements are considered focusable by default:
  • <a>
  • <button>
  • <input>
  • <select>
  • <textarea>
  • Elements to which you've added a valid tab index.

findNextFocusElement Returns null

Verify that the arguments passed into findNextFocusElement are valid. For example, you may have passed in a misspelled keyCode.