<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[214639] trunk</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://trac.webkit.org/projects/webkit/changeset/214639">214639</a></dd>
<dt>Author</dt> <dd>mrajca@apple.com</dd>
<dt>Date</dt> <dd>2017-03-30 16:35:55 -0700 (Thu, 30 Mar 2017)</dd>
</dl>
<h3>Log Message</h3>
<pre>YouTube sometimes does not respect "user gesture" restriction for videos.
https://bugs.webkit.org/show_bug.cgi?id=170297
I discovered a code path that does not honor the "user gesture" requirement and playback is able to begin
even though we have a restriction in place. When using Media Source Extensions, which YouTube does, we transition
from a "Have Metadata" to a "Future Data" state that causes playback to begin, however, we never check
if we have a playback restriction in place.
Reviewed by Eric Carlson.
* html/HTMLMediaElement.cpp:
(WebCore::HTMLMediaElement::setReadyState):</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunkSourceWebCoreChangeLog">trunk/Source/WebCore/ChangeLog</a></li>
<li><a href="#trunkSourceWebCorehtmlHTMLMediaElementcpp">trunk/Source/WebCore/html/HTMLMediaElement.cpp</a></li>
</ul>
<h3>Added Paths</h3>
<ul>
<li><a href="#trunkLayoutTestsmediamediasourcemediasourcerestrictionsexpectedtxt">trunk/LayoutTests/media/media-source/media-source-restrictions-expected.txt</a></li>
<li><a href="#trunkLayoutTestsmediamediasourcemediasourcerestrictionshtml">trunk/LayoutTests/media/media-source/media-source-restrictions.html</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunkLayoutTestsmediamediasourcemediasourcerestrictionsexpectedtxt"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/media/media-source/media-source-restrictions-expected.txt (0 => 214639)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/media/media-source/media-source-restrictions-expected.txt (rev 0)
+++ trunk/LayoutTests/media/media-source/media-source-restrictions-expected.txt 2017-03-30 23:35:55 UTC (rev 214639)
</span><span class="lines">@@ -0,0 +1,12 @@
</span><ins>+
+RUN(internals.setMediaElementRestrictions(video, 'RequireUserGestureForAudioRateChange'))
+EXPECTED (source.readyState == 'closed') OK
+EVENT(sourceopen)
+RUN(sourceBuffer = source.addSourceBuffer("video/mock; codecs=mock"))
+RUN(sourceBuffer.appendBuffer(initSegment))
+EVENT(updateend)
+RUN(sourceBuffer.appendBuffer(samples))
+EVENT(updateend)
+EVENT(pause)
+END OF TEST
+
</ins></span></pre></div>
<a id="trunkLayoutTestsmediamediasourcemediasourcerestrictionshtml"></a>
<div class="addfile"><h4>Added: trunk/LayoutTests/media/media-source/media-source-restrictions.html (0 => 214639)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/LayoutTests/media/media-source/media-source-restrictions.html (rev 0)
+++ trunk/LayoutTests/media/media-source/media-source-restrictions.html 2017-03-30 23:35:55 UTC (rev 214639)
</span><span class="lines">@@ -0,0 +1,68 @@
</span><ins>+<!DOCTYPE html>
+<html>
+<head>
+ <title>media-source-restrictions</title>
+ <script src="mock-media-source.js"></script>
+ <script src="../video-test.js"></script>
+ <script>
+ var source;
+ var sourceBuffer;
+ var initSegment;
+ var samples;
+
+ if (window.internals)
+ internals.initializeMockMediaSource();
+
+ function runTest() {
+ findMediaElement();
+
+ run(`internals.setMediaElementRestrictions(video, 'RequireUserGestureForAudioRateChange')`);
+
+ source = new MediaSource();
+ testExpected('source.readyState', 'closed');
+
+ waitForEventOn(source, 'sourceopen', sourceOpen);
+ video.src = URL.createObjectURL(source);
+ }
+
+ function handlePause() {
+ endTest();
+ }
+
+ function sourceOpen() {
+ run('sourceBuffer = source.addSourceBuffer("video/mock; codecs=mock")');
+ waitForEventOn(sourceBuffer, 'updateend', loadSamples, false, true);
+ initSegment = makeAInit(8, [makeATrack(1, 'mock', TRACK_KIND.AUDIO)]);
+ run('sourceBuffer.appendBuffer(initSegment)');
+
+ waitForEvent('pause', handlePause);
+ video.play().catch(function(error) {
+ failTest();
+ });
+ }
+
+ function loadSamples() {
+ samples = concatenateSamples([
+ makeASample(0, 0, 1, 1, SAMPLE_FLAG.SYNC),
+ makeASample(1, 1, 1, 1, SAMPLE_FLAG.SYNC),
+ makeASample(2, 2, 1, 1, SAMPLE_FLAG.SYNC),
+ makeASample(3, 3, 1, 1, SAMPLE_FLAG.SYNC),
+ makeASample(4, 4, 1, 1, SAMPLE_FLAG.SYNC),
+ makeASample(5, 5, 1, 1, SAMPLE_FLAG.SYNC),
+ makeASample(6, 6, 1, 1, SAMPLE_FLAG.SYNC),
+ makeASample(7, 7, 1, 1, SAMPLE_FLAG.SYNC),
+ ]);
+
+ waitForEventOn(sourceBuffer, 'updateend', updateEnd, false, true);
+ run('sourceBuffer.appendBuffer(samples)');
+ }
+
+ function updateEnd() {
+ waitForEventAndFail("onended");
+ }
+ </script>
+</head>
+<body onload="runTest()">
+ <video></video>
+</body>
+</html>
</ins></span></pre></div>
<a id="trunkSourceWebCoreChangeLog"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/ChangeLog (214638 => 214639)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/ChangeLog 2017-03-30 23:30:47 UTC (rev 214638)
+++ trunk/Source/WebCore/ChangeLog 2017-03-30 23:35:55 UTC (rev 214639)
</span><span class="lines">@@ -1,3 +1,18 @@
</span><ins>+2017-03-30 Matt Rajca <mrajca@apple.com>
+
+ YouTube sometimes does not respect "user gesture" restriction for videos.
+ https://bugs.webkit.org/show_bug.cgi?id=170297
+
+ I discovered a code path that does not honor the "user gesture" requirement and playback is able to begin
+ even though we have a restriction in place. When using Media Source Extensions, which YouTube does, we transition
+ from a "Have Metadata" to a "Future Data" state that causes playback to begin, however, we never check
+ if we have a playback restriction in place.
+
+ Reviewed by Eric Carlson.
+
+ * html/HTMLMediaElement.cpp:
+ (WebCore::HTMLMediaElement::setReadyState):
+
</ins><span class="cx"> 2017-03-30 Said Abou-Hallawa <sabouhallawa@apple.com>
</span><span class="cx">
</span><span class="cx"> REGRESSION (r213764): Background image from sprite sheet incorrectly scaled
</span></span></pre></div>
<a id="trunkSourceWebCorehtmlHTMLMediaElementcpp"></a>
<div class="modfile"><h4>Modified: trunk/Source/WebCore/html/HTMLMediaElement.cpp (214638 => 214639)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/Source/WebCore/html/HTMLMediaElement.cpp 2017-03-30 23:30:47 UTC (rev 214638)
+++ trunk/Source/WebCore/html/HTMLMediaElement.cpp 2017-03-30 23:35:55 UTC (rev 214639)
</span><span class="lines">@@ -2457,6 +2457,11 @@
</span><span class="cx"> shouldUpdateDisplayState = true;
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+ // If we transition to the Future Data state and we're about to begin playing, ensure playback is actually permitted first,
+ // honoring any playback denial reasons such as the requirement of a user gesture.
+ if (m_readyState == HAVE_FUTURE_DATA && oldState < HAVE_FUTURE_DATA && potentiallyPlaying() && !m_mediaSession->playbackPermitted(*this))
+ pauseInternal();
+
</ins><span class="cx"> if (shouldUpdateDisplayState) {
</span><span class="cx"> updateDisplayState();
</span><span class="cx"> if (hasMediaControls()) {
</span></span></pre>
</div>
</div>
</body>
</html>