Title: [295194] branches/safari-613-branch
Revision
295194
Author
[email protected]
Date
2022-06-02 23:45:57 -0700 (Thu, 02 Jun 2022)

Log Message

Cherry-pick 706e3063ae33. rdar://problem/86832561

    [css-values-4] logical `*vi`(inline) and `*vb` (block) viewport units should be based on the current element's `writing-mode`
    https://bugs.webkit.org/show_bug.cgi?id=234373
    <rdar://problem/86832561>

    Reviewed by Tim Nguyen.

    Previously, we only looked at the root element's `writing-mode`. Looking at the current element's
    `writing-mode` allows for non-root elements to have a `writing-mode` independent of the root element,
    as well as having styles based on that. This was changed in <https://github.com/w3c/csswg-drafts/issues/6873>.

    Tests: CSSViewportUnits.AllSame
           CSSViewportUnits.MinimumViewportInsetWithWritingMode
           CSSViewportUnits.MaximumViewportInsetWithWritingMode
           CSSViewportUnits.EmptyUnobscuredSizeOverrides
           CSSViewportUnits.SameUnobscuredSizeOverrides
           CSSViewportUnits.DifferentUnobscuredSizeOverrides
           CSSViewportUnits.SVGDocument

    * Source/WebCore/css/CSSPrimitiveValue.cpp:
    (WebCore::lengthOfViewportPhysicalAxisForLogicalAxis):
    (WebCore::CSSPrimitiveValue::computeNonCalcLengthDouble):

    * Tools/TestWebKitAPI/Tests/WebKitCocoa/CSSViewportUnits.mm:
    (changeCSSPropertyOfElements): Added.
    (TEST.CSSViewportUnits.AllSame):
    (TEST.CSSViewportUnits.MinimumViewportInsetWithWritingMode):
    (TEST.CSSViewportUnits.MaximumViewportInsetWithWritingMode):
    (TEST.CSSViewportUnits.EmptyUnobscuredSizeOverrides):
    (TEST.CSSViewportUnits.SameUnobscuredSizeOverrides):
    (TEST.CSSViewportUnits.DifferentUnobscuredSizeOverrides):
    (TEST.CSSViewportUnits.SVGDocument):

    Canonical link: https://commits.webkit.org/250835@main
    git-svn-id: https://svn.webkit.org/repository/webkit/trunk@294609 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Modified Paths

Diff

Modified: branches/safari-613-branch/Source/WebCore/css/CSSPrimitiveValue.cpp (295193 => 295194)


--- branches/safari-613-branch/Source/WebCore/css/CSSPrimitiveValue.cpp	2022-06-03 06:45:54 UTC (rev 295193)
+++ branches/safari-613-branch/Source/WebCore/css/CSSPrimitiveValue.cpp	2022-06-03 06:45:57 UTC (rev 295194)
@@ -672,12 +672,12 @@
 static constexpr double cmPerInch = 2.54;
 static constexpr double QPerInch = 25.4 * 4.0;
 
-static double lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis logicalAxis, const FloatSize& size, const RenderStyle* rootElementStyle)
+static double lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis logicalAxis, const FloatSize& size, const RenderStyle* style)
 {
-    if (!rootElementStyle)
+    if (!style)
         return 0;
 
-    switch (mapLogicalAxisToPhysicalAxis(makeTextFlow(rootElementStyle->writingMode(), rootElementStyle->direction()), logicalAxis)) {
+    switch (mapLogicalAxisToPhysicalAxis(makeTextFlow(style->writingMode(), style->direction()), logicalAxis)) {
     case BoxAxis::Horizontal:
         return size.width();
 
@@ -849,10 +849,10 @@
         return value * conversionData.defaultViewportFactor().minDimension();
 
     case CSSUnitType::CSS_VB:
-        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Block, conversionData.defaultViewportFactor(), conversionData.rootStyle());
+        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Block, conversionData.defaultViewportFactor(), conversionData.style());
 
     case CSSUnitType::CSS_VI:
-        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Inline, conversionData.defaultViewportFactor(), conversionData.rootStyle());
+        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Inline, conversionData.defaultViewportFactor(), conversionData.style());
 
     case CSSUnitType::CSS_SVH:
         return value * conversionData.smallViewportFactor().height();
@@ -867,10 +867,10 @@
         return value * conversionData.smallViewportFactor().minDimension();
 
     case CSSUnitType::CSS_SVB:
-        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Block, conversionData.smallViewportFactor(), conversionData.rootStyle());
+        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Block, conversionData.smallViewportFactor(), conversionData.style());
 
     case CSSUnitType::CSS_SVI:
-        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Inline, conversionData.smallViewportFactor(), conversionData.rootStyle());
+        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Inline, conversionData.smallViewportFactor(), conversionData.style());
 
     case CSSUnitType::CSS_LVH:
         return value * conversionData.largeViewportFactor().height();
@@ -885,10 +885,10 @@
         return value * conversionData.largeViewportFactor().minDimension();
 
     case CSSUnitType::CSS_LVB:
-        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Block, conversionData.largeViewportFactor(), conversionData.rootStyle());
+        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Block, conversionData.largeViewportFactor(), conversionData.style());
 
     case CSSUnitType::CSS_LVI:
-        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Inline, conversionData.largeViewportFactor(), conversionData.rootStyle());
+        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Inline, conversionData.largeViewportFactor(), conversionData.style());
 
     case CSSUnitType::CSS_DVH:
         return value * conversionData.dynamicViewportFactor().height();
@@ -903,10 +903,10 @@
         return value * conversionData.dynamicViewportFactor().minDimension();
 
     case CSSUnitType::CSS_DVB:
-        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Block, conversionData.dynamicViewportFactor(), conversionData.rootStyle());
+        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Block, conversionData.dynamicViewportFactor(), conversionData.style());
 
     case CSSUnitType::CSS_DVI:
-        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Inline, conversionData.dynamicViewportFactor(), conversionData.rootStyle());
+        return value * lengthOfViewportPhysicalAxisForLogicalAxis(LogicalBoxAxis::Inline, conversionData.dynamicViewportFactor(), conversionData.style());
 
     case CSSUnitType::CSS_LHS:
         ASSERT(conversionData.style());

Modified: branches/safari-613-branch/Tools/TestWebKitAPI/Tests/WebKitCocoa/CSSViewportUnits.mm (295193 => 295194)


--- branches/safari-613-branch/Tools/TestWebKitAPI/Tests/WebKitCocoa/CSSViewportUnits.mm	2022-06-03 06:45:54 UTC (rev 295193)
+++ branches/safari-613-branch/Tools/TestWebKitAPI/Tests/WebKitCocoa/CSSViewportUnits.mm	2022-06-03 06:45:57 UTC (rev 295194)
@@ -55,6 +55,11 @@
     return heightOfElementWithID(webView, viewportUnit);
 }
 
+static void changeCSSPropertyOfElements(RetainPtr<TestWKWebView>& webView, NSString *selector, NSString *property, NSString *value)
+{
+    [webView objectByEvaluatingJavaScript:[NSString stringWithFormat:@"document.querySelectorAll('%@').forEach((element) => element.style['%@'] = %@)", selector, property, value]];
+}
+
 TEST(CSSViewportUnits, AllSame)
 {
     auto webView = adoptNS([[TestWKWebView alloc] initWithFrame:CGRectMake(0, 0, 320, 500)]);
@@ -133,7 +138,7 @@
         EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvi"));
     }
 
-    [webView objectByEvaluatingJavaScript:@"document.documentElement.style.writingMode = 'vertical-lr'"];
+    changeCSSPropertyOfElements(webView, @"body", @"writingMode", @"'vertical-lr'");
     [webView waitForNextPresentationUpdate];
 
     EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"vw"));
@@ -167,6 +172,41 @@
         EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvb"));
         EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvi"));
     }
+
+    changeCSSPropertyOfElements(webView, @"div", @"writingMode", @"'horizontal-tb'");
+    [webView waitForNextPresentationUpdate];
+
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"vw"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"vh"));
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"vmin"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"vmax"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"vb"));
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"vi"));
+
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"svw"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"svh"));
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"svmin"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"svmax"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"svb"));
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"svi"));
+
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"lvw"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"lvh"));
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"lvmin"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"lvmax"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"lvb"));
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"lvi"));
+
+    {
+        double fixedWidth = widthOfElementWithID(webView, @"fixed");
+        double fixedHeight = heightOfElementWithID(webView, @"fixed");
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvw"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvh"));
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvmin"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvmax"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvb"));
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvi"));
+    }
 }
 
 #if USE(APPKIT)
@@ -430,8 +470,7 @@
     [webView setMinimumViewportInset:CocoaEdgeInsetsMake(11, 21, 31, 41) maximumViewportInset:CocoaEdgeInsetsMake(12, 22, 32, 42)];
     [webView synchronouslyLoadTestPageNamed:@"CSSViewportUnits"];
 
