shaka-player 3.1.3 → 3.2.2

package/ui/cast_button.js

@@ -8,7 +8,6 @@
 goog.provide('shaka.ui.CastButton');
 
 goog.require('shaka.cast.CastProxy');
-goog.require('shaka.ui.Constants');
 goog.require('shaka.ui.Controls');
 goog.require('shaka.ui.Element');
 goog.require('shaka.ui.Enums');
@@ -42,7 +41,7 @@ shaka.ui.CastButton = class extends shaka.ui.Element {
     /** @private {!HTMLButtonElement} */
     this.castButton_ = shaka.util.Dom.createButton();
     this.castButton_.classList.add('shaka-cast-button');
-    this.castButton_.setAttribute('aria-pressed', 'false');
+    this.castButton_.ariaPressed = 'false';
 
     /** @private {!HTMLElement} */
     this.castIcon_ = shaka.util.Dom.createHTMLElement('i');
@@ -102,9 +101,8 @@ shaka.ui.CastButton = class extends shaka.ui.Element {
       } catch (error) {
         this.castButton_.disabled = false;
         if (error.code != shaka.util.Error.Code.CAST_CANCELED_BY_USER) {
-          this.controls.dispatchEvent(new shaka.util.FakeEvent('error', {
-            detail: error,
-          }));
+          this.controls.dispatchEvent(new shaka.util.FakeEvent(
+              'error', (new Map()).set('detail', error)));
         }
       }
     }
@@ -126,9 +124,9 @@ shaka.ui.CastButton = class extends shaka.ui.Element {
     // Aria-pressed set to true when casting, set to false otherwise.
     if (canCast) {
       if (isCasting) {
-        this.castButton_.setAttribute('aria-pressed', 'true');
+        this.castButton_.ariaPressed = 'true';
       } else {
-        this.castButton_.setAttribute('aria-pressed', 'false');
+        this.castButton_.ariaPressed = 'false';
       }
     }
 
@@ -156,8 +154,7 @@ shaka.ui.CastButton = class extends shaka.ui.Element {
   updateLocalizedStrings_() {
     const LocIds = shaka.ui.Locales.Ids;
 
-    this.castButton_.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(LocIds.CAST));
+    this.castButton_.ariaLabel = this.localization.resolve(LocIds.CAST);
     this.castNameSpan_.textContent =
         this.localization.resolve(LocIds.CAST);
 

package/ui/constants.js

@@ -7,8 +7,5 @@
 
 goog.provide('shaka.ui.Constants');
 
-/** @const {string} */
-shaka.ui.Constants.ARIA_LABEL = 'aria-label';
-
 /** @const {number} */
 shaka.ui.Constants.MIN_SEEK_WINDOW_TO_SHOW_SEEKBAR = 5; // seconds

package/ui/controls.js

@@ -573,9 +573,8 @@ shaka.ui.Controls = class extends shaka.util.FakeEventTarget {
           }
         }
       } catch (error) {
-        this.dispatchEvent(new shaka.util.FakeEvent('error', {
-          detail: error,
-        }));
+        this.dispatchEvent(new shaka.util.FakeEvent(
+            'error', (new Map()).set('detail', error)));
       }
     }
   }
