Source/WebCore:
authorcommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 2 May 2019 21:43:25 +0000 (21:43 +0000)
committercommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 2 May 2019 21:43:25 +0000 (21:43 +0000)
WebVTT: fix vertical cue alignment.
https://bugs.webkit.org/show_bug.cgi?id=136627.
<rdar://problem/49725538>

Patch by Gary Katsevman <git@gkatsev.com> on 2019-05-02
Reviewed by Eric Carlson.

Updated existing test results.

* html/track/VTTCue.cpp:
(WebCore::VTTCueBox::applyCSSProperties):

LayoutTests:
WebVTT: vertical cue text alignment is the wrong way around
https://bugs.webkit.org/show_bug.cgi?id=136627
<rdar://problem/49725538>

Patch by Gary Katsevman <git@gkatsev.com> on 2019-05-02
Reviewed by Eric Carlson.

* platform/ios/media/track/track-cue-rendering-vertical-expected.txt:
* platform/mac/TestExpectations: Unskipped test.
* platform/mac/media/track/track-cue-rendering-vertical-expected.png: Removed.
* platform/mac/media/track/track-cue-rendering-vertical-expected.txt:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@244891 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog
LayoutTests/platform/ios/media/track/track-cue-rendering-vertical-expected.txt
LayoutTests/platform/mac/TestExpectations
LayoutTests/platform/mac/media/track/track-cue-rendering-vertical-expected.png [deleted file]
LayoutTests/platform/mac/media/track/track-cue-rendering-vertical-expected.txt
Source/WebCore/ChangeLog
Source/WebCore/html/track/VTTCue.cpp

index 1ae12ac..b22ab65 100644 (file)
@@ -1,3 +1,16 @@
+2019-05-02  Gary Katsevman  <git@gkatsev.com>
+
+        WebVTT: vertical cue text alignment is the wrong way around
+        https://bugs.webkit.org/show_bug.cgi?id=136627
+        <rdar://problem/49725538>
+
+        Reviewed by Eric Carlson.
+
+        * platform/ios/media/track/track-cue-rendering-vertical-expected.txt:
+        * platform/mac/TestExpectations: Unskipped test.
+        * platform/mac/media/track/track-cue-rendering-vertical-expected.png: Removed.
+        * platform/mac/media/track/track-cue-rendering-vertical-expected.txt:
+
 2019-05-02  Truitt Savell  <tsavell@apple.com>
 
         [ Sierra Release WK2 ] Layout Test fast/workers/worker-cloneport.html is flaky
