8000 fix: use guid to ensure uniqueness of track setting options (#8762) · videojs/video.js@f4186a0 · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

Commit f4186a0

Browse files
mister-benmister-ben
authored
fix: use guid to ensure uniqueness of track setting options (#8762)
The fix for the previous issue with the new text track settings introduced that ids would be re-used across players as there was no prefix for the settings that don't have a `<label>` for their `<select>`. This change uses a generated guid for items without that label. Fixes #8761 ## Requirements Checklist - [x] Feature implemented / Bug fixed - [ ] If necessary, more likely in a feature request than a bug fix - [x] Change has been verified in an actual browser (Chrome, Firefox, IE) - [ ] Unit Tests updated or fixed - [ ] Docs/guides updated - [ ] Example created ([starter template on JSBin](https://codepen.io/gkatsev/pen/GwZegv?editors=1000#0)) - [x] Has no DOM changes which impact accessiblilty or trigger warnings (e.g. Chrome issues tab) - [x] Has no changes to JSDoc which cause `npm run docs:api` to error - [ ] Reviewed by Two Core Contributors
1 parent fc1f7a6 commit f4186a0

File tree

1 file changed

+7
-3
lines changed

1 file changed

+7
-3
lines changed

‎src/js/tracks/text-track-select.js

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import Component from '../component';
22
import * as Dom from '../utils/dom';
3+
import { newGUID } from '../utils/guid';
34

45
/** @import Player from './player' */
56
/** @import { ContentDescriptor } from '../utils/dom' */
@@ -29,11 +30,10 @@ class TextTrackSelect extends Component {
2930
* @param {string} [options.id]
3031
* A text with part of an string to create atribute of aria-labelledby.
3132
*
32-
* @param {array} [options.SelectOptions]
33+
* @param {Array} [options.SelectOptions]
3334
* Array that contains the value & textContent of for each of the
3435
* options elements.
3536
*/
36-
3737
constructor(player, options = {}) {
3838
super(player, options);
3939

@@ -57,7 +57,11 @@ class TextTrackSelect extends Component {
5757
},
5858
{},
5959
this.options_.SelectOptions.map((optionText) => {
60-
const optionId = this.options_.labelId + '-' + optionText[1].replace(/\W+/g, '');
60+
// Constructs an id for the <option>.
61+
// For the colour settings that have two <selects> with a <label> each, generates an id based off the label value
62+
// For font size/family and edge style with one <select> and no <label>, generates an id with a guid
63+
const optionId = (this.options_.labelId ? this.options_.labelId : `vjs-track-option-${newGUID()}`) +
64+
'-' + optionText[1].replace(/\W+/g, '');
6165

6266
const option = Dom.createEl(
6367
'option',

0 commit comments

Comments
 (0)
0