-    [webView objectByEvaluatingJavaScript:@"document.documentElement.style.writingMode = 'vertical-lr'"];
-
+    changeCSSPropertyOfElements(webView, @"body", @"writingMode", @"'vertical-lr'");
     [webView waitForNextPresentationUpdate];
 
     EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"vw"));
@@ -465,6 +504,41 @@
         EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvb"));
         EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvi"));
     }
+
+    changeCSSPropertyOfElements(webView, @"div", @"writingMode", @"'horizontal-tb'");
+    [webView waitForNextPresentationUpdate];
+
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"vw"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"vh"));
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"vmin"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"vmax"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"vb"));
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"vi"));
+
+    EXPECT_FLOAT_EQ(256, viewportUnitLength(webView, @"svw"));
+    EXPECT_FLOAT_EQ(456, viewportUnitLength(webView, @"svh"));
+    EXPECT_FLOAT_EQ(256, viewportUnitLength(webView, @"svmin"));
+    EXPECT_FLOAT_EQ(456, viewportUnitLength(webView, @"svmax"));
+    EXPECT_FLOAT_EQ(456, viewportUnitLength(webView, @"svb"));
+    EXPECT_FLOAT_EQ(256, viewportUnitLength(webView, @"svi"));
+
+    EXPECT_FLOAT_EQ(258, viewportUnitLength(webView, @"lvw"));
+    EXPECT_FLOAT_EQ(458, viewportUnitLength(webView, @"lvh"));
+    EXPECT_FLOAT_EQ(258, viewportUnitLength(webView, @"lvmin"));
+    EXPECT_FLOAT_EQ(458, viewportUnitLength(webView, @"lvmax"));
+    EXPECT_FLOAT_EQ(458, viewportUnitLength(webView, @"lvb"));
+    EXPECT_FLOAT_EQ(258, viewportUnitLength(webView, @"lvi"));
+
+    {
+        double fixedWidth = widthOfElementWithID(webView, @"fixed");
+        double fixedHeight = heightOfElementWithID(webView, @"fixed");
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvw"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvh"));
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvmin"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvmax"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvb"));
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvi"));
+    }
 }
 
 TEST(CSSViewportUnits, MaximumViewportInsetWithWritingMode)
@@ -473,8 +547,7 @@
     [webView setMinimumViewportInset:CocoaEdgeInsetsZero maximumViewportInset:CocoaEdgeInsetsMake(12, 22, 32, 42)];
     [webView synchronouslyLoadTestPageNamed:@"CSSViewportUnits"];
 
-    [webView objectByEvaluatingJavaScript:@"document.documentElement.style.writingMode = 'vertical-lr'"];
-
+    changeCSSPropertyOfElements(webView, @"body", @"writingMode", @"'vertical-lr'");
     [webView waitForNextPresentationUpdate];
 
     EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"vw"));
@@ -508,6 +581,41 @@
         EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvb"));
         EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvi"));
     }
+
+    changeCSSPropertyOfElements(webView, @"div", @"writingMode", @"'horizontal-tb'");
+    [webView waitForNextPresentationUpdate];
+
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"vw"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"vh"));
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"vmin"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"vmax"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"vb"));
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"vi"));
+
+    EXPECT_FLOAT_EQ(256, viewportUnitLength(webView, @"svw"));
+    EXPECT_FLOAT_EQ(456, viewportUnitLength(webView, @"svh"));
+    EXPECT_FLOAT_EQ(256, viewportUnitLength(webView, @"svmin"));
+    EXPECT_FLOAT_EQ(456, viewportUnitLength(webView, @"svmax"));
+    EXPECT_FLOAT_EQ(456, viewportUnitLength(webView, @"svb"));
+    EXPECT_FLOAT_EQ(256, viewportUnitLength(webView, @"svi"));
+
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"lvw"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"lvh"));
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"lvmin"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"lvmax"));
+    EXPECT_FLOAT_EQ(500, viewportUnitLength(webView, @"lvb"));
+    EXPECT_FLOAT_EQ(320, viewportUnitLength(webView, @"lvi"));
+
+    {
+        double fixedWidth = widthOfElementWithID(webView, @"fixed");
+        double fixedHeight = heightOfElementWithID(webView, @"fixed");
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvw"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvh"));
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvmin"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvmax"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvb"));
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvi"));
+    }
 }
 
 TEST(CSSViewportUnits, MinimumViewportInsetWithFrame)
@@ -1021,7 +1129,7 @@
         EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvi"));
     }
 
