Bug 1332994 - highlight current enabled CC item when video first loaded. r=jaws
MozReview-Commit-ID: HEpp5Ztp5cB
--- a/toolkit/content/tests/widgets/test_videocontrols_vtt.html
+++ b/toolkit/content/tests/widgets/test_videocontrols_vtt.html
@@ -15,16 +15,17 @@
</div>
<pre id="test">
<script clas="testbody" type="application/javascript">
SimpleTest.waitForExplicitFinish();
const video = document.getElementById("video");
const ccBtn = getAnonElementWithinVideoByAttribute(video, "anonid", "closedCaptionButton");
+ const ttList = getAnonElementWithinVideoByAttribute(video, "anonid", "textTrackList");
const testCases = [];
testCases.push(() => new Promise(resolve => {
is(ccBtn.getAttribute("hidden"), "true", "CC button should hide");
resolve();
}));
@@ -65,22 +66,45 @@
}));
testCases.push(() => new Promise(resolve => {
const caption = video.addTextTrack("captions", "English", "en");
caption.mode = "showing";
SimpleTest.executeSoon(() => {
is(ccBtn.getAttribute("enabled"), "true", "CC button should be enabled");
- caption.mode = "disabled";
resolve();
});
}));
+ testCases.push(() => new Promise(resolve => {
+ synthesizeMouseAtCenter(ccBtn, {});
+
+ SimpleTest.executeSoon(() => {
+ is(ttList.hasAttribute("hidden"), false, "Texttrack menu should show up");
+ is(ttList.lastChild.getAttribute("on"), "true", "The last added item should be highlighted");
+
+ resolve();
+ });
+ }));
+
+ testCases.push(() => new Promise(resolve => {
+ const tt = ttList.children[1];
+
+ isnot(tt.getAttribute("on"), "true", "Item should be off before click");
+ synthesizeMouseAtCenter(tt, {});
+
+ SimpleTest.executeSoon(() => {
+ is(tt.getAttribute("on"), "true", "Selected item should be enabled");
+ is(ttList.getAttribute("hidden"), "true", "Should hide texttrack menu once clicked on an item");
+
+ resolve();
+ });
+ }));
function executeTestCases(tasks) {
return tasks.reduce((promise, task) => promise.then(task), Promise.resolve());
}
function loadedmetadata() {
executeTestCases(testCases).then(SimpleTest.finish);
}
--- a/toolkit/content/widgets/videocontrols.xml
+++ b/toolkit/content/widgets/videocontrols.xml
@@ -1433,16 +1433,22 @@
},
addNewTextTrack(tt) {
if (!this.isSupportedTextTrack(tt)) {
return;
}
if (tt.index && tt.index < this.textTracksCount) {
+ // Don't create items for initialized tracks. However, we
+ // still need to care about mode since TextTrackManager would
+ // turn on the first available track automatically.
+ if (tt.mode === "showing") {
+ this.changeTextTrack(tt.index);
+ }
return;
}
tt.index = this.textTracksCount++;
const label = tt.label || "";
const ttText = document.createTextNode(label);
const ttBtn = document.createElement("button");
@@ -1525,23 +1531,19 @@
this.video.dispatchEvent(new CustomEvent("texttrackchange"));
}
}
this.setClosedCaptionButtonState();
},
initTextTracks() {
- if (!this.isClosedCaptionAvailable) {
- this.closedCaptionButton.setAttribute("hidden", "true");
- return;
- }
-
+ // add 'off' button anyway as new text track might be
+ // dynamically added after initialization.
const offLabel = this.textTrackList.getAttribute("offlabel");
-
this.addNewTextTrack({
label: offLabel,
kind: "subtitles"
});
for (let tt of this.overlayableTextTracks) {
this.addNewTextTrack(tt);
}