| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <html> | 2 <html> |
| 3 <title>Test visibiblity of controls when focusing of <video></title> | 3 <title>Test visibiblity of controls when focusing of <video></title> |
| 4 <script src=video-test.js></script> | 4 <script src=video-test.js></script> |
| 5 <script src=media-controls.js></script> | 5 <script src=media-controls.js></script> |
| 6 <p> | 6 <p> |
| 7 Test that video controls re-appear when the media (<video>) element is focuse
d. | 7 Test that video controls re-appear when the media (<video>) element is focuse
d. |
| 8 </p> | 8 </p> |
| 9 <video controls autoplay src="content/test.ogv"></video> | 9 <video controls autoplay src="content/test.ogv"></video> |
| 10 <script> | 10 <script> |
| 11 var controls; | 11 var controls; |
| 12 var waitingForFade = false; | 12 var video = document.querySelector("video"); |
| 13 var fadeinTime = 300; | |
| 14 | 13 |
| 15 document.querySelector("video").addEventListener("timeupdate", function(event) | 14 video.addEventListener("playing", function() |
| 16 { | 15 { |
| 17 var video = event.target; | 16 runAfterControlsHidden(function() |
| 18 if (video.currentTime < 4 || waitingForFade) | 17 { |
| 19 return; | 18 controls = mediaControlsButton(video, "panel"); |
| 20 controls = mediaControlsButton(video, "panel"); | |
| 21 | 19 |
| 22 testExpected("getComputedStyle(controls).opacity", 0); | 20 testExpected("getComputedStyle(controls).opacity", 0); |
| 23 | 21 |
| 24 video.focus(); | 22 video.focus(); |
| 25 | 23 |
| 26 waitingForFade = true; | 24 setTimeout(function() |
| 27 setTimeout(function() { | 25 { |
| 28 testExpected("getComputedStyle(controls).opacity", 1); | 26 testExpected("getComputedStyle(controls).opacity", 1); |
| 29 | 27 |
| 30 consoleWrite(""); | 28 consoleWrite(""); |
| 31 endTest(); | 29 endTest(); |
| 32 }, fadeinTime); | 30 }, controlsFadeInDurationMs); |
| 31 }, video); |
| 33 }); | 32 }); |
| 34 | |
| 35 </script> | 33 </script> |
| OLD | NEW |