-    [webView objectByEvaluatingJavaScript:@"document.documentElement.style.writingMode = 'vertical-lr'"];
+    changeCSSPropertyOfElements(webView, @"body", @"writingMode", @"'vertical-lr'");
     [webView waitForNextPresentationUpdate];
 
     EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"vw"));
@@ -1055,6 +1163,41 @@
         EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvb"));
         EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvi"));
     }
+
+    changeCSSPropertyOfElements(webView, @"div", @"writingMode", @"'horizontal-tb'");
+    [webView waitForNextPresentationUpdate];
+
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"vw"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"vh"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"vmin"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"vmax"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"vb"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"vi"));
+
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"svw"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"svh"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"svmin"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"svmax"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"svb"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"svi"));
+
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"lvw"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"lvh"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"lvmin"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"lvmax"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"lvb"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"lvi"));
+
+    {
+        double fixedWidth = widthOfElementWithID(webView, @"fixed");
+        double fixedHeight = heightOfElementWithID(webView, @"fixed");
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvw"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvh"));
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvmin"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvmax"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvb"));
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvi"));
+    }
 }
 
 TEST(CSSViewportUnits, SameUnobscuredSizeOverrides)
@@ -1132,7 +1275,7 @@
         EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvi"));
     }
 
-    [webView objectByEvaluatingJavaScript:@"document.documentElement.style.writingMode = 'vertical-lr'"];
+    changeCSSPropertyOfElements(webView, @"body", @"writingMode", @"'vertical-lr'");
     [webView waitForNextPresentationUpdate];
 
     EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"vw"));
@@ -1166,6 +1309,41 @@
         EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvb"));
         EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvi"));
     }
+
+    changeCSSPropertyOfElements(webView, @"div", @"writingMode", @"'horizontal-tb'");
+    [webView waitForNextPresentationUpdate];
+
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"vw"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"vh"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"vmin"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"vmax"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"vb"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"vi"));
+
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"svw"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"svh"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"svmin"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"svmax"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"svb"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"svi"));
+
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"lvw"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"lvh"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"lvmin"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"lvmax"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"lvb"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"lvi"));
+
+    {
+        double fixedWidth = widthOfElementWithID(webView, @"fixed");
+        double fixedHeight = heightOfElementWithID(webView, @"fixed");
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvw"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvh"));
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvmin"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvmax"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvb"));
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvi"));
+    }
 }
 
 TEST(CSSViewportUnits, DifferentUnobscuredSizeOverrides)
@@ -1243,7 +1421,7 @@
         EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvi"));
     }
 
-    [webView objectByEvaluatingJavaScript:@"document.documentElement.style.writingMode = 'vertical-lr'"];
+    changeCSSPropertyOfElements(webView, @"body", @"writingMode", @"'vertical-lr'");
     [webView waitForNextPresentationUpdate];
 
     EXPECT_FLOAT_EQ(30.5, viewportUnitLength(webView, @"vw"));
@@ -1277,6 +1455,41 @@
         EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvb"));
         EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvi"));
     }
+
+    changeCSSPropertyOfElements(webView, @"div", @"writingMode", @"'horizontal-tb'");
+    [webView waitForNextPresentationUpdate];
+
+    EXPECT_FLOAT_EQ(30.5, viewportUnitLength(webView, @"vw"));
+    EXPECT_FLOAT_EQ(40.5, viewportUnitLength(webView, @"vh"));
+    EXPECT_FLOAT_EQ(30.5, viewportUnitLength(webView, @"vmin"));
+    EXPECT_FLOAT_EQ(40.5, viewportUnitLength(webView, @"vmax"));
+    EXPECT_FLOAT_EQ(40.5, viewportUnitLength(webView, @"vb"));
+    EXPECT_FLOAT_EQ(30.5, viewportUnitLength(webView, @"vi"));
+
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"svw"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"svh"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"svmin"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"svmax"));
+    EXPECT_FLOAT_EQ(20.5, viewportUnitLength(webView, @"svb"));
+    EXPECT_FLOAT_EQ(10.5, viewportUnitLength(webView, @"svi"));
+
+    EXPECT_FLOAT_EQ(30.5, viewportUnitLength(webView, @"lvw"));
+    EXPECT_FLOAT_EQ(40.5, viewportUnitLength(webView, @"lvh"));
+    EXPECT_FLOAT_EQ(30.5, viewportUnitLength(webView, @"lvmin"));
+    EXPECT_FLOAT_EQ(40.5, viewportUnitLength(webView, @"lvmax"));
+    EXPECT_FLOAT_EQ(40.5, viewportUnitLength(webView, @"lvb"));
+    EXPECT_FLOAT_EQ(30.5, viewportUnitLength(webView, @"lvi"));
+
+    {
+        double fixedWidth = widthOfElementWithID(webView, @"fixed");
+        double fixedHeight = heightOfElementWithID(webView, @"fixed");
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvw"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvh"));
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvmin"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvmax"));
+        EXPECT_FLOAT_EQ(fixedHeight, viewportUnitLength(webView, @"dvb"));
+        EXPECT_FLOAT_EQ(fixedWidth, viewportUnitLength(webView, @"dvi"));
+    }
 }
 
 #endif // PLATFORM(IOS_FAMILY)