index 9a253cf..27acaf4 100644 (file)
@@ -24,38 +24,38 @@ layer at (8,8) size 320x240 scrollHeight 290
   RenderFlexibleBox {DIV} at (0,0) size 320x240
 layer at (8,8) size 320x240
   RenderBlock (relative positioned) {DIV} at (0,0) size 320x240 [color=#FFFFFF]
-layer at (19,8) size 19x240
-  RenderBlock (positioned) {DIV} at (11,0) size 19x240
+layer at (305,8) size 19x240
+  RenderBlock (positioned) {DIV} at (297,0) size 19x240
     RenderBlock {DIV} at (4,64) size 15x112
       RenderInline {SPAN} at (0,0) size 15x111 [bgcolor=#000000CC]
         RenderText {#text} at (0,0) size 15x111
           text run at (0,0) width 111: "Cue 1: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
-layer at (49,8) size 19x240
-  RenderBlock (positioned) {DIV} at (41,0) size 19x240
+layer at (275,8) size 19x240
+  RenderBlock (positioned) {DIV} at (267,0) size 19x240
     RenderBlock {DIV} at (4,64) size 15x112
       RenderInline {SPAN} at (0,0) size 15x111 [bgcolor=#000000CC]
         RenderText {#text} at (0,0) size 15x111
           text run at (0,0) width 111: "Cue 2: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
-layer at (264,8) size 19x240
-  RenderBlock (positioned) {DIV} at (256,0) size 19x240
+layer at (250,8) size 19x240
+  RenderBlock (positioned) {DIV} at (242,0) size 19x240
     RenderBlock {DIV} at (4,64) size 15x112
       RenderInline {SPAN} at (0,0) size 15x111 [bgcolor=#000000CC]
         RenderText {#text} at (0,0) size 15x111
           text run at (0,0) width 111: "Cue 3: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
-layer at (234,8) size 19x240
-  RenderBlock (positioned) {DIV} at (226,0) size 19x240
+layer at (220,8) size 19x240
+  RenderBlock (positioned) {DIV} at (212,0) size 19x240
     RenderBlock {DIV} at (4,64) size 15x112
       RenderInline {SPAN} at (0,0) size 15x111 [bgcolor=#000000CC]
         RenderText {#text} at (0,0) size 15x111
           text run at (0,0) width 111: "Cue 4: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
-layer at (298,8) size 19x240
-  RenderBlock (positioned) {DIV} at (290,0) size 19x240
+layer at (13,8) size 19x240
+  RenderBlock (positioned) {DIV} at (5,0) size 19x240
     RenderBlock {DIV} at (0,64) size 15x112
       RenderInline {SPAN} at (0,0) size 15x111 [bgcolor=#000000CC]
         RenderText {#text} at (0,0) size 15x111
           text run at (0,0) width 111: "Cue 5: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
-layer at (208,8) size 19x240
-  RenderBlock (positioned) {DIV} at (200,0) size 19x240
+layer at (43,8) size 19x240
+  RenderBlock (positioned) {DIV} at (35,0) size 19x240
     RenderBlock {DIV} at (0,64) size 15x112
       RenderInline {SPAN} at (0,0) size 15x111 [bgcolor=#000000CC]
         RenderText {#text} at (0,0) size 15x111
index 59c82e5..93b4fc5 100644 (file)
@@ -791,7 +791,6 @@ webkit.org/b/115048 media/media-element-play-after-eos.html [ Pass Timeout ]
 webkit.org/b/116277 media/video-buffered.html [ Pass Failure ]
 webkit.org/b/121803 media/video-object-fit-change.html [ Pass ImageOnlyFailure ]
 webkit.org/b/121803 media/video-object-fit.html [ Pass ImageOnlyFailure ]
-webkit.org/b/122021 media/track/track-cue-rendering-vertical.html [ Failure ]
 webkit.org/b/122033 media/video-duration-known-after-eos.html [ Pass Timeout ]
 webkit.org/b/122042 media/media-controller-playback.html [ Pass Timeout ]
 webkit.org/b/122126 media/click-volume-bar-not-pausing.html [ Pass Timeout ]
diff --git a/LayoutTests/platform/mac/media/track/track-cue-rendering-vertical-expected.png b/LayoutTests/platform/mac/media/track/track-cue-rendering-vertical-expected.png
deleted file mode 100644 (file)
index f440fcc..0000000
Binary files a/LayoutTests/platform/mac/media/track/track-cue-rendering-vertical-expected.png and /dev/null differ
index 599a540..a3f7688 100644 (file)
@@ -6,51 +6,59 @@ layer at (0,0) size 800x332
       RenderBlock (anonymous) at (0,0) size 784x244
         RenderText {#text} at (0,0) size 0x0
       RenderBlock {DIV} at (0,244) size 784x72
-        RenderText {#text} at (0,0) size 368x18
-          text run at (0,0) width 368: "Rendering vertical line-positioned cues with Japanese text."
-        RenderBR {BR} at (368,0) size 0x18
-        RenderText {#text} at (0,18) size 162x18
-          text run at (0,18) width 162: "EVENT(canplaythrough)"
-        RenderBR {BR} at (162,18) size 0x18
+        RenderText {#text} at (0,0) size 377x18
+          text run at (0,0) width 377: "Rendering vertical line-positioned cues with Japanese text."
+        RenderBR {BR} at (376,0) size 1x18
+        RenderText {#text} at (0,18) size 163x18
+          text run at (0,18) width 163: "EVENT(canplaythrough)"
+        RenderBR {BR} at (162,18) size 1x18
         RenderText {#text} at (0,36) size 107x18
           text run at (0,36) width 107: "EVENT(seeked)"
-        RenderBR {BR} at (107,36) size 0x18
-        RenderText {#text} at (0,54) size 102x18
-          text run at (0,54) width 102: "END OF TEST"
-        RenderBR {BR} at (102,54) size 0x18
+        RenderBR {BR} at (106,36) size 1x18
+        RenderText {#text} at (0,54) size 100x18
+          text run at (0,54) width 100: "END OF TEST"
+        RenderBR {BR} at (99,54) size 1x18
 layer at (8,8) size 320x240
   RenderVideo {VIDEO} at (0,0) size 320x240
 layer at (8,8) size 320x240
   RenderFlexibleBox {DIV} at (0,0) size 320x240
 layer at (8,8) size 320x240
   RenderBlock (relative positioned) {DIV} at (0,0) size 320x240 [color=#FFFFFF]
-layer at (8,8) size 14x240
-  RenderBlock (positioned) {DIV} at (0,0) size 14x240
-    RenderInline {SPAN} at (0,0) size 14x112 [bgcolor=#000000CC]
-      RenderText {#text} at (0,64) size 14x112
-        text run at (0,64) width 111: "Cue 1: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
-layer at (22,8) size 14x240
-  RenderBlock (positioned) {DIV} at (14,0) size 14x240
-    RenderInline {SPAN} at (0,0) size 14x112 [bgcolor=#000000CC]
-      RenderText {#text} at (0,64) size 14x112
-        text run at (0,64) width 111: "Cue 2: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
-layer at (272,8) size 14x240
-  RenderBlock (positioned) {DIV} at (264,0) size 14x240
-    RenderInline {SPAN} at (0,0) size 14x112 [bgcolor=#000000CC]
-      RenderText {#text} at (0,64) size 14x112
-        text run at (0,64) width 111: "Cue 3: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
-layer at (258,8) size 14x240
-  RenderBlock (positioned) {DIV} at (250,0) size 14x240
-    RenderInline {SPAN} at (0,0) size 14x112 [bgcolor=#000000CC]
-      RenderText {#text} at (0,64) size 14x112
-        text run at (0,64) width 111: "Cue 4: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
-layer at (314,8) size 14x240
-  RenderBlock (positioned) {DIV} at (306,0) size 14x240
-    RenderInline {SPAN} at (0,0) size 14x112 [bgcolor=#000000CC]
-      RenderText {#text} at (0,64) size 14x112
-        text run at (0,64) width 111: "Cue 5: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
-layer at (300,8) size 14x240
-  RenderBlock (positioned) {DIV} at (292,0) size 14x240
-    RenderInline {SPAN} at (0,0) size 14x112 [bgcolor=#000000CC]
-      RenderText {#text} at (0,64) size 14x112
-        text run at (0,64) width 111: "Cue 6: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
+layer at (306,8) size 18x240
+  RenderBlock (positioned) {DIV} at (298,0) size 18x240
+    RenderBlock {DIV} at (4,64) size 14x112
+      RenderInline {SPAN} at (0,0) size 14x111 [bgcolor=#000000CC]
+        RenderText {#text} at (0,0) size 14x111
+          text run at (0,0) width 111: "Cue 1: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
+layer at (278,8) size 18x240
+  RenderBlock (positioned) {DIV} at (270,0) size 18x240
+    RenderBlock {DIV} at (4,64) size 14x112
+      RenderInline {SPAN} at (0,0) size 14x111 [bgcolor=#000000CC]
+        RenderText {#text} at (0,0) size 14x111
+          text run at (0,0) width 111: "Cue 2: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
+layer at (248,8) size 18x240
+  RenderBlock (positioned) {DIV} at (240,0) size 18x240
+    RenderBlock {DIV} at (4,64) size 14x112
+      RenderInline {SPAN} at (0,0) size 14x111 [bgcolor=#000000CC]
+        RenderText {#text} at (0,0) size 14x111
+          text run at (0,0) width 111: "Cue 3: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
+layer at (220,8) size 18x240
+  RenderBlock (positioned) {DIV} at (212,0) size 18x240
+    RenderBlock {DIV} at (4,64) size 14x112
+      RenderInline {SPAN} at (0,0) size 14x111 [bgcolor=#000000CC]
+        RenderText {#text} at (0,0) size 14x111
+          text run at (0,0) width 111: "Cue 4: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
+layer at (20,8) size 18x240
+  RenderBlock (positioned) {DIV} at (12,0) size 18x240
+    RenderBlock {DIV} at (0,64) size 14x112
+      RenderInline {SPAN} at (0,0) size 14x111 [bgcolor=#000000CC]
+        RenderText {#text} at (0,0) size 14x111
+          text run at (0,0) width 111: "Cue 5: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
+layer at (48,8) size 18x240
+  RenderBlock (positioned) {DIV} at (40,0) size 18x240
+    RenderBlock {DIV} at (0,64) size 14x112
+      RenderInline {SPAN} at (0,0) size 14x111 [bgcolor=#000000CC]
+        RenderText {#text} at (0,0) size 14x111
+          text run at (0,0) width 111: "Cue 6: \x{79C1}\x{306F}\x{7ACB}\x{6D3E}\x{306A}\x{4EBA}"
+layer at (8,238) size 320x10
+  RenderButton {BUTTON} at (0,230) size 320x10
index 797f676..080e940 100644 (file)
@@ -1,3 +1,16 @@
+2019-05-02  Gary Katsevman  <git@gkatsev.com>
+
+        WebVTT: fix vertical cue alignment.
+        https://bugs.webkit.org/show_bug.cgi?id=136627.
+        <rdar://problem/49725538>
+
+        Reviewed by Eric Carlson.
+
+        Updated existing test results.
+
+        * html/track/VTTCue.cpp:
+        (WebCore::VTTCueBox::applyCSSProperties):
+
 2019-05-02  Don Olmstead  <don.olmstead@sony.com>
 
         [CMake] Refactor WEBKIT_MAKE_FORWARDING_HEADERS into WEBKIT_COPY_FILES
index b67ede7..10d5cc0 100644 (file)
@@ -178,7 +178,10 @@ void VTTCueBox::applyCSSProperties(const IntSize& videoSize)
     setInlineStyleProperty(CSSPropertyTop, position.second, CSSPrimitiveValue::CSS_PERCENTAGE);
 
     // the 'left' property must be set to left
-    setInlineStyleProperty(CSSPropertyLeft, position.first, CSSPrimitiveValue::CSS_PERCENTAGE);
+    if (cue->vertical() == horizontalKeyword())
+        setInlineStyleProperty(CSSPropertyLeft, position.first, CSSPrimitiveValue::CSS_PERCENTAGE);
+    else if (cue->vertical() == verticalGrowingRightKeyword())
+        setInlineStyleProperty(CSSPropertyLeft, makeString("calc(-", FormattedNumber::fixedWidth(videoSize.width(), 2), "px - ", FormattedNumber::fixedWidth(cue->getCSSSize(), 2), "px)"));
 
     double authorFontSize = std::min(videoSize.width(), videoSize.height()) * DEFAULTCAPTIONFONTSIZEPERCENTAGE / 100.0;
     double multiplier = 1.0;