@@ -1162,9 +1161,8 @@ shaka.ui.Controls = class extends shaka.util.FakeEventTarget {
   /** @private */
   onCastStatusChange_() {
     const isCasting = this.castProxy_.isCasting();
-    this.dispatchEvent(new shaka.util.FakeEvent('caststatuschanged', {
-      newStatus: isCasting,
-    }));
+    this.dispatchEvent(new shaka.util.FakeEvent(
+        'caststatuschanged', (new Map()).set('newStatus', isCasting)));
 
     if (isCasting) {
       this.controlsContainer_.setAttribute('casting', 'true');

package/ui/fast_forward_button.js

@@ -7,7 +7,6 @@
 
 goog.provide('shaka.ui.FastForwardButton');
 
-goog.require('shaka.ui.Constants');
 goog.require('shaka.ui.Controls');
 goog.require('shaka.ui.Element');
 goog.require('shaka.ui.Enums');
@@ -57,8 +56,8 @@ shaka.ui.FastForwardButton = class extends shaka.ui.Element {
    * @private
    */
   updateAriaLabel_() {
-    this.button_.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(shaka.ui.Locales.Ids.FAST_FORWARD));
+    this.button_.ariaLabel =
+        this.localization.resolve(shaka.ui.Locales.Ids.FAST_FORWARD);
   }
 
   /**

package/ui/fullscreen_button.js

@@ -7,7 +7,6 @@
 
 goog.provide('shaka.ui.FullscreenButton');
 
-goog.require('shaka.ui.Constants');
 goog.require('shaka.ui.Controls');
 goog.require('shaka.ui.Element');
 goog.require('shaka.ui.Enums');
@@ -71,8 +70,7 @@ shaka.ui.FullscreenButton = class extends shaka.ui.Element {
     const label = document.fullscreenElement ?
         LocIds.EXIT_FULL_SCREEN : LocIds.FULL_SCREEN;
 
-    this.button_.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(label));
+    this.button_.ariaLabel = this.localization.resolve(label);
   }
 
   /**

package/ui/language_utils.js

@@ -138,7 +138,7 @@ shaka.ui.LanguageUtils = class {
       if (updateChosen && (combinationName == selectedCombination)) {
         button.appendChild(shaka.ui.Utils.checkmarkIcon());
         span.classList.add('shaka-chosen-item');
-        button.setAttribute('aria-selected', 'true');
+        button.ariaSelected = 'true';
         currentSelectionElement.textContent = span.textContent;
       }
       langMenu.appendChild(button);

package/ui/less/containers.less

@@ -229,13 +229,9 @@
   transition-delay: 500ms;
 
   /* These are defaults which are overridden by JS or cue styles. */
-  span:not(.shaka-text-wrapper) {
-    display: inline;
-    font-size: 20px;
-    line-height: 1.4;  // relative to font size.
-    background-color: rgba(0, 0, 0, 0.8);
-    color: rgb(255, 255, 255);
-  }
+  font-size: 20px;
+  line-height: 1.4;  // relative to font size.
+  color: rgb(255, 255, 255);
 
   span.shaka-text-wrapper {
     display: inline;

package/ui/locales/ru.json

@@ -1,10 +1,10 @@
 {
-  "AD_DURATION": "Продолжительность объявления",
-  "AD_PROGRESS": "Объявление [AD_ON] из [NUM_ADS]",
-  "AD_TIME": "Объявление: [AD_TIME]",
+  "AD_DURATION": "Продолжительность рекламы",
+  "AD_PROGRESS": "Реклама [AD_ON] из [NUM_ADS]",
+  "AD_TIME": "Реклама: [AD_TIME]",
   "AUTO_QUALITY": "Авто",
   "BACK": "Назад",
-  "CAPTIONS": "Титры",
+  "CAPTIONS": "Субтитры",
   "CAST": "Транслировать...",
   "ENTER_LOOP_MODE": "Зациклить текущее видео",
   "ENTER_PICTURE_IN_PICTURE": "Перейти в режим \"Картинка в картинке\"",
@@ -20,8 +20,8 @@
   "MULTIPLE_LANGUAGES": "Несколько языков",
   "MUTE": "Отключить звук",
   "NOT_APPLICABLE": "Неприменимо",
-  "OFF": "Включить",
-  "ON": "Отключить",
+  "OFF": "Выкл.",
+  "ON": "Вкл.",
   "PAUSE": "Пауза",
   "PICTURE_IN_PICTURE": "Картинка в картинке",
   "PLAY": "Воспроизвести",

package/ui/localization.js

@@ -130,28 +130,20 @@ shaka.ui.Localization = class {
         (locale) => !this.localizations_.has(locale));
 
     if (missing.length) {
-      /** @type {shaka.ui.Localization.UnknownLocalesEvent} */
-      const eMissing = {
-        'locales': missing,
-      };
-
       this.events_.dispatchEvent(new shaka.util.FakeEvent(
           Class.UNKNOWN_LOCALES,
-          eMissing));
+          (new Map()).set('locales', missing)));
     }
 
     const found = shaka.util.Iterables.filter(
         this.currentLocales_,
         (locale) => this.localizations_.has(locale));
 
-    /** @type {shaka.ui.Localization.LocaleChangedEvent} */
-    const eFound = {
-      'locales': found.length ? found : [this.fallbackLocale_],
-    };
-
+    const data = (new Map()).set(
+        'locales', found.length ? found : [this.fallbackLocale_]);
     this.events_.dispatchEvent(new shaka.util.FakeEvent(
         Class.LOCALE_CHANGED,
-        eFound));
+        data));
   }
 
   /**
@@ -253,14 +245,11 @@ shaka.ui.Localization = class {
     // number of locales. Since we don't know which ones we actually checked,
     // just tell them the preferred locale.
 
-    /** @type {shaka.ui.Localization.UnknownLocalizationEvent} */
-    const e = {
-      // Make a copy to avoid leaking references.
-      'locales': Array.from(this.currentLocales_),
-      'missing': id,
-    };
-
-    this.events_.dispatchEvent(new FakeEvent(Class.UNKNOWN_LOCALIZATION, e));
+    const data = new Map()
+        // Make a copy to avoid leaking references.
+        .set('locales', Array.from(this.currentLocales_))
+        .set('missing', id);
+    this.events_.dispatchEvent(new FakeEvent(Class.UNKNOWN_LOCALIZATION, data));
 
     return '';
   }
