WebVTT: Update cue alignment to a later spec. version

LayoutTests/media/track/track-cue-rendering-position-auto-rtl-expected.html

Index: LayoutTests/media/track/track-cue-rendering-position-auto-rtl-expected.html
diff --git a/LayoutTests/media/track/track-cue-rendering-position-auto-expected.html b/LayoutTests/media/track/track-cue-rendering-position-auto-rtl-expected.html
similarity index 75%
copy from LayoutTests/media/track/track-cue-rendering-position-auto-expected.html
copy to LayoutTests/media/track/track-cue-rendering-position-auto-rtl-expected.html
index 40ba31560545441d951e6dd12e42ccb0eaca6ec8..3971674ccd6c976123a8d15975d1172b92b43111 100644
--- a/LayoutTests/media/track/track-cue-rendering-position-auto-expected.html
+++ b/LayoutTests/media/track/track-cue-rendering-position-auto-rtl-expected.html
@@ -18,13 +18,15 @@ var mediaFile = findMediaFile('video', '../content/test');
     overflow: hidden;
 }
 .cue.start {
-    text-align: start;
+    right: 50%;

[philipj_slow, 2015/01/22 15:27:59]

The input here was { align: 'start', size: 50, line: 0 } but I'm unable to
convince myself that this is correct. position is auto and align is start, and
so the computed text position should be 0, but this and the expectations seem to
say 50, in line with the old way before position auto. I'm probably just
confused about where we are in this patch series, why does this make sense?

[philipj_slow, 2015/01/22 15:44:24]

I'm just confused. The resulting box in which to position the text has left:0
and width:50% so it's expected that RTL text will end up aligned against the
middle. This is exactly what we wanted when we changed the spec, so that text
directionality doesn't change the part of the screen which may be occupied.

+    text-align: end;
 }
 .cue.middle {
     text-align: center;
 }
 .cue.end {
-    text-align: end;
+    left: 50%;
+    text-align: start;
 }
 .cue > span {
     font-family: sans-serif;
@@ -36,13 +38,13 @@ var mediaFile = findMediaFile('video', '../content/test');
 </style>
 <div class="container">
   <video><script>document.currentScript.parentNode.src = mediaFile;</script></video>
-  <div class=video><div class="cue start"><span>XXX</span></div></div>
+  <div class=video><div class="cue start"><span>&#x5d0;&#x5d1;&#x5d2;</span></div></div>
 </div>
 <div class="container">
   <video><script>document.currentScript.parentNode.src = mediaFile;</script></video>
-  <div class=video><div class="cue middle"><span>XXX</span></div></div>
+  <div class=video><div class="cue middle"><span>&#x5d0;&#x5d1;&#x5d2;</span></div></div>
 </div>
 <div class="container">
   <video><script>document.currentScript.parentNode.src = mediaFile;</script></video>
-  <div class=video><div class="cue end"><span>XXX</span></div></div>
+  <div class=video><div class="cue end"><span>&#x5d0;&#x5d1;&#x5d2;</span></div></div>
 </div>