fix(text-track-settings): localization not correctly applied (#8904)

Localization is not applied correctly in fieldset labels and select
options. As a result, the text track setting modal dialog is only half
translated.

- add `localize` at `label` level in `TextTrackFieldset`
- add `localize` at `option` level in `TextTrackSelect`
- add test cases

Author: amtins

src/js/tracks/text-track-fieldset.js

@@ -87,7 +87,7 @@ class TextTrackFieldset extends Component {
         const label = Dom.createEl('label', {
           id,
           className: 'vjs-label',
-          textContent: selectConfig.label
+          textContent: this.localize(selectConfig.label)
         });
 
         label.setAttribute('for', guid);

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

@@ -68,7 +68,7 @@ class TextTrackSelect extends Component {
           {
             id: optionId,
             value: this.localize(optionText[0]),
-            textContent: optionText[1]
+            textContent: this.localize(optionText[1])
           }
         );
 

test/unit/tracks/text-track-settings.test.js

@@ -375,10 +375,16 @@ QUnit.test('should update on languagechange', function(assert) {
     tracks
   });
 
-  videojs.addLanguage('test', {'Font Size': 'FONTSIZE'});
+  videojs.addLanguage('test', {
+    'Font Size': 'FONTSIZE',
+    'Color': 'COLOR',
+    'White': 'WHITE'
+  });
   player.language('test');
 
   assert.equal(player.$('.vjs-font-percent legend').textContent, 'FONTSIZE', 'settings dialog updates on languagechange');
+  assert.equal(player.$('.vjs-text-color label').textContent, 'COLOR', 'settings dialog label updates on languagechange');
+  assert.equal(player.$('.vjs-text-color select option').textContent, 'WHITE', 'settings dialog select updates on languagechange');
 
   player.dispose();
 });