Modified: trunk/LayoutTests/imported/w3c/ChangeLog (276836 => 276837)
--- trunk/LayoutTests/imported/w3c/ChangeLog 2021-04-30 12:19:26 UTC (rev 276836)
+++ trunk/LayoutTests/imported/w3c/ChangeLog 2021-04-30 14:24:32 UTC (rev 276837)
@@ -1,3 +1,16 @@
+2021-04-30 Oriol Brufau <obru...@igalia.com>
+
+ [css-logical] Fix logical shorthands with var()
+ https://bugs.webkit.org/show_bug.cgi?id=224594
+
+ Reviewed by Manuel Rego Casasnovas.
+
+ Add a new test.
+ Some cases still fail because of bug 225206 and bug 225209.
+
+ * web-platform-tests/css/css-logical/logicalprops-with-variables-expected.txt: Added.
+ * web-platform-tests/css/css-logical/logicalprops-with-variables.html: Added.
+
2021-04-30 Sergio Villar Senin <svil...@igalia.com>
Nullopt in RenderFlexibleBox::layoutFlexItems in RenderFlexibleBox::layoutBlock via RenderMultiColumnFlow::layout
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logicalprops-with-variables-expected.txt (0 => 276837)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logicalprops-with-variables-expected.txt (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logicalprops-with-variables-expected.txt 2021-04-30 14:24:32 UTC (rev 276837)
@@ -0,0 +1,14 @@
+
+PASS Logical longhands with variables - margin-inline-start
+PASS Logical longhands with variables - margin-inline-end
+FAIL Logical longhands with variables - margin-inline assert_equals: Specified value expected "" but got "var(--one) var(--two)"
+PASS Logical shorthand with 1 variable - margin-inline-start
+PASS Logical shorthand with 1 variable - margin-inline-end
+FAIL Logical shorthand with 1 variable - margin-inline assert_equals: Specified value expected "var(--one)" but got ""
+PASS Logical shorthand with 2 variables - margin-inline-start
+PASS Logical shorthand with 2 variables - margin-inline-end
+FAIL Logical shorthand with 2 variables - margin-inline assert_equals: Specified value expected "var(--one) var(--two)" but got ""
+PASS Logical shorthand with 1 variable and 1 length - margin-inline-start
+PASS Logical shorthand with 1 variable and 1 length - margin-inline-end
+FAIL Logical shorthand with 1 variable and 1 length - margin-inline assert_equals: Specified value expected "var(--one) 2px" but got ""
+
Added: trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logicalprops-with-variables.html (0 => 276837)
--- trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logicalprops-with-variables.html (rev 0)
+++ trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logicalprops-with-variables.html 2021-04-30 14:24:32 UTC (rev 276837)
@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>Logical properties with <code>var()</code></title>
+<link rel="author" title="Oriol Brufau" href="" />
+<link rel="help" href=""
+<link rel="help" href=""
+<meta name="assert" content="Checks that logical properties can use the 'var()' notation to reference custom properties.">
+<div id="target"></div>
+<script src=""
+<script src=""
+<script>
+const target = document.getElementById("target");
+const {style} = target;
+const computedStyle = getComputedStyle(target);
+let title;
+
+function check(property, specifiedExpected, expectedComputed) {
+ test(() => {
+ const specifiedActual = style.getPropertyValue(property);
+ assert_equals(specifiedActual, specifiedExpected, "Specified value");
+ const computedActual = computedStyle.getPropertyValue(property);
+ assert_equals(computedActual, expectedComputed, "Computed value");
+ }, title + " - " + property);
+}
+
+{
+ title = "Logical longhands with variables";
+ style.cssText = "";
+ style.setProperty("--one", "1px");
+ style.setProperty("--two", "2px");
+ style.setProperty("margin-inline-start", "var(--one)");
+ style.setProperty("margin-inline-end", "var(--two)");
+
+ check("margin-inline-start", "var(--one)", "1px");
+ check("margin-inline-end", "var(--two)", "2px");
+ check("margin-inline", "", "1px 2px");
+}
+{
+ title = "Logical shorthand with 1 variable";
+ style.cssText = "";
+ style.setProperty("--one", "1px");
+ style.setProperty("margin-inline", "var(--one)");
+
+ check("margin-inline-start", "", "1px");
+ check("margin-inline-end", "", "1px");
+ check("margin-inline", "var(--one)", "1px");
+}
+{
+ title = "Logical shorthand with 2 variables";
+ style.cssText = "";
+ style.setProperty("--one", "1px");
+ style.setProperty("--two", "2px");
+ style.setProperty("margin-inline", "var(--one) var(--two)");
+
+ check("margin-inline-start", "", "1px");
+ check("margin-inline-end", "", "2px");
+ check("margin-inline", "var(--one) var(--two)", "1px 2px");
+}
+{
+ title = "Logical shorthand with 1 variable and 1 length";
+ style.cssText = "";
+ style.setProperty("--one", "1px");
+ style.setProperty("margin-inline", "var(--one) 2px");
+
+ check("margin-inline-start", "", "1px");
+ check("margin-inline-end", "", "2px");
+ check("margin-inline", "var(--one) 2px", "1px 2px");
+}
+</script>
Modified: trunk/Source/WebCore/ChangeLog (276836 => 276837)
--- trunk/Source/WebCore/ChangeLog 2021-04-30 12:19:26 UTC (rev 276836)
+++ trunk/Source/WebCore/ChangeLog 2021-04-30 14:24:32 UTC (rev 276837)
@@ -1,3 +1,23 @@
+2021-04-30 Oriol Brufau <obru...@igalia.com>
+
+ [css-logical] Fix logical shorthands with var()
+ https://bugs.webkit.org/show_bug.cgi?id=224594
+
+ Reviewed by Manuel Rego Casasnovas.
+
+ Logical shorthands with var() were not working because when resolving
+ the pending-substitution value of the equivalent physical longhand,
+ parseValueWithVariableReferences would parse the logical shorthand into
+ the logical longhands, which would be different properties than the
+ physical longhand being resolved.
+
+ So this patch compares with the equivalent physical property instead.
+
+ Test: imported/w3c/web-platform-tests/css/css-logical/logicalprops-with-variables.html
+
+ * css/parser/CSSParser.cpp:
+ (WebCore::CSSParser::parseValueWithVariableReferences):
+
2021-04-30 Antti Koivisto <an...@apple.com>
Share style resolvers between author shadow trees without style sheets
Modified: trunk/Source/WebCore/css/parser/CSSParser.cpp (276836 => 276837)
--- trunk/Source/WebCore/css/parser/CSSParser.cpp 2021-04-30 12:19:26 UTC (rev 276836)
+++ trunk/Source/WebCore/css/parser/CSSParser.cpp 2021-04-30 14:24:32 UTC (rev 276837)
@@ -199,7 +199,10 @@
return nullptr;
for (auto& property : parsedProperties) {
- if (property.id() == propID)
+ CSSPropertyID currentId = property.id();
+ if (CSSProperty::isDirectionAwareProperty(currentId))
+ currentId = CSSProperty::resolveDirectionAwareProperty(currentId, direction, writingMode);
+ if (currentId == propID)
return property.value();
}
