Keyboard control of menus doesn't work for the Chapters menu

[OwenEdwards]

Description

Keyboard acces to menus was fixed in #3033, but #3163 exposes that keyboard access doesn't work for a menu with a title (such as the Chapters menu).

Steps to reproduce

Expected behavior

Use Tab to move focus to the Captions menu button
Use Enter to open the menu
Observe that the arrow keys move focus up and down the menu

Observed behavior

Then use Tab to move focus to the Chapters Menu button
Use Enter to open the menu
Arrow keys do not work

Error output

If there are any errors at all, please include them here.

TypeError: children[item].el_ is undefined

Additional Information

Please include any additional information necessary here. Including the following:

versions

videojs

what version of videojs does this occur with?

Any versions after #3163 is merged.

browsers

what browser are affected?

Checked on Firefox, v44.

OSes

what platforms (operating systems and devices) are affected?

Checked on OS X.

plugins

are any videojs plugins being used on the page? If so, please list them below.

No.

[gkatsev]

One way to work around it is to insert an object with the el_ set to the element instead of just inserting the element itself.

[gkatsev]

Or maybe we just want to make a menu-title component?

[gkatsev]

I guess we don't even care to make the title focusable? Anyway, I have a PR to potentially fix it.

[OwenEdwards]

Yeah, the title element shouldn't be focusable, because it has no action associated with it. I thought about the idea of a menu-title component, but I'm really not convinced that there's enough functionality for that to make sense - ss we discussed, it ought to move out of the LI in the future, but that'll have to wait until v6.x.