@@ -381,18 +370,16 @@ shaka.ui.Localization = class {
     }
 
     if (missing.size > 0) {
-      /** @type {shaka.ui.Localization.MissingLocalizationsEvent} */
-      const e = {
-        // Make a copy of the preferred locales to avoid leaking references.
-        'locales': Array.from(preferredLocales),
-        // Because most people like arrays more than sets, convert the set to
-        // an array.
-        'missing': Array.from(missing),
-      };
+      const data = new Map()
+          // Make a copy of the preferred locales to avoid leaking references.
+          .set('locales', Array.from(preferredLocales))
+          // Because more people like arrays more than sets, convert the set to
+          // an array.
+          .set('missing', Array.from(missing));
 
       this.events_.dispatchEvent(new shaka.util.FakeEvent(
           shaka.ui.Localization.MISSING_LOCALIZATIONS,
-          e));
+          data));
     }
   }
 
@@ -478,52 +465,42 @@ shaka.ui.Localization.LOCALE_CHANGED = 'locale-changed';
 shaka.ui.Localization.LOCALE_UPDATED = 'locale-updated';
 
 /**
- * @typedef {{
- *   'locales': !Array.<string>
- * }}
- *
+ * @event shaka.ui.Localization.UnknownLocalesEvent
+ * @property {string} type
+ *   'unknown-locales'
  * @property {!Array.<string>} locales
  *    The locales that the user wanted but could not be found.
  * @exportDoc
  */
-shaka.ui.Localization.UnknownLocalesEvent;
 
 /**
- * @typedef {{
- *   'locales': !Array.<string>,
- *   'missing': string
- * }}
- *
+ * @event shaka.ui.Localization.MissingLocalizationsEvent
+ * @property {string} type
+ *   'unknown-localization'
  * @property {!Array.<string>} locales
  *    The locales that the user wanted.
  * @property {string} missing
  *    The id of the unknown entry.
  * @exportDoc
  */