@@ -1372,7 +1585,7 @@
         EXPECT_FLOAT_EQ(dvw, viewportUnitLength(webView, @"dvi"));
     }
 
-    [webView objectByEvaluatingJavaScript:@"document.documentElement.style.writingMode = 'vertical-lr'"];
+    changeCSSPropertyOfElements(webView, @"svg", @"writingMode", @"'vertical-lr'");
     [webView waitForNextPresentationUpdate];
 
     {
@@ -1412,4 +1625,46 @@
         EXPECT_FLOAT_EQ(dvw, viewportUnitLength(webView, @"dvb"));
         EXPECT_FLOAT_EQ(dvh, viewportUnitLength(webView, @"dvi"));
     }
+
+    changeCSSPropertyOfElements(webView, @"rect", @"writingMode", @"'horizontal-tb'");
+    [webView waitForNextPresentationUpdate];
+
+    {
+        double vw = viewportUnitLength(webView, @"vw");
+        double vh = viewportUnitLength(webView, @"vh");
+        EXPECT_GE(vw, 320);
+        EXPECT_GE(vh, 500);
+        EXPECT_FLOAT_EQ(vw, viewportUnitLength(webView, @"vmin"));
+        EXPECT_FLOAT_EQ(vh, viewportUnitLength(webView, @"vmax"));
+        EXPECT_FLOAT_EQ(vh, viewportUnitLength(webView, @"vb"));
+        EXPECT_FLOAT_EQ(vw, viewportUnitLength(webView, @"vi"));
+
+        double svw = viewportUnitLength(webView, @"svw");
+        double svh = viewportUnitLength(webView, @"svh");
+        EXPECT_FLOAT_EQ(vw, svw);
+        EXPECT_FLOAT_EQ(vh, svh);
+        EXPECT_FLOAT_EQ(svw, viewportUnitLength(webView, @"svmin"));
+        EXPECT_FLOAT_EQ(svh, viewportUnitLength(webView, @"svmax"));
+        EXPECT_FLOAT_EQ(svh, viewportUnitLength(webView, @"svb"));
+        EXPECT_FLOAT_EQ(svw, viewportUnitLength(webView, @"svi"));
+
+        double lvw = viewportUnitLength(webView, @"lvw");
+        double lvh = viewportUnitLength(webView, @"lvh");
+        EXPECT_FLOAT_EQ(vw, lvw);
+        EXPECT_FLOAT_EQ(vh, lvh);
+        EXPECT_FLOAT_EQ(lvw, viewportUnitLength(webView, @"lvmin"));
+        EXPECT_FLOAT_EQ(lvh, viewportUnitLength(webView, @"lvmax"));
+        EXPECT_FLOAT_EQ(lvh, viewportUnitLength(webView, @"lvb"));
+        EXPECT_FLOAT_EQ(lvw, viewportUnitLength(webView, @"lvi"));
+
+        double dvw = viewportUnitLength(webView, @"dvw");
+        double dvh = viewportUnitLength(webView, @"dvh");
+        EXPECT_FLOAT_EQ(widthOfElementWithID(webView, @"fixed"), dvw);
+        EXPECT_FLOAT_EQ(heightOfElementWithID(webView, @"fixed"), dvh);
+        EXPECT_FLOAT_EQ(dvw, viewportUnitLength(webView, @"dvmin"));
+        EXPECT_FLOAT_EQ(dvh, viewportUnitLength(webView, @"dvmax"));
+        EXPECT_FLOAT_EQ(dvh, viewportUnitLength(webView, @"dvb"));
+        EXPECT_FLOAT_EQ(dvw, viewportUnitLength(webView, @"dvi"));
+    }
+
 }
_______________________________________________
webkit-changes mailing list
[email protected]
https://lists.webkit.org/mailman/listinfo/webkit-changes

Reply via email to