diff --git a/src/lib/viewers/media/MediaControls.html b/src/lib/viewers/media/MediaControls.html index 2d4d631e3..a67d8929d 100644 --- a/src/lib/viewers/media/MediaControls.html +++ b/src/lib/viewers/media/MediaControls.html @@ -35,7 +35,7 @@ 00:00 / 00:00 - + CC diff --git a/src/lib/viewers/media/Settings.js b/src/lib/viewers/media/Settings.js index d1dc99922..81bd3afa0 100644 --- a/src/lib/viewers/media/Settings.js +++ b/src/lib/viewers/media/Settings.js @@ -108,6 +108,9 @@ class Settings extends EventEmitter { /** @property {HTMLElement} - Settings button element (gear icon) */ settingsButtonEl; + /** @property {HTMLElement} - CC button element */ + ccButtonEl; + /** @property {boolean} - Whether settings menu is visible */ visible = false; @@ -140,6 +143,7 @@ class Settings extends EventEmitter { this.firstMenuItem = this.settingsEl.querySelectorAll('.bp-media-settings-item')[0]; this.settingsButtonEl = this.containerEl.querySelector('.bp-media-gear-icon'); + this.ccButtonEl = this.containerEl.querySelector('.bp-media-cc-icon'); addActivationListener(this.settingsEl, this.menuEventHandler); this.containerEl.classList.add(CLASS_SETTINGS_SUBTITLES_UNAVAILABLE); @@ -450,8 +454,10 @@ class Settings extends EventEmitter { } this.containerEl.classList.remove(CLASS_SETTINGS_SUBTITLES_ON); + this.ccButtonEl.setAttribute('aria-pressed', 'false'); } else { this.containerEl.classList.add(CLASS_SETTINGS_SUBTITLES_ON); + this.ccButtonEl.setAttribute('aria-pressed', 'true'); } } diff --git a/src/lib/viewers/media/__tests__/Settings-test.html b/src/lib/viewers/media/__tests__/Settings-test.html index 1db8a0f78..7bc08f5f2 100644 --- a/src/lib/viewers/media/__tests__/Settings-test.html +++ b/src/lib/viewers/media/__tests__/Settings-test.html @@ -1 +1 @@ - + diff --git a/src/lib/viewers/media/__tests__/Settings-test.js b/src/lib/viewers/media/__tests__/Settings-test.js index 5b28981c1..9da27a0f4 100644 --- a/src/lib/viewers/media/__tests__/Settings-test.js +++ b/src/lib/viewers/media/__tests__/Settings-test.js @@ -633,6 +633,7 @@ describe('lib/viewers/media/Settings', () => { expect(settings.toggleToSubtitle).to.equal('3'); expect(settings.areSubtitlesOn()).to.equal(false); + expect(settings.ccButtonEl.getAttribute('aria-pressed')).to.equal('false'); expect(settings.containerEl).to.not.have.class('bp-media-settings-subtitles-on'); }); @@ -642,12 +643,14 @@ describe('lib/viewers/media/Settings', () => { expect(settings.toggleToSubtitle).to.equal('2'); expect(settings.areSubtitlesOn()).to.equal(false); + expect(settings.ccButtonEl.getAttribute('aria-pressed')).to.equal('false'); expect(settings.containerEl).to.not.have.class('bp-media-settings-subtitles-on'); }); it('should set subtitles-on on container when subtitles are selected', () => { settings.handleSubtitleSelection('-1', '2'); + expect(settings.ccButtonEl.getAttribute('aria-pressed')).to.equal('true'); expect(settings.containerEl).to.have.class('bp-media-settings-subtitles-on'); }); });