Chapters list shows twice

[edwinbradford]

Description

The list of Chapters appears twice in Firefox.

Steps to reproduce

Duplicate video.js/sandbox/descriptions.html.example and rename the new copy by removing the ".example" suffix. Open this new copy in Firefox and notice the list of Chapters appears correctly.

In the html after the following line...

<track kind="chapters" src="../docs/examples/elephantsdream/chapters.en.vtt" srclang="en" label="English"></track>

...add the following subtitle track:

<track kind="subtitles" src="../docs/examples/shared/example-captions.vtt" srclang="en" label="English"></track>

Results

Reload the page in Firefox and notice that the list of Chapters now appears twice.

Expected

The list of Chapters should appear once.

versions

videojs

5.9.0

browsers

Firefox

OSes

Windows 7

plugins

No plugins

[gkatsev]

Have you tried 5.10.8? We had a fix related to this that is in that release.

[edwinbradford]

I just tried it in a separate project directory to my fork. The duplicate menu entries are fixed but now there is a horizontal and vertical scroll bar that only appears on the Chapters menu. I imagine the vertical scroll bar is probably deliberate but the horizontal scroll bar is not desired.

The cause of the horizontal scroll bar is too narrow a width of the pop up menu for the text. You can fix this by amending the style called .vjs-menu-button-popup .vjs-menu and increasing the width to say 16em. This would affect all menus and cause them to shift right so you will have to change the value of the `left' property in the same class.

In my style I solved this by replacing the left property with a right value of zero so pop up menus are aligned right but I don't want to interfere with the design of VideoJS.

I hope that's helpful.

NB. Firefox and Chrome now behave identically by the way.

[gkatsev]

Happy to hear that the specific issue is fixed.
We probably don't want to make this styling change in videojs core just yet, though, maybe making just the chapters menu a bit wider might be good. Thanks.