Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(29)

Side by Side Diff: bower_components/web-animations-js/test/testcases/disabled-media.html

Issue 786953007: npm_modules: Fork bower_components into Polymer 0.4.0 and 0.5.0 versions (Closed) Base URL: https://chromium.googlesource.com/infra/third_party/npm_modules.git@master
Patch Set: Created 5 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 <!--
2 Copyright 2013 Google Inc. All Rights Reserved.
3
4 Licensed under the Apache License, Version 2.0 (the "License");
5 you may not use this file except in compliance with the License.
6 You may obtain a copy of the License at
7
8 http://www.apache.org/licenses/LICENSE-2.0
9
10 Unless required by applicable law or agreed to in writing, software
11 distributed under the License is distributed on an "AS IS" BASIS,
12 WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 See the License for the specific language governing permissions and
14 limitations under the License.
15 -->
16
17 <!--
18 Requires the test harness to allow tests to be added after page load. See
19 https://github.com/web-animations/web-animations-js/issues/321
20 -->
21
22 <!DOCTYPE html><meta charset="UTF-8">
23 <style type="text/css">
24 video {
25 width: 100px;
26 }
27 </style>
28
29 <!--
30 Videos are taken from
31 http://techslides.com/sample-webm-ogg-and-mp4-video-files-for-html5
32
33 We serve them from a remote host to make sure they are served with a 206
34 response code, to work around Chrome bug
35 https://code.google.com/p/chromium/issues/detail?id=121765.
36 -->
37 <div id="videos">
38 <video preload="auto">
39 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
40 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
41 </video>
42 <video preload="auto">
43 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
44 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
45 </video>
46 <video preload="auto">
47 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
48 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
49 </video>
50 <video preload="auto">
51 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
52 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
53 </video>
54 <video preload="auto">
55 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
56 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
57 </video>
58 <video preload="auto">
59 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
60 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
61 </video>
62 <video preload="auto">
63 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
64 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
65 </video>
66 <video preload="auto">
67 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
68 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
69 </video>
70 <video preload="auto">
71 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
72 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
73 </video>
74 <video preload="auto">
75 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
76 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
77 </video>
78 <video preload="auto">
79 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
80 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
81 </video>
82 <video preload="auto">
83 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
84 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
85 </video>
86 <video preload="auto">
87 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
88 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
89 </video>
90 <video preload="auto">
91 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
92 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
93 </video>
94 <video preload="auto">
95 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
96 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
97 </video>
98 <video preload="auto">
99 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
100 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
101 </video>
102 <video preload="auto">
103 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
104 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
105 </video>
106 <video preload="auto">
107 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
108 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
109 </video>
110 <video preload="auto">
111 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
112 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
113 </video>
114 <video preload="auto">
115 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.webm" type="video/webm">
116 <source src="http://web-animations.github.io/web-animations-js/test/testcase s/small.mp4" type="video/mp4">
117 </video>
118 </div>
119
120 <script src="../bootstrap.js" nochecks></script>
121 <script>
122 "use strict";
123
124 var dt = document.timeline;
125
126 // Most of these tests require the video to have loaded before they run.
127 // However, the test harness does not allow timing_test()s to be started after
128 // the page has finished loading. This means that we can't add the video
129 // dynamically then wait for it to load before testing.
130 //
131 // As a best-effort work-around, we include all videos in static HTML with
132 // preload="auto" to hint to the browser that they should be loaded
133 // immediately. However, this does not guarantee that they will be loaded when
134 // the page's load event fires, so the tests are flaky.
135 //
136 // TODO: Fix the test runner to allow the use of async_test() with
137 // timing_test(), which will allow the video elements to be created dynamically.
138 // See https://github.com/web-animations/web-animations-js/issues/321
139 var videos = document.getElementById("videos").getElementsByTagName('video');
140 // Cache this length, as videos is a live NodeList.
141 var numStaticVideos = videos.length;
142 var nextIndex = 0;
143 function getNextVideo() {
144 if (nextIndex >= numStaticVideos) {
145 throw new Error('No more videos!');
146 }
147 return videos[nextIndex++];
148 }
149
150 function createVideo() {
151 // Videos taken from
152 // http://techslides.com/sample-webm-ogg-and-mp4-video-files-for-html5
153 var video = document.createElement("video");
154 var webmSource = document.createElement("source");
155 webmSource.setAttribute("src", "small.webm");
156 webmSource.setAttribute("type", "video/webm");
157 video.appendChild(webmSource);
158 var mp4Source = document.createElement("source");
159 mp4Source.setAttribute("src", "small.mp4");
160 mp4Source.setAttribute("type", "video/mp4");
161 video.appendChild(mp4Source);
162 document.getElementById("videos").appendChild(video);
163 return video;
164 }
165
166 function testOnceVideosLoaded(callback, message) {
167 timing_test(function() {
168 at(0.0 * 1000, callback);
169 }, message);
170 }
171
172 function createTestMediaReference(mediaElement, timing, parent) {
173 return new MediaReference(mediaElement, timing, parent, 0.0);
174 }
175
176 var expectedVideoLength = 5.568;
177
178
179 // Test that MediaReference disables looping.
180 test(function() {
181 var video = getNextVideo();
182 video.loop = true;
183 createTestMediaReference(video);
184 assert_false(video.loop);
185 }, "MediaReference should disable looping");
186
187 // Test intrinsic iteration duration before media loads.
188 test(function() {
189 assert_equals(createTestMediaReference(createVideo()).duration,
190 Infinity);
191 }, "Intrinsic duration should be Infinity before media loads");
192
193 // Test intrinisc iteration duration.
194 testOnceVideosLoaded(function() {
195 assert_approx_equals(
196 createTestMediaReference(getNextVideo()).duration,
197 expectedVideoLength, 0.001);
198 }, "Intrinsic iteration duration should be media duration");
199
200 // Test that iteration duration can be overridden.
201 testOnceVideosLoaded(function() {
202 assert_equals(createTestMediaReference(getNextVideo(), 1.0).duration,
203 1.0);
204 }, "Iteration duration should be overridable");
205
206 // Test basic use.
207 timing_test(function() {
208 var video = getNextVideo();
209 at(0.0 * 1000, function() {
210 dt.play(createTestMediaReference(video));
211 assert_equals(video.playbackRate, 1.0);
212 assert_false(video.paused);
213 });
214 }, "Basic use");
215
216 // Test clipping where duration limits. Video should be frozen at end
217 // of duration.
218 timing_test(function() {
219 var video = getNextVideo();
220 at(0.0 * 1000, function() {
221 dt.play(createTestMediaReference(video, 3.0));
222 });
223 at(3.0 * 1000, function() {
224 assert_equals(video.currentTime, 3.0);
225 assert_true(video.paused);
226 });
227 at(4.0 * 1000, function() {
228 assert_equals(video.currentTime, 3.0);
229 assert_true(video.paused);
230 });
231 }, "Video should be frozen at duration");
232
233 // Test clipping where video length limits. Video should be frozen at end for
234 // remainder of duration.
235 timing_test(function() {
236 var video = getNextVideo();
237 at(0.0 * 1000, function() {
238 dt.play(createTestMediaReference(video, video.duration + 2));
239 });
240 // We can't use video.duration here because the video isn't yet loaded.
241 at(expectedVideoLength + 1, function() {
242 assert_equals(video.currentTime, video.duration);
243 assert_true(video.paused);
244 });
245 // We can't use video.duration here because the video isn't yet loaded.
246 at(expectedVideoLength + 2, function() {
247 assert_equals(video.currentTime, video.duration);
248 assert_true(video.paused);
249 });
250 }, "Video should be frozen at end");
251
252 // Test fill with duration limiting. Video should be frozen at end of
253 // duration.
254 timing_test(function() {
255 var video = getNextVideo();
256 at(0.0 * 1000, function() {
257 dt.play(createTestMediaReference(video, 1.0));
258 });
259 at(2.0 * 1000, function() {
260 assert_equals(video.currentTime, 1.0);
261 assert_equals(video.paused, true);
262 });
263 }, "Should freeze video at duration for fill");
264
265 // Test fill with video length limiting. Video should be at end.
266 timing_test(function() {
267 var video = getNextVideo();
268 at(0.0 * 1000, function() {
269 dt.play(createTestMediaReference(video), video.duration + 1.0);
270 });
271 // We can't use video.duration here because the video isn't yet loaded.
272 at(expectedVideoLength + 2, function() {
273 assert_equals(video.currentTime, video.duration);
274 });
275 }, "Should freeze video at end for fill");
276
277 // Test no fill. Video should be frozen at start.
278 timing_test(function() {
279 var video = getNextVideo();
280 at(0.0 * 1000, function() {
281 dt.play(createTestMediaReference(video, {fill: "none"}));
282 });
283 // We can't use video.duration here because the video isn't yet loaded.
284 at(expectedVideoLength + 1, function() {
285 assert_equals(video.currentTime, 0);
286 assert_equals(video.paused, true);
287 });
288 }, "Should freeze video at start for no fill");
289
290 // Test iterations.
291 timing_test(function() {
292 var video = getNextVideo();
293 at(0.0 * 1000, function() {
294 dt.play(createTestMediaReference(video,
295 {iterations: 2.0, duration: 1.0 * 1000}));
296 });
297 at(1.5 * 1000, function() {
298 assert_equals(video.currentTime, 0.5);
299 });
300 }, "Video should respect iterations");
301
302 // Test iterationStart.
303 timing_test(function() {
304 var video = getNextVideo();
305 at(0.0 * 1000, function() {
306 dt.play(createTestMediaReference(video,
307 {iterationStart: 0.5, duration: 2.0 * 1000}));
308 });
309 at(0.5 * 1000, function() {
310 assert_equals(video.currentTime, 1.5);
311 });
312 }, "Video should respect iterationStart");
313
314 // Test playback rate.
315 timing_test(function() {
316 var video = getNextVideo();
317 at(0.0 * 1000, function() {
318 dt.play(createTestMediaReference(video, {playbackRate: 2.0}));
319 });
320 at(1.0 * 1000, function() {
321 assert_equals(video.currentTime, 2.0);
322 assert_equals(video.playbackRate, 2.0);
323 });
324 }, "Video should respect playbackRate");
325
326 // Test heirachy of playback rates.
327 timing_test(function() {
328 var video = getNextVideo();
329 at(0.0 * 1000, function() {
330 dt.play(new AnimationGroup([createTestMediaReference(video, {playbackRate: 1 .5})],
331 {playbackRate: 2.5}));
332 });
333 at(1.0 * 1000, function() {
334 assert_equals(video.currentTime, 3.75);
335 assert_equals(video.playbackRate, 3.75);
336 });
337 }, "Video should respect playbackRate heirachy");
338
339 // Test interaction with MediaElement.defaultPlaybackRate.
340 timing_test(function() {
341 var video = getNextVideo();
342 at(0.0 * 1000, function() {
343 video.defaultPlaybackRate = 2.5;
344 dt.play(createTestMediaReference(video, {playbackRate: 1.5}));
345 });
346 at(1.0 * 1000, function() {
347 assert_equals(video.currentTime, 3.75);
348 assert_equals(video.playbackRate, 3.75);
349 });
350 }, "Video should respect playbackRate after setting defaultPlaybackRate");
351
352 // Test reversing.
353 timing_test(function() {
354 var video = getNextVideo();
355 at(0.0 * 1000, function() {
356 dt.play(createTestMediaReference(video, {direction: "reverse"}));
357 });
358 at(1.0 * 1000, function() {
359 assert_approx_equals(video.currentTime, video.duration - 1.0, 0.0001);
360 assert_equals(video.playbackRate, -1.0);
361 });
362 }, "Video should respect reversing");
363
364 // Test negative playback rate.
365 timing_test(function() {
366 var video = getNextVideo();
367 at(0.0 * 1000, function() {
368 dt.play(createTestMediaReference(video, {playbackRate: -0.5}));
369 });
370 at(1.0 * 1000, function() {
371 assert_approx_equals(video.currentTime, video.duration - 0.5, 0.0001);
372 assert_equals(video.playbackRate, -0.5);
373 });
374 }, "Video should respect negative playbackRate");
375
376 // Test interaction of reversing and playback rate.
377 timing_test(function() {
378 var video = getNextVideo();
379 at(0.0 * 1000, function() {
380 dt.play(new AnimationGroup(
381 [createTestMediaReference(video, {playbackRate: -0.5})],
382 {playbackRate: 3.0, direction: "reverse"}));
383 });
384 at(1.0 * 1000, function() {
385 assert_equals(video.currentTime, 1.5);
386 assert_equals(video.playbackRate, 1.5);
387 });
388 }, "Video should respect reversing and playbackRate");
389
390 // Test zero duration.
391 timing_test(function() {
392 var video = getNextVideo();
393 at(0.0 * 1000, function() {
394 dt.play(createTestMediaReference(video, 0.0));
395 assert_equals(video.currentTime, 0.0);
396 });
397 at(1.0 * 1000, function() {
398 assert_equals(video.currentTime, 0.0);
399 });
400 }, "Video should start at time zero when duration is zero");
401
402 // Test zero intrinsic duration.
403 // TODO: Need to find a zero length video.
404
405 // Test that media elements are removed from their MediaController.
406 timing_test(function() {
407 var video = getNextVideo();
408 at(0.0 * 1000, function() {
409 video.controller = new MediaController();
410 dt.play(createTestMediaReference(video));
411 assert_equals(video.controller, null);
412 });
413 // Seeking the video will throw if the controller has not been detached.
414 at(1.0 * 1000, function() {
415 assert_equals(video.currentTime, 1.0);
416 });
417 }, "Video should be detached from controller when used in MediaReference");
418
419 // Test limited seek ranges.
420 // TODO: Need to find a video with limited seek ranges.
421
422 // Test that video is paused when its MediaReference is detached from its
423 // AnimationPlayer.
424 timing_test(function() {
425 var video = getNextVideo();
426 var player;
427 at(0.0 * 1000, function() {
428 player = dt.play(createTestMediaReference(video));
429 });
430 at(1.0 * 1000, function() {
431 assert_false(video.paused);
432 player.source = null;
433 });
434 at(2.0 * 1000, function() {
435 assert_true(video.paused);
436 });
437 }, "Video should be paused when MediaReference is detached from its AnimationPla yer");
438
439 </script>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698