Title: [261084] trunk
- Revision
- 261084
- Author
- [email protected]
- Date
- 2020-05-04 08:28:46 -0700 (Mon, 04 May 2020)
Log Message
Media controls tracks menu shows "Auto" selected instead of track selected via the JS API
https://bugs.webkit.org/show_bug.cgi?id=211230
<rdar://problem/62648409>
Patch by Antoine Quint <[email protected]> on 2020-05-04
Reviewed by Eric Carlson.
Source/WebCore:
Test: media/modern-media-controls/tracks-support/tracks-support-text-track-selected-via-media-api.html
We're fixing two issues with the captions menu on macOS here.
First, if a text track was marked as "showing" with the JS API, we would not show it as selected in the UI
because MediaControlsHost would report that the captionDisplayMode was "automatic" and we'd take this as
sufficient data to say that the "Automatic (Recommended)" item should be shown as selected. We now only
do this if we also don't have any text tracks set as "showing".
The second issue was when trying to select "Automatic (Recommended)" when a text track had been marked as
"showing" with the JS API. Calling `setSelectedTextTrack()` on MediaControlsHost in this case was not sufficient
because HTMLMediaElement::setSelectedTextTrack is a no-op if the automatic text track is provided but captionDisplayMode
is still set to "automatic". To address this, we first disable all text tracks before calling `setSelectedTextTrack()`.
* Modules/modern-media-controls/media/tracks-support.js:
(TracksSupport.prototype.tracksPanelIsTrackInSectionSelected):
(TracksSupport.prototype.tracksPanelSelectionDidChange):
LayoutTests:
Add a test that:
- sets an embedded text track as selected via the HTMLMediaElement TextTrack APIs,
- brings up the tracks panel,
- dumps its initial UI state, checking that the track selected via the API shows as selected in the UI,
- selects the "Automatic (Recommended)" track,
- brings up the tracks panel again,
- dumps its current UI state, checking that the "Automatic (Recommended)" shows as selected in the UI.
* media/modern-media-controls/tracks-support/tracks-support-text-track-selected-via-media-api-expected.txt: Added.
* media/modern-media-controls/tracks-support/tracks-support-text-track-selected-via-media-api.html: Added.
Modified Paths
Added Paths
Diff
Modified: trunk/LayoutTests/ChangeLog (261083 => 261084)
--- trunk/LayoutTests/ChangeLog 2020-05-04 14:59:53 UTC (rev 261083)
+++ trunk/LayoutTests/ChangeLog 2020-05-04 15:28:46 UTC (rev 261084)
@@ -1,3 +1,23 @@
+2020-05-04 Antoine Quint <[email protected]>
+
+ Media controls tracks menu shows "Auto" selected instead of track selected via the JS API
+ https://bugs.webkit.org/show_bug.cgi?id=211230
+ <rdar://problem/62648409>
+
+ Reviewed by Eric Carlson.
+
+ Add a test that:
+
+ - sets an embedded text track as selected via the HTMLMediaElement TextTrack APIs,
+ - brings up the tracks panel,
+ - dumps its initial UI state, checking that the track selected via the API shows as selected in the UI,
+ - selects the "Automatic (Recommended)" track,
+ - brings up the tracks panel again,
+ - dumps its current UI state, checking that the "Automatic (Recommended)" shows as selected in the UI.
+
+ * media/modern-media-controls/tracks-support/tracks-support-text-track-selected-via-media-api-expected.txt: Added.
+ * media/modern-media-controls/tracks-support/tracks-support-text-track-selected-via-media-api.html: Added.
+
2020-05-04 Andres Gonzalez <[email protected]>
Add WTR::AccessibilityUIElement::attributeValueAsync to retrieve attribute values in isolated tree mode.
Added: trunk/LayoutTests/media/modern-media-controls/tracks-support/tracks-support-text-track-selected-via-media-api-expected.txt (0 => 261084)
--- trunk/LayoutTests/media/modern-media-controls/tracks-support/tracks-support-text-track-selected-via-media-api-expected.txt (rev 0)
+++ trunk/LayoutTests/media/modern-media-controls/tracks-support/tracks-support-text-track-selected-via-media-api-expected.txt 2020-05-04 15:28:46 UTC (rev 261084)
@@ -0,0 +1,30 @@
+This test checks that setting an embedded text track as selected via the HTMLMediaElement JS APIs will correctly show this track as selected, and that selecting the "Automatic (Recommended)" track will revert back to selecting that entry.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS shadowRoot.querySelector('button.tracks') became different from null
+PASS shadowRoot.querySelector('button.tracks').getBoundingClientRect().width became different from 0
+
+=== Initial state ===
+
+[-] Off
+[-] Auto (Recommended)
+[x] English Subtitles
+[-] French Subtitles
+[-] German Subtitles
+[-] Spanish Subtitles
+
+=== After picking auto track interactively ===
+
+[-] Off
+[x] Auto (Recommended)
+[-] English Subtitles
+[-] French Subtitles
+[-] German Subtitles
+[-] Spanish Subtitles
+
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
Added: trunk/LayoutTests/media/modern-media-controls/tracks-support/tracks-support-text-track-selected-via-media-api.html (0 => 261084)
--- trunk/LayoutTests/media/modern-media-controls/tracks-support/tracks-support-text-track-selected-via-media-api.html (rev 0)
+++ trunk/LayoutTests/media/modern-media-controls/tracks-support/tracks-support-text-track-selected-via-media-api.html 2020-05-04 15:28:46 UTC (rev 261084)
@@ -0,0 +1,88 @@
+<!DOCTYPE html>
+<script src=""
+<body>
+<video src="" style="position: absolute; left: 0; top: 0; width: 640px; height: 360px;" controls autoplay></video>
+<script type="text/_javascript_">
+
+window.jsTestIsAsync = true;
+
+description(`This test checks that setting an embedded text track as selected via the HTMLMediaElement JS APIs will correctly show this track as selected, and that selecting the
+"Automatic (Recommended)" track will revert back to selecting that entry.`);
+
+const media = document.querySelector("video");
+const shadowRoot = window.internals.shadowRoot(media);
+
+media.addEventListener("play", () => {
+ media.pause();
+
+ shouldBecomeDifferent("shadowRoot.querySelector('button.tracks')", "null", () => {
+ shouldBecomeDifferent("shadowRoot.querySelector('button.tracks').getBoundingClientRect().width", "0", runTest);
+ });
+});
+
+async function runTest()
+{
+ // Start by selecting one of the text tracks using the media JS API.
+ // This will cause textTracksDidChange to be called for the first time.
+ media.textTracks[0].mode = "showing";
+
+ // Next, bring up the tracks menu by clicking on the tracks button.
+ await clickOnTracksButton();
+ // Dump the state of the tracks menu for text tracks, which should show the first embedded text track as selected.
+ dumpTextTracksListNodes("Initial state");
+ // Now, select the "Automatic (Recommended)" text track.
+ await clickOnTextTrackAtIndex(1);
+ // Wait for the selection to have gone through and the panel to have transitioned out of view.
+ await new Promise(resolve => shadowRoot.querySelector(".tracks-panel").addEventListener("transitionend", resolve, { once: true }));
+
+ // Now, bring up the tracks menu again by clicking on the tracks button.
+ await clickOnTracksButton();
+ // Dump the state of the tracks menu for text tracks, which should now show "Automatic (Recommended)" as selected.
+ dumpTextTracksListNodes("After picking auto track interactively");
+
+ finishTest();
+}
+
+function textTracksListNodes()
+{
+ return shadowRoot.querySelectorAll(".tracks-panel section:last-of-type > ul > li");
+}
+
+function dumpTextTracksListNodes(msg)
+{
+ debug("");
+ debug(`=== ${msg} ===`);
+ debug("");
+ Array.from(textTracksListNodes()).forEach(li => debug(`${li.classList.contains("selected") ? "[x]" : "[-]"} ${li.textContent}`));
+}
+
+async function clickOnTracksButton()
+{
+ await new Promise(requestAnimationFrame);
+ clickOnElement(shadowRoot.lastChild.querySelector("button.tracks"));
+ await new Promise(requestAnimationFrame);
+}
+
+function clickOnTextTrackAtIndex(index)
+{
+ clickOnElement(textTracksListNodes()[index]);
+}
+
+function clickOnElement(element)
+{
+ const bounds = element.getBoundingClientRect();
+ eventSender.mouseMoveTo(bounds.left + 1, bounds.top + 1);
+ eventSender.mouseDown();
+ eventSender.mouseUp();
+}
+
+function finishTest()
+{
+ debug("");
+ media.remove();
+ finishJSTest();
+}
+
+</script>
+<script src=""
+</body>
Modified: trunk/Source/WebCore/ChangeLog (261083 => 261084)
--- trunk/Source/WebCore/ChangeLog 2020-05-04 14:59:53 UTC (rev 261083)
+++ trunk/Source/WebCore/ChangeLog 2020-05-04 15:28:46 UTC (rev 261084)
@@ -1,3 +1,29 @@
+2020-05-04 Antoine Quint <[email protected]>
+
+ Media controls tracks menu shows "Auto" selected instead of track selected via the JS API
+ https://bugs.webkit.org/show_bug.cgi?id=211230
+ <rdar://problem/62648409>
+
+ Reviewed by Eric Carlson.
+
+ Test: media/modern-media-controls/tracks-support/tracks-support-text-track-selected-via-media-api.html
+
+ We're fixing two issues with the captions menu on macOS here.
+
+ First, if a text track was marked as "showing" with the JS API, we would not show it as selected in the UI
+ because MediaControlsHost would report that the captionDisplayMode was "automatic" and we'd take this as
+ sufficient data to say that the "Automatic (Recommended)" item should be shown as selected. We now only
+ do this if we also don't have any text tracks set as "showing".
+
+ The second issue was when trying to select "Automatic (Recommended)" when a text track had been marked as
+ "showing" with the JS API. Calling `setSelectedTextTrack()` on MediaControlsHost in this case was not sufficient
+ because HTMLMediaElement::setSelectedTextTrack is a no-op if the automatic text track is provided but captionDisplayMode
+ is still set to "automatic". To address this, we first disable all text tracks before calling `setSelectedTextTrack()`.
+
+ * Modules/modern-media-controls/media/tracks-support.js:
+ (TracksSupport.prototype.tracksPanelIsTrackInSectionSelected):
+ (TracksSupport.prototype.tracksPanelSelectionDidChange):
+
2020-05-04 Zalan Bujtas <[email protected]>
[LFC][TFC] Override the table computed height when content needs more space
Modified: trunk/Source/WebCore/Modules/modern-media-controls/media/tracks-support.js (261083 => 261084)
--- trunk/Source/WebCore/Modules/modern-media-controls/media/tracks-support.js 2020-05-04 14:59:53 UTC (rev 261083)
+++ trunk/Source/WebCore/Modules/modern-media-controls/media/tracks-support.js 2020-05-04 15:28:46 UTC (rev 261084)
@@ -101,11 +101,13 @@
if (sectionIndex == 0 && this._canPickAudioTracks())
return this._audioTracks()[trackIndex].enabled;
- const trackItem = this._textTracks()[trackIndex];
+ const textTracks = this._textTracks();
+ const trackItem = textTracks[trackIndex];
const host = this.mediaController.host;
- const usesAutomaticTrack = host ? host.captionDisplayMode === "automatic" : false;
+ const allTracksDisabled = textTracks.every(track => track.mode === "disabled");
+ const usesAutomaticTrack = host ? (host.captionDisplayMode === "automatic" && allTracksDisabled) : false;
- if (host && trackItem === host.captionMenuOffItem && (host.captionDisplayMode === "forced-only" || host.captionDisplayMode === "manual"))
+ if (allTracksDisabled && host && trackItem === host.captionMenuOffItem && (host.captionDisplayMode === "forced-only" || host.captionDisplayMode === "manual"))
return true;
if (host && trackItem === host.captionMenuAutomaticItem && usesAutomaticTrack)
return true;
@@ -116,9 +118,10 @@
{
if (sectionIndex == 0 && this._canPickAudioTracks())
this._audioTracks().forEach((audioTrack, index) => audioTrack.enabled = index === trackIndex);
- else if (this.mediaController.host)
+ else if (this.mediaController.host) {
+ this._textTracks().forEach(textTrack => textTrack.mode = "disabled");
this.mediaController.host.setSelectedTextTrack(this._textTracks()[trackIndex]);
- else
+ } else
this._textTracks().forEach((textTrack, index) => textTrack.mode = index === trackIndex ? "showing" : "disabled");
this.mediaController.controls.hideTracksPanel();
_______________________________________________
webkit-changes mailing list
[email protected]
https://lists.webkit.org/mailman/listinfo/webkit-changes