-shaka.ui.Localization.UnknownLocalizationEvent;
 
 /**
- * @typedef {{
- *   'locales': !Array.<string>,
- *   'missing': !Array.<string>
- * }}
- *
+ * @event shaka.ui.Localization.MissingLocalizationsEvent
+ * @property {string} type
+ *   'missing-localizations'
  * @property {string} locale
  *    The locale that the user wanted.
  * @property {!Array.<string>} missing
  *    The ids of the missing entries.
  * @exportDoc
  */
-shaka.ui.Localization.MissingLocalizationsEvent;
 
 /**
- * @typedef {{
- *   'locales': !Array.<string>
- * }}
- *
+ * @event shaka.ui.Localization.LocaleChangedEvent
+ * @property {string} type
+ *   'locale-changed'
  * @property {!Array.<string>} locales
  *    The new set of locales that user wanted,
  *    and that were successfully found.
  * @exportDoc
  */
-shaka.ui.Localization.LocaleChangedEvent;

package/ui/loop_button.js

@@ -7,7 +7,6 @@
 
 goog.provide('shaka.ui.LoopButton');
 
-goog.require('shaka.ui.Constants');
 goog.require('shaka.ui.Controls');
 goog.require('shaka.ui.Element');
 goog.require('shaka.ui.Enums');
@@ -151,8 +150,7 @@ shaka.ui.LoopButton = class extends shaka.ui.Element {
     const ariaText = this.video.loop ?
         LocIds.EXIT_LOOP_MODE : LocIds.ENTER_LOOP_MODE;
 
-    this.button_.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(ariaText));
+    this.button_.ariaLabel = this.localization.resolve(ariaText);
   }
 };
 

package/ui/mute_button.js

@@ -8,7 +8,6 @@
 goog.provide('shaka.ui.MuteButton');
 
 goog.require('shaka.ads.AdManager');
-goog.require('shaka.ui.Constants');
 goog.require('shaka.ui.Controls');
 goog.require('shaka.ui.Element');
 goog.require('shaka.ui.Enums');
@@ -97,8 +96,7 @@ shaka.ui.MuteButton = class extends shaka.ui.Element {
       label = this.video.muted ? LocIds.UNMUTE : LocIds.MUTE;
     }
 
-    this.button_.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(label));
+    this.button_.ariaLabel = this.localization.resolve(label);
   }
 
   /**

package/ui/overflow_menu.js

@@ -10,7 +10,6 @@ goog.provide('shaka.ui.OverflowMenu');
 goog.require('goog.asserts');
 goog.require('shaka.ads.AdManager');
 goog.require('shaka.log');
-goog.require('shaka.ui.Constants');
 goog.require('shaka.ui.Controls');
 goog.require('shaka.ui.Element');
 goog.require('shaka.ui.Enums');
@@ -217,8 +216,8 @@ shaka.ui.OverflowMenu = class extends shaka.ui.Element {
    */
   updateAriaLabel_() {
     const LocIds = shaka.ui.Locales.Ids;
-    this.overflowMenuButton_.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(LocIds.MORE_SETTINGS));
+    this.overflowMenuButton_.ariaLabel =
+        this.localization.resolve(LocIds.MORE_SETTINGS);
   }
 };
 

package/ui/pip_button.js

@@ -7,7 +7,6 @@
 
 goog.provide('shaka.ui.PipButton');
 
-goog.require('shaka.ui.Constants');
 goog.require('shaka.ui.Controls');
 goog.require('shaka.ui.Element');
 goog.require('shaka.ui.Enums');
@@ -131,9 +130,8 @@ shaka.ui.PipButton = class extends shaka.ui.Element {
         await document.exitPictureInPicture();
       }
     } catch (error) {
-      this.controls.dispatchEvent(new shaka.util.FakeEvent('error', {
-        detail: error,
-      }));
+      this.controls.dispatchEvent(new shaka.util.FakeEvent(
+          'error', (new Map()).set('detail', error)));
     }
   }
 
