 Chromium Code Reviews
 Chromium Code Reviews Issue 1854553003:
  Convert webvtt regions tests from video-test.js to testharness.js based  (Closed) 
  Base URL: https://chromium.googlesource.com/chromium/src.git@master
    
  
    Issue 1854553003:
  Convert webvtt regions tests from video-test.js to testharness.js based  (Closed) 
  Base URL: https://chromium.googlesource.com/chromium/src.git@master| Index: third_party/WebKit/LayoutTests/media/track/regions-webvtt/vtt-region-display.html | 
| diff --git a/third_party/WebKit/LayoutTests/media/track/regions-webvtt/vtt-region-display.html b/third_party/WebKit/LayoutTests/media/track/regions-webvtt/vtt-region-display.html | 
| index 22dc53c377cbd827e6a62f60755f629612f602ed..35d3c6abacb82a0136772cb5abc838253683099d 100644 | 
| --- a/third_party/WebKit/LayoutTests/media/track/regions-webvtt/vtt-region-display.html | 
| +++ b/third_party/WebKit/LayoutTests/media/track/regions-webvtt/vtt-region-display.html | 
| @@ -1,112 +1,75 @@ | 
| <!DOCTYPE html> | 
| -<html> | 
| - <head> | 
| - <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | 
| - | 
| - <script src=../../media-controls.js></script> | 
| - <script src=../../media-file.js></script> | 
| - <!-- TODO(philipj): Convert test to testharness.js. crbug.com/588956 | 
| - (Please avoid writing new tests using video-test.js) --> | 
| - <script src=../../video-test.js></script> | 
| - <script> | 
| - var testTrack; | 
| - var region; | 
| - var container; | 
| - var totalVisibleLines; | 
| - | 
| - var seekTimes = [0.2, 0.5, 1.0, 2.3, 3.0]; | 
| - var crtSeekTime = 0; | 
| - | 
| - function countVisibleLines(cueElement) | 
| - { | 
| - var cueRect = cueElement.getBoundingClientRect(); | 
| - var regionRect = region.getBoundingClientRect(); | 
| - | 
| - var linesMatch = cueElement.textContent.match(/\n/g); | 
| - var linesCount = 1 + (linesMatch == null ? 0 : linesMatch.length); | 
| - var lineHeight = cueRect.height / linesCount; | 
| - | 
| - var visibleLines = 0; | 
| - for (i = 0; i < linesCount; ++i) { | 
| - var lineTop = cueRect.top + i * lineHeight; | 
| - var lineBottom = cueRect.top + (i+1) * lineHeight; | 
| - | 
| - if (lineTop >= regionRect.top && lineBottom <= regionRect.bottom) | 
| - visibleLines++; | 
| - } | 
| - | 
| - return visibleLines; | 
| - } | 
| - | 
| - function testRegionsDisplay() | 
| - { | 
| - video.removeEventListener('canplaythrough', testRegionsDisplay); | 
| - | 
| - testTrack = video.textTracks[0]; | 
| - | 
| - consoleWrite("** The text track has only one region **"); | 
| - testExpected("testTrack.regions.length", 1); | 
| - | 
| - try { | 
| - region = textTrackDisplayElement(video, 'region'); | 
| - container = textTrackDisplayElement(video, 'region-container'); | 
| - } catch(e) { | 
| - consoleWrite(e); | 
| - } | 
| - | 
| - consoleWrite("<br>** Inspecting cues displayed within region**"); | 
| - | 
| - waitForEvent("seeked", inspectRegionTree); | 
| - seekVideo(); | 
| - } | 
| - | 
| - function seekVideo() | 
| - { | 
| - consoleWrite(""); | 
| - run("video.currentTime = " + seekTimes[crtSeekTime++]); | 
| - } | 
| - | 
| - function inspectRegionTree() | 
| - { | 
| - consoleWrite("Total cues in region: " + container.children.length); | 
| - totalVisibleLines = 0; | 
| - | 
| - for (var i = 0; i < container.children.length; ++i) { | 
| - var cue = container.children[i]; | 
| - var cueVisibleLines = countVisibleLines(cue); | 
| - consoleWrite("Cue content is: " + cue.textContent); | 
| - consoleWrite("Cue lines visible from this cue: " + cueVisibleLines); | 
| - | 
| - totalVisibleLines += cueVisibleLines; | 
| - } | 
| - | 
| - testExpected("totalVisibleLines <= testTrack.regions[0].height", true); | 
| - | 
| - if (crtSeekTime == seekTimes.length) | 
| - endTest(); | 
| - else | 
| - seekVideo(); | 
| - } | 
| - | 
| - function startTest() | 
| - { | 
| - if (!window.VTTRegion) { | 
| - failTest(); | 
| - return; | 
| - } | 
| - | 
| - findMediaElement(); | 
| - | 
| - video.src = findMediaFile('video', '../../content/test'); | 
| - video.addEventListener('canplaythrough', testRegionsDisplay); | 
| - } | 
| - | 
| - </script> | 
| - </head> | 
| - <body> | 
| - <p>Tests default rendering for TextTrackCues that belong to a VTTRegion.</p> | 
| - <video controls> | 
| - <track src="../captions-webvtt/captions-regions.vtt" kind="captions" default onload="startTest()"> | 
| - </video> | 
| - </body> | 
| -</html> | 
| +<title>Tests default rendering for TextTrackCues that belong to a VTTRegion.</title> | 
| +<script src="../../media-controls.js"></script> | 
| +<script src="../../media-file.js"></script> | 
| +<script src="../../../resources/testharness.js"></script> | 
| +<script src="../../../resources/testharnessreport.js"></script> | 
| +<video controls></video> | 
| +<script> | 
| +var testTrack; | 
| +var region; | 
| +var container; | 
| +var totalVisibleLines; | 
| + | 
| +var seekTimes = [0.2, 0.5, 1.0, 2.3, 3.0]; | 
| +var crtSeekTime = 0; | 
| 
philipj_slow
2016/04/06 12:40:04
Based on how it's used I guess this means "current
 
