Keyboard navigation not working for "Tree" component, as is working for TreeSelect component

[benjaminr-ps]

• I have searched the issues of this repository and believe that this is not a duplicate.

Reproduction link

https://codepen.io/benjaminr-ps/pen/eYNWMye?editors=0010

Steps to reproduce

Declare a Tree component. with treeData at least defined.

What is expected?

Using the keyboard arrow keys, up-down-left-right, will let you navigate through the tree, by changing the selected item, or expand/collapse an item.

What is actually happening?

The keyboard arrow keys are not funtional.
It might only affect the srollbar usage.

Environment	Info
antd	4.0.0
React	^16.12.0
System	Windows 10
Browser	Firefox 73.0.1; Chrome 80.0.3987.122

---

The TreeSelect component uses internally the Tree component, and supports somehow the keyboard navigation.

[zombieJ]

Tree support key operation by tab to get focus:

[benjaminr-ps]

Thanks for the prompt help.

Surprisingly, it works when pressing tab.

I slightly updated my reproduction code, to not have the search box anymore.

So, when only having the tree, the following procedure is currently needed to have keyboard navigation:

1. Select a tree item
2. Press Tab key
3. Use keyboard arrow keys to navigate

But, here is the following procedure I would expect:

1. Select a tree item
2. Use keyboard arrow keys to navigate

Is the Tab always needed to have the focus set on tree for keyboard navigation?

[zombieJ]

Since Tree component provides the ability to customize title with ReactNode which may be a focusable element by developer customize. To avoid activeElement conflict, Tree component focus status is a keyboard only.

But yes. I think we can extend tabIndex that when developer set to 0, Tree will get focus when click on it. Just a suppose, welcome any other suggestion.

[benjaminr-ps]

Sounds great, personnally I would expect it to be always enabled, but, of course, It can be made configurable through API.