@@ -142,8 +140,8 @@ shaka.ui.PipButton = class extends shaka.ui.Element {
   onEnterPictureInPicture_() {
     const LocIds = shaka.ui.Locales.Ids;
     this.pipIcon_.textContent = shaka.ui.Enums.MaterialDesignIcons.EXIT_PIP;
-    this.pipButton_.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(LocIds.EXIT_PICTURE_IN_PICTURE));
+    this.pipButton_.ariaLabel =
+        this.localization.resolve(LocIds.EXIT_PICTURE_IN_PICTURE);
     this.currentPipState_.textContent =
         this.localization.resolve(LocIds.ON);
   }
@@ -153,8 +151,8 @@ shaka.ui.PipButton = class extends shaka.ui.Element {
   onLeavePictureInPicture_() {
     const LocIds = shaka.ui.Locales.Ids;
     this.pipIcon_.textContent = shaka.ui.Enums.MaterialDesignIcons.PIP;
-    this.pipButton_.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(LocIds.ENTER_PICTURE_IN_PICTURE));
+    this.pipButton_.ariaLabel =
+        this.localization.resolve(LocIds.ENTER_PICTURE_IN_PICTURE);
     this.currentPipState_.textContent =
         this.localization.resolve(LocIds.OFF);
   }
@@ -172,8 +170,7 @@ shaka.ui.PipButton = class extends shaka.ui.Element {
     const ariaLabel = document.pictureInPictureElement ?
         LocIds.EXIT_PICTURE_IN_PICTURE :
         LocIds.ENTER_PICTURE_IN_PICTURE;
-    this.pipButton_.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(ariaLabel));
+    this.pipButton_.ariaLabel = this.localization.resolve(ariaLabel);
 
     const currentPipState = document.pictureInPictureElement ?
         LocIds.ON : LocIds.OFF;

package/ui/playback_rate_selection.js

@@ -7,7 +7,6 @@
 
 goog.provide('shaka.ui.PlaybackRateSelection');
 
-goog.require('shaka.ui.Constants');
 goog.require('shaka.ui.Enums');
 goog.require('shaka.ui.Locales');
 goog.require('shaka.ui.Localization');
@@ -70,10 +69,8 @@ shaka.ui.PlaybackRateSelection = class extends shaka.ui.SettingsMenu {
   updateLocalizedStrings_() {
     const LocIds = shaka.ui.Locales.Ids;
 
-    this.backButton.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(LocIds.BACK));
-    this.button.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(LocIds.PLAYBACK_RATE));
+    this.backButton.ariaLabel = this.localization.resolve(LocIds.BACK);
+    this.button.ariaLabel = this.localization.resolve(LocIds.PLAYBACK_RATE);
     this.nameSpan.textContent = this.localization.resolve(LocIds.PLAYBACK_RATE);
     this.backSpan.textContent = this.localization.resolve(LocIds.PLAYBACK_RATE);
   }
@@ -105,7 +102,7 @@ shaka.ui.PlaybackRateSelection = class extends shaka.ui.SettingsMenu {
     if (span) {
       const button = span.parentElement;
       button.appendChild(shaka.ui.Utils.checkmarkIcon());
-      button.setAttribute('aria-selected', 'true');
+      button.ariaSelected = 'true';
       span.classList.add('shaka-chosen-item');
     }
 

package/ui/presentation_time.js

@@ -7,7 +7,6 @@
 
 goog.provide('shaka.ui.PresentationTimeTracker');
 
-goog.require('shaka.ui.Constants');
 goog.require('shaka.ui.Controls');
 goog.require('shaka.ui.Element');
 goog.require('shaka.ui.Locales');
@@ -108,8 +107,7 @@ shaka.ui.PresentationTimeTracker = class extends shaka.ui.Element {
   onTracksChanged_() {
     if (this.player.isLive()) {
       const ariaLabel = shaka.ui.Locales.Ids.SKIP_TO_LIVE;
-      this.currentTime_.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-          this.localization.resolve(ariaLabel));
+      this.currentTime_.ariaLabel = this.localization.resolve(ariaLabel);
     }
   }
 };

package/ui/resolution_selection.js

@@ -8,7 +8,6 @@
 goog.provide('shaka.ui.ResolutionSelection');
 
 goog.require('goog.asserts');
-goog.require('shaka.ui.Constants');
 goog.require('shaka.ui.Enums');
 goog.require('shaka.ui.Locales');
 goog.require('shaka.ui.Localization');
@@ -137,7 +136,7 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
 
       if (!abrEnabled && track == selectedTrack) {
         // If abr is disabled, mark the selected track's resolution.
-        button.setAttribute('aria-selected', 'true');
+        button.ariaSelected = 'true';
         button.appendChild(shaka.ui.Utils.checkmarkIcon());
         span.classList.add('shaka-chosen-item');
         this.currentSelection.textContent = span.textContent;
@@ -163,7 +162,7 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
 
     // If abr is enabled reflect it by marking 'Auto' as selected.
     if (abrEnabled) {
-      autoButton.setAttribute('aria-selected', 'true');
+      autoButton.ariaSelected = 'true';
       autoButton.appendChild(shaka.ui.Utils.checkmarkIcon());
 
       this.abrOnSpan_.classList.add('shaka-chosen-item');
@@ -198,10 +197,8 @@ shaka.ui.ResolutionSelection = class extends shaka.ui.SettingsMenu {
   updateLocalizedStrings_() {
     const LocIds = shaka.ui.Locales.Ids;
 
-    this.button.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(LocIds.RESOLUTION));
-    this.backButton.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(LocIds.RESOLUTION));
+    this.button.ariaLabel = this.localization.resolve(LocIds.RESOLUTION);
+    this.backButton.ariaLabel = this.localization.resolve(LocIds.RESOLUTION);
     this.backSpan.textContent =
         this.localization.resolve(LocIds.RESOLUTION);
     this.nameSpan.textContent =

package/ui/rewind_button.js

@@ -7,7 +7,6 @@
 
 goog.provide('shaka.ui.RewindButton');
 
-goog.require('shaka.ui.Constants');
 goog.require('shaka.ui.Controls');
 goog.require('shaka.ui.Element');
 goog.require('shaka.ui.Enums');
@@ -57,8 +56,8 @@ shaka.ui.RewindButton = class extends shaka.ui.Element {
    * @private
    */
   updateAriaLabel_() {
-    this.button_.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(shaka.ui.Locales.Ids.REWIND));
+    this.button_.ariaLabel =
+        this.localization.resolve(shaka.ui.Locales.Ids.REWIND);
   }
 
   /**

package/ui/seek_bar.js

@@ -15,7 +15,6 @@ goog.require('shaka.ui.RangeElement');
 goog.require('shaka.ui.Utils');
 goog.require('shaka.util.Dom');
 goog.require('shaka.util.Timer');
-goog.requireType('shaka.ads.CuePoint');
 goog.requireType('shaka.ui.Controls');
 
 
@@ -83,7 +82,7 @@ shaka.ui.SeekBar = class extends shaka.ui.RangeElement {
      */
     this.wasPlaying_ = false;
 
-    /** @private {!Array.<!shaka.ads.CuePoint>} */
+    /** @private {!Array.<!shaka.extern.AdCuePoint>} */
     this.adCuePoints_ = [];
 
     this.eventManager.listen(this.localization,
@@ -372,8 +371,7 @@ shaka.ui.SeekBar = class extends shaka.ui.RangeElement {
 
   /** @private */
   updateAriaLabel_() {
-    this.bar.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(shaka.ui.Locales.Ids.SEEK));
+    this.bar.ariaLabel = this.localization.resolve(shaka.ui.Locales.Ids.SEEK);
   }
 };
 

package/ui/spacer.js

@@ -29,7 +29,7 @@ shaka.ui.Spacer = class extends shaka.ui.Element {
     const div = shaka.util.Dom.createHTMLElement('div');
     div.classList.add('shaka-spacer');
     // Make screen readers ignore the spacer
-    div.setAttribute('aria-hidden', true);
+    div.ariaHidden = 'true';
     this.parent.appendChild(div);
   }
 };

package/ui/text_selection.js

@@ -7,7 +7,6 @@
 
 goog.provide('shaka.ui.TextSelection');
 
-goog.require('shaka.ui.Constants');
 goog.require('shaka.ui.Enums');
 goog.require('shaka.ui.LanguageUtils');
 goog.require('shaka.ui.Locales');
@@ -38,9 +37,9 @@ shaka.ui.TextSelection = class extends shaka.ui.SettingsMenu {
     this.menu.classList.add('shaka-text-languages');
 
     if (this.player && this.player.isTextTrackVisible()) {
-      this.button.setAttribute('aria-pressed', 'true');
+      this.button.ariaPressed = 'true';
     } else {
-      this.button.setAttribute('aria-pressed', 'false');
+      this.button.ariaPressed = 'false';
     }
 
     this.addOffOption_();
@@ -92,7 +91,7 @@ shaka.ui.TextSelection = class extends shaka.ui.SettingsMenu {
    */
   addOffOption_() {
     const off = shaka.util.Dom.createButton();
-    off.setAttribute('aria-selected', 'true');
+    off.ariaSelected = 'true';
     this.menu.appendChild(off);
 
     off.appendChild(shaka.ui.Utils.checkmarkIcon());
@@ -110,11 +109,11 @@ shaka.ui.TextSelection = class extends shaka.ui.SettingsMenu {
     if (this.player.isTextTrackVisible()) {
       this.icon.classList.add('shaka-captions-on');
       this.icon.classList.remove('shaka-captions-off');
-      this.button.setAttribute('aria-pressed', 'true');
+      this.button.ariaPressed = 'true';
     } else {
       this.icon.classList.add('shaka-captions-off');
       this.icon.classList.remove('shaka-captions-on');
-      this.button.setAttribute('aria-pressed', 'false');
+      this.button.ariaPressed = 'false';
     }
 
     this.controls.dispatchEvent(
@@ -148,7 +147,7 @@ shaka.ui.TextSelection = class extends shaka.ui.SettingsMenu {
     this.menu.appendChild(offButton);
 
     if (!this.player.isTextTrackVisible()) {
-      offButton.setAttribute('aria-selected', 'true');
+      offButton.ariaSelected = 'true';
       offButton.appendChild(shaka.ui.Utils.checkmarkIcon());
       this.captionsOffSpan_.classList.add('shaka-chosen-item');
       this.currentSelection.textContent =
@@ -184,10 +183,8 @@ shaka.ui.TextSelection = class extends shaka.ui.SettingsMenu {
   updateLocalizedStrings_() {
     const LocIds = shaka.ui.Locales.Ids;
 
-    this.button.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(LocIds.CAPTIONS));
-    this.backButton.setAttribute(shaka.ui.Constants.ARIA_LABEL,
-        this.localization.resolve(LocIds.BACK));
+    this.button.ariaLabel = this.localization.resolve(LocIds.CAPTIONS);
+    this.backButton.ariaLabel = this.localization.resolve(LocIds.BACK);
     this.nameSpan.textContent =
         this.localization.resolve(LocIds.CAPTIONS);
     this.backSpan.textContent =

package/ui/ui_utils.js

@@ -70,7 +70,7 @@ shaka.ui.Utils = class {
     icon.classList.add('shaka-chosen-item');
     icon.textContent = shaka.ui.Enums.MaterialDesignIcons.CHECKMARK;
     // Screen reader should ignore icon text.
-    icon.setAttribute('aria-hidden', 'true');
+    icon.ariaHidden = 'true';
     return icon;
   }