Bug 1555849 - part2 : enable wpt 'track-webvtt-non-snap-to-lines.html'. r=heycam

We made following changes for 'track-webvtt-non-snap-to-lines.html'.

1. As the video is 300*150, testing file would put the cue on the place which is 20% of video's height (30px) below.
2. The font size is defined as 5% of video's height (7.5px).
3. As the cue is left alignment, so we also have to set `left=0`.
4. In addition, there is no need to add padding.

In addition, this test would fail on Windows because there is a weird green background showing on the top of the text [1].

[1] https://hg.mozilla.org/mozilla-central/raw-file/tip/layout/tools/reftest/reftest-analyzer.xhtml#logurl=https://queue.taskcluster.net/v1/task/NdZrHNWqTAiskV8QOcBFNA/runs/0/artifacts/public/logs/live_backing.log&only_show_unexpected=1

Differential Revision: https://phabricator.services.mozilla.com/D33237

--HG--
extra : moz-landing-system : lando

testing/web-platform/meta/html/semantics/embedded-content/media-elements/track/track-element/track-webvtt-non-snap-to-lines.html.ini

@@ -1,2 +1,3 @@
 [track-webvtt-non-snap-to-lines.html]
-  expected: FAIL
+  expected:
+    if (os == "win"): FAIL #Bug 1555849

testing/web-platform/tests/html/semantics/embedded-content/media-elements/track/track-element/track-webvtt-non-snap-to-lines-ref.html

@@ -10,12 +10,12 @@
 }
 .cue {
   position: absolute;
-  top: 48px;
+  top: 30px;
+  left: 0px;
   font-family: sans-serif;
   background: green;
   color: rgba(255, 255, 255, 1);
-  font-size: 12px;
-  padding: 0px 2px;
+  font-size: 7.5px;
 }
 </style>
 <div class="container">
@@ -26,4 +26,4 @@
   </video>
   <span class="cue">Bear is Coming!!!!!</span>
 </div>
-</html>
+</html>

testing/web-platform/tests/html/semantics/embedded-content/media-elements/track/track-element/track-webvtt-non-snap-to-lines.html

@@ -21,4 +21,4 @@ track.addCue(cue);
 track.mode = "showing";
 video.src = getVideoURI("/media/test");
 </script>
-</html>
+</html>