Diff
Modified: trunk/LayoutTests/ChangeLog (218852 => 218853)
--- trunk/LayoutTests/ChangeLog 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/LayoutTests/ChangeLog 2017-06-27 23:48:22 UTC (rev 218853)
@@ -1,5 +1,16 @@
2017-06-27 Antoine Quint <[email protected]>
+ [Modern Media Controls] Accessibility labels should be formatted using NSDateComponentsFormatter
+ https://bugs.webkit.org/show_bug.cgi?id=173858
+ <rdar://problem/32643171>
+
+ Reviewed by Dean Jackson.
+
+ * media/modern-media-controls/scrubber/scrubber-has-correct-ax-label-expected.txt:
+ * media/modern-media-controls/scrubber/scrubber-has-correct-ax-label.html:
+
+2017-06-27 Antoine Quint <[email protected]>
+
Placard icons act like buttons (can get keyboard focus and shows up in VoiceOver)
https://bugs.webkit.org/show_bug.cgi?id=173891
<rdar://problem/33011855>
Modified: trunk/LayoutTests/media/modern-media-controls/scrubber/scrubber-has-correct-ax-label-expected.txt (218852 => 218853)
--- trunk/LayoutTests/media/modern-media-controls/scrubber/scrubber-has-correct-ax-label-expected.txt 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/LayoutTests/media/modern-media-controls/scrubber/scrubber-has-correct-ax-label-expected.txt 2017-06-27 23:48:22 UTC (rev 218853)
@@ -3,11 +3,10 @@
On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
-PASS scrubberInput.getAttribute('aria-valuetext') is "0 Minute 0 Second"
+PASS input.getAttribute('aria-valuetext') is "0 seconds"
PASS media.currentTime is 2
-PASS scrubberInput.getAttribute('aria-valuetext') === '0 Minute 2 Seconds' became true
+PASS input.getAttribute('aria-valuetext') === '2 seconds' became true
PASS successfullyParsed is true
TEST COMPLETE
-
Modified: trunk/LayoutTests/media/modern-media-controls/scrubber/scrubber-has-correct-ax-label.html (218852 => 218853)
--- trunk/LayoutTests/media/modern-media-controls/scrubber/scrubber-has-correct-ax-label.html 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/LayoutTests/media/modern-media-controls/scrubber/scrubber-has-correct-ax-label.html 2017-06-27 23:48:22 UTC (rev 218853)
@@ -13,7 +13,7 @@
}
</style>
-<video src="" style="width: 320px; height: 240px;" controls></video>
+<video src="" style="width: 320px; height: 240px;" controls autoplay></video>
<div id="host"></div>
<script type="text/_javascript_">
@@ -21,22 +21,19 @@
description("Testing for an accessibility text on the scrubber that correctly reflects the changes in media.currentTime.");
-const container = document.querySelector("div#host");
const media = document.querySelector("video");
-const mediaController = createControls(container, media, null);
+let input;
-mediaController.controls.showsStartButton = false;
+media.addEventListener("play", () => {
+ input = internals.shadowRoot(media).querySelector(".time-control > .slider > input");
-const scrubberNodes = mediaController.controls.timeControl.scrubber.children;
-const scrubberInput = scrubberNodes[scrubberNodes.length - 1].element;
+ media.pause();
-media.addEventListener("canplay", () => {
-
- shouldBeEqualToString("scrubberInput.getAttribute('aria-valuetext')", "0 Minute 0 Second");
+ shouldBeEqualToString("input.getAttribute('aria-valuetext')", "0 seconds");
media.currentTime = 2;
shouldBe("media.currentTime", "2");
- shouldBecomeEqual("scrubberInput.getAttribute('aria-valuetext') === '0 Minute 2 Seconds'", "true", finishJSTest);
-})
+ shouldBecomeEqual("input.getAttribute('aria-valuetext') === '2 seconds'", "true", finishJSTest);
+});
</script>
<script src=""
Modified: trunk/Source/WebCore/ChangeLog (218852 => 218853)
--- trunk/Source/WebCore/ChangeLog 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/Source/WebCore/ChangeLog 2017-06-27 23:48:22 UTC (rev 218853)
@@ -1,3 +1,35 @@
+2017-06-27 Antoine Quint <[email protected]>
+
+ [Modern Media Controls] Accessibility labels should be formatted using NSDateComponentsFormatter
+ https://bugs.webkit.org/show_bug.cgi?id=173858
+ <rdar://problem/32643171>
+
+ Reviewed by Dean Jackson.
+
+ We shouldn't be manually trying to create a formatted string for media controls and instead rely
+ on NSDateComponentsFormatter to perform this task for us. So we remove the ad-hoc code in the JS
+ media controls code and instead add a new MediaControlsHost method to format durations which calls
+ into RenderTheme to provide a formatted duration string relevant to the current platform and locale.
+
+ * English.lproj/modern-media-controls-localized-strings.js:
+ * Modules/mediacontrols/MediaControlsHost.cpp:
+ (WebCore::MediaControlsHost::formattedStringForDuration):
+ * Modules/mediacontrols/MediaControlsHost.h:
+ * Modules/mediacontrols/MediaControlsHost.idl:
+ * Modules/modern-media-controls/controls/slider.js:
+ (Slider.prototype.set inputAccessibleLabel):
+ * Modules/modern-media-controls/controls/time-label.js:
+ (TimeLabel.prototype.commitProperty):
+ * Modules/modern-media-controls/main.js:
+ (createControls):
+ (formattedStringForDuration):
+ (formatTimeToString): Deleted.
+ * rendering/RenderTheme.h:
+ (WebCore::RenderTheme::mediaControlsFormattedStringForDuration):
+ * rendering/RenderThemeCocoa.h:
+ * rendering/RenderThemeCocoa.mm:
+ (WebCore::RenderThemeCocoa::mediaControlsFormattedStringForDuration):
+
2017-06-27 Eric Carlson <[email protected]>
r218647 causes getUserMedia to fail on some machines
Modified: trunk/Source/WebCore/English.lproj/modern-media-controls-localized-strings.js (218852 => 218853)
--- trunk/Source/WebCore/English.lproj/modern-media-controls-localized-strings.js 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/Source/WebCore/English.lproj/modern-media-controls-localized-strings.js 2017-06-27 23:48:22 UTC (rev 218853)
@@ -8,12 +8,8 @@
"Exit Full Screen": "Exit Full Screen",
"Error": "Error",
"Forward": "Forward",
- "Hour": "Hour",
- "Hours": "Hours",
"Invalid": "Invalid",
"Live Broadcast": "Live Broadcast",
- "Minute": "Minute",
- "Minutes": "Minutes",
"Media Selection": "Media Selection",
"Mute": "Mute",
"Pause": "Pause",
@@ -21,8 +17,6 @@
"Play": "Play",
"Remaining": "Remaining",
"Rewind": "Rewind",
- "Second": "Second",
- "Seconds": "Seconds",
"Skip Back 15 seconds": "Skip Back 15 seconds",
"Skip Forward 15 seconds": "Skip Forward 15 seconds",
"Subtitles": "Subtitles",
Modified: trunk/Source/WebCore/Modules/mediacontrols/MediaControlsHost.cpp (218852 => 218853)
--- trunk/Source/WebCore/Modules/mediacontrols/MediaControlsHost.cpp 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/Source/WebCore/Modules/mediacontrols/MediaControlsHost.cpp 2017-06-27 23:48:22 UTC (rev 218853)
@@ -289,6 +289,11 @@
return RenderTheme::singleton().mediaControlsBase64StringForIconNameAndType(iconName, iconType);
}
+String MediaControlsHost::formattedStringForDuration(const double durationInSeconds) const
+{
+ return RenderTheme::singleton().mediaControlsFormattedStringForDuration(durationInSeconds);
}
+}
+
#endif
Modified: trunk/Source/WebCore/Modules/mediacontrols/MediaControlsHost.h (218852 => 218853)
--- trunk/Source/WebCore/Modules/mediacontrols/MediaControlsHost.h 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/Source/WebCore/Modules/mediacontrols/MediaControlsHost.h 2017-06-27 23:48:22 UTC (rev 218853)
@@ -88,6 +88,7 @@
String shadowRootCSSText() const;
String base64StringForIconNameAndType(const String& iconName, const String& iconType) const;
+ String formattedStringForDuration(const double) const;
private:
MediaControlsHost(HTMLMediaElement*);
Modified: trunk/Source/WebCore/Modules/mediacontrols/MediaControlsHost.idl (218852 => 218853)
--- trunk/Source/WebCore/Modules/mediacontrols/MediaControlsHost.idl 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/Source/WebCore/Modules/mediacontrols/MediaControlsHost.idl 2017-06-27 23:48:22 UTC (rev 218853)
@@ -63,4 +63,5 @@
[EnabledAtRuntime=ModernMediaControls] readonly attribute DOMString shadowRootCSSText;
[EnabledAtRuntime=ModernMediaControls] DOMString base64StringForIconNameAndType(DOMString iconName, DOMString iconType);
+ [EnabledAtRuntime=ModernMediaControls] DOMString formattedStringForDuration(unrestricted double durationInSeconds);
};
Modified: trunk/Source/WebCore/Modules/modern-media-controls/controls/slider.js (218852 => 218853)
--- trunk/Source/WebCore/Modules/modern-media-controls/controls/slider.js 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/Source/WebCore/Modules/modern-media-controls/controls/slider.js 2017-06-27 23:48:22 UTC (rev 218853)
@@ -56,7 +56,7 @@
set inputAccessibleLabel(timeValue)
{
- this._input.element.setAttribute("aria-valuetext", formatTimeToString(timeValue));
+ this._input.element.setAttribute("aria-valuetext", formattedStringForDuration(timeValue));
}
get disabled()
Modified: trunk/Source/WebCore/Modules/modern-media-controls/controls/time-label.js (218852 => 218853)
--- trunk/Source/WebCore/Modules/modern-media-controls/controls/time-label.js 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/Source/WebCore/Modules/modern-media-controls/controls/time-label.js 2017-06-27 23:48:22 UTC (rev 218853)
@@ -69,7 +69,7 @@
{
if (propertyName === "value") {
this.element.textContent = this._formattedTime();
- const timeAsString = formatTimeToString(this.value);
+ const timeAsString = formattedStringForDuration(this.value);
const ariaLabel = (this._type === TimeLabel.Types.Remaining) ? UIString("Remaining") : UIString("Elapsed");
this.element.setAttribute("aria-label", `${ariaLabel}: ${timeAsString}`);
if (this.parent instanceof TimeControl)
Modified: trunk/Source/WebCore/Modules/modern-media-controls/main.js (218852 => 218853)
--- trunk/Source/WebCore/Modules/modern-media-controls/main.js 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/Source/WebCore/Modules/modern-media-controls/main.js 2017-06-27 23:48:22 UTC (rev 218853)
@@ -23,10 +23,13 @@
* OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
*/
+let mediaControlsHost;
+
// This is called from HTMLMediaElement::ensureMediaControlsInjectedScript().
function createControls(shadowRoot, media, host)
{
if (host) {
+ mediaControlsHost = host;
iconService.mediaControlsHost = host;
shadowRoot.appendChild(document.createElement("style")).textContent = host.shadowRootCSSText;
}
@@ -67,12 +70,10 @@
return `${value} ${returnedUnit}`;
}
-function formatTimeToString(timeInSeconds)
+function formattedStringForDuration(timeInSeconds)
{
- const time = formatTimeByUnit(timeInSeconds);
- const timeStrings = [unitizeTime(time.minutes, "Minute"), unitizeTime(time.seconds, "Second")];
- if (time.hours > 0)
- timeStrings.unshift(unitizeTime(time.hours, "Hour"));
-
- return timeStrings.join(" ");
+ if (mediaControlsHost)
+ return mediaControlsHost.formattedStringForDuration(Math.abs(timeInSeconds));
+ else
+ return "";
}
Modified: trunk/Source/WebCore/rendering/RenderTheme.h (218852 => 218853)
--- trunk/Source/WebCore/rendering/RenderTheme.h 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/Source/WebCore/rendering/RenderTheme.h 2017-06-27 23:48:22 UTC (rev 218853)
@@ -94,6 +94,7 @@
virtual String extraMediaControlsStyleSheet() { return String(); }
virtual String mediaControlsScript() { return String(); }
virtual String mediaControlsBase64StringForIconNameAndType(const String&, const String&) { return String(); }
+ virtual String mediaControlsFormattedStringForDuration(const double) { return String(); }
#endif
#if ENABLE(FULLSCREEN_API)
virtual String extraFullScreenStyleSheet() { return String(); }
Modified: trunk/Source/WebCore/rendering/RenderThemeCocoa.h (218852 => 218853)
--- trunk/Source/WebCore/rendering/RenderThemeCocoa.h 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/Source/WebCore/rendering/RenderThemeCocoa.h 2017-06-27 23:48:22 UTC (rev 218853)
@@ -35,6 +35,10 @@
void adjustApplePayButtonStyle(StyleResolver&, RenderStyle&, const Element*) const override;
bool paintApplePayButton(const RenderObject&, const PaintInfo&, const IntRect&) override;
#endif
+protected:
+#if ENABLE(VIDEO)
+ String mediaControlsFormattedStringForDuration(const double) override;
+#endif
};
}
Modified: trunk/Source/WebCore/rendering/RenderThemeCocoa.mm (218852 => 218853)
--- trunk/Source/WebCore/rendering/RenderThemeCocoa.mm 2017-06-27 23:40:07 UTC (rev 218852)
+++ trunk/Source/WebCore/rendering/RenderThemeCocoa.mm 2017-06-27 23:48:22 UTC (rev 218853)
@@ -42,8 +42,16 @@
SOFT_LINK_MAY_FAIL(PassKit, PKDrawApplePayButton, void, (CGContextRef context, CGRect drawRect, CGFloat scale, PKPaymentButtonType type, PKPaymentButtonStyle style, NSString *languageCode), (context, drawRect, scale, type, style, languageCode));
+#endif // ENABLE(APPLE_PAY)
+
+#if ENABLE(VIDEO)
+#include "LocalizedStrings.h"
+#endif
+
namespace WebCore {
+#if ENABLE(APPLE_PAY)
+
static const auto applePayButtonMinimumWidth = 140;
static const auto applePayButtonPlainMinimumWidth = 100;
static const auto applePayButtonMinimumHeight = 30;
@@ -99,6 +107,27 @@
return false;
}
+#endif // ENABLE(APPLE_PAY)
+
+#if ENABLE(VIDEO)
+
+String RenderThemeCocoa::mediaControlsFormattedStringForDuration(const double durationInSeconds)
+{
+#if ENABLE(MEDIA_CONTROLS_SCRIPT)
+ if (!std::isfinite(durationInSeconds))
+ return WEB_UI_STRING("indefinite time", "accessibility help text for an indefinite media controller time value");
+
+ NSDateComponentsFormatter *durationFormatter = [NSDateComponentsFormatter new];
+ durationFormatter.unitsStyle = NSDateComponentsFormatterUnitsStyleFull;
+ durationFormatter.allowedUnits = NSCalendarUnitHour | NSCalendarUnitMinute | NSCalendarUnitSecond;
+ durationFormatter.formattingContext = NSFormattingContextStandalone;
+ durationFormatter.maximumUnitCount = 2;
+ return [durationFormatter stringFromTimeInterval:durationInSeconds];
+#else
+ return emptyString();
+#endif
}
-#endif
+#endif // ENABLE(VIDEO)
+
+}