Srirama
2016/04/07 10:40:07
Done.
 | 
| + | 
| +function countVisibleLines(cueElement) | 
| +{ | 
| + var cueRect = cueElement.getBoundingClientRect(); | 
| + var regionRect = region.getBoundingClientRect(); | 
| + | 
| + var linesMatch = cueElement.textContent.match(/\n/g); | 
| + var linesCount = 1 + (linesMatch == null ? 0 : linesMatch.length); | 
| + var lineHeight = cueRect.height / linesCount; | 
| + | 
| + var visibleLines = 0; | 
| + for (i = 0; i < linesCount; ++i) { | 
| + var lineTop = cueRect.top + i * lineHeight; | 
| + var lineBottom = cueRect.top + (i+1) * lineHeight; | 
| + | 
| + if (lineTop >= regionRect.top && lineBottom <= regionRect.bottom) | 
| + visibleLines++; | 
| + } | 
| + | 
| + return visibleLines; | 
| +} | 
| + | 
| +async_test(function() { | 
| + var video = document.querySelector('video'); | 
| + video.src = findMediaFile('video', '../../content/test'); | 
| + var testTrack = document.createElement('track'); | 
| + testTrack.onload = this.step_func(function() { | 
| 
Srirama
2016/04/01 12:14:23
Not able to use var 't' here so i removed it every
 
philipj_slow
2016/04/06 12:19:40
It looks like you're just missing a "t" above, try
 
Srirama
2016/04/07 10:40:07
Because of this issue i have removed 't' from ever
 
philipj_slow
2016/04/07 11:07:39
That sounds weird, why couldn't you use t below? F
 
Srirama
2016/04/07 11:15:52
Don't know the exact reason, all other test cases
 | 
| + video.addEventListener('canplaythrough', this.step_func(function() { | 
| + video.removeEventListener('canplaythrough', this); | 
| 
philipj_slow
2016/04/06 12:40:04
I don't think this is the callback here, is it? ar
 
Srirama
2016/04/07 10:40:07
Done.
 | 
| + track = video.textTracks[0]; | 
| + | 
| + assert_equals(track.regions.length, 1); | 
| + | 
| + region = textTrackDisplayElement(video, 'region'); | 
| + container = textTrackDisplayElement(video, 'region-container'); | 
| + | 
| + video.onseeked = this.step_func(function() { | 
| + totalVisibleLines = 0; | 
| + | 
| + for (var i = 0; i < container.children.length; ++i) { | 
| + var cue = container.children[i]; | 
| + totalVisibleLines += countVisibleLines(cue);; | 
| + } | 
| + | 
| + assert_less_than_equal(totalVisibleLines, track.regions[0].height); | 
| + | 
| + if (crtSeekTime == seekTimes.length) | 
| + this.done(); | 
| + else | 
| + video.currentTime = seekTimes[crtSeekTime++]; | 
| + }); | 
| + video.currentTime = seekTimes[crtSeekTime++]; | 
| + })); | 
| + }); | 
| + testTrack.src = '../captions-webvtt/captions-regions.vtt'; | 
| + testTrack.kind = 'captions'; | 
| + testTrack.default = true; | 
| + video.appendChild(testTrack); | 
| +}); | 
| +</script> |