Changeset 240251 in webkit


Ignore:
Timestamp:
Jan 22, 2019 1:52:48 AM (5 years ago)
Author:
commit-queue@webkit.org
Message:

[css-logical] Implement flow-relative margin, padding and border shorthands
https://bugs.webkit.org/show_bug.cgi?id=188697

Patch by Oriol Brufau <Oriol Brufau> on 2019-01-22
Reviewed by Simon Fraser and Antti Koivisto.

LayoutTests/imported/w3c:

Import tests from the WPT test suite for CSS Logical Properties and Values,
and enable the CSSLogicalEnabled runtime flag for them.

They still have some failures because sideways writing modes have not been
implemented yet (https://bugs.webkit.org/show_bug.cgi?id=166941).

  • web-platform-tests/css/css-logical/logical-box-border-color-expected.txt:
  • web-platform-tests/css/css-logical/logical-box-border-color.html:
  • web-platform-tests/css/css-logical/logical-box-border-shorthands-expected.txt:
  • web-platform-tests/css/css-logical/logical-box-border-shorthands.html:
  • web-platform-tests/css/css-logical/logical-box-border-style-expected.txt:
  • web-platform-tests/css/css-logical/logical-box-border-style.html:
  • web-platform-tests/css/css-logical/logical-box-border-width-expected.txt:
  • web-platform-tests/css/css-logical/logical-box-border-width.html:
  • web-platform-tests/css/css-logical/logical-box-inset-expected.txt:
  • web-platform-tests/css/css-logical/logical-box-inset.html:
  • web-platform-tests/css/css-logical/logical-box-margin-expected.txt:
  • web-platform-tests/css/css-logical/logical-box-margin.html:
  • web-platform-tests/css/css-logical/logical-box-padding-expected.txt:
  • web-platform-tests/css/css-logical/logical-box-padding.html:
  • web-platform-tests/css/css-logical/logical-box-size.html:
  • web-platform-tests/css/css-logical/resources/test-box-properties.js:

(export.createBoxPropertyGroup):
(export.createSizingPropertyGroup):
(export.runTests.set test):
(export.runTests):

  • web-platform-tests/css/css-logical/resources/test-shared.js: Added.

(export.testCSSValues):
(export.testComputedValues):
(export.makeDeclaration):

  • web-platform-tests/css/css-logical/resources/w3c-import.log:

Source/WebCore:

Tests: imported/w3c/web-platform-tests/css/css-logical/logical-box-border-color.html

imported/w3c/web-platform-tests/css/css-logical/logical-box-border-shorthands.html
imported/w3c/web-platform-tests/css/css-logical/logical-box-border-style.html
imported/w3c/web-platform-tests/css/css-logical/logical-box-border-width.html
imported/w3c/web-platform-tests/css/css-logical/logical-box-margin.html
imported/w3c/web-platform-tests/css/css-logical/logical-box-padding.html
webexposed/css-properties-behind-flags.html

  • css/CSSComputedStyleDeclaration.cpp:

(WebCore::ComputedStyleExtractor::valueForPropertyinStyle):
Allow the new properties to serialize their computed value.

(WebCore::ComputedStyleExtractor::getCSSPropertyValuesFor2SidesShorthand):
(WebCore::ComputedStyleExtractor::getCSSPropertyValuesFor4SidesShorthand):

  • css/CSSComputedStyleDeclaration.h:

Rename getCSSPropertyValuesForSidesShorthand to getCSSPropertyValuesFor4SidesShorthand,
and add analogous getCSSPropertyValuesFor2SidesShorthand for serializing 2-sided
shorthands.

  • css/CSSProperties.json:

Add the new properties behind the CSSLogicalEnabled runtime flag.

  • css/CSSStyleDeclaration.cpp:

(WebCore::CSSStyleDeclaration::supportedPropertyNames const):
Prevent CSS properties disabled behind a runtime flag from being exposed in
style declarations.

  • css/StyleProperties.cpp:

(WebCore::StyleProperties::getPropertyValue const):
Allow the new properties to serialize their specified value.

(WebCore::StyleProperties::get2Values const):
Add get2Values, analogous to get4Values, for serializing 2-sided shorthands.

(WebCore::StyleProperties::borderPropertyValue const):
Allow borderPropertyValue to serialize arbitrary multi-sided border shorthands
corresponding to width, style and color.

(WebCore::MutableStyleProperties::setProperty):
Prevent CSS properties disabled behind a runtime flag from being set a value.

(WebCore::StyleProperties::asText const):
Allow the new properties to be serialized in cssText.
Prevent CSS shorthands disabled behind a runtime flag from appearing in cssText,
and serialize the longhands instead. Note that there could be another shorthand
available which is enabled, but a proper solution would require bug 190496.

  • css/StyleProperties.h:

Update declarations of borderPropertyValue and get2Values.

  • css/makeprop.pl:

(addProperty):
Add isEnabledCSSProperty function for checking that a CSS property is not
disabled behind a runtime flag.

  • css/parser/CSSPropertyParser.cpp:

(WebCore::cssPropertyID):
Prevent CSS properties disabled behind a runtime flag from being exposed in
computed styles.

(WebCore::CSSPropertyParser::addProperty):
Prevent CSS properties disabled behind a runtime flag from being set a value.

(WebCore::CSSPropertyParser::consumeBorder):
Change consumeBorder to provide the caller with the parsed values instead of
setting properties. Then the caller can decide to which properties the values
should be set, and whether border-image should be reset or not.

(WebCore::CSSPropertyParser::consume2ValueShorthand):
(WebCore::CSSPropertyParser::consume4ValueShorthand):
Rename consume4Values to consume4ValueShorthand, and add analogous
consume2ValueShorthand for parsing shorthands with two longhands.

(WebCore::CSSPropertyParser::parseShorthand):
Allow the new properties to be parsed.

  • css/parser/CSSPropertyParser.h:

Update declarations of consumeBorder, consume2ValueShorthand and
consume4ValueShorthand.

  • inspector/agents/InspectorCSSAgent.cpp:

(WebCore::InspectorCSSAgent::getSupportedCSSProperties):
Prevent CSS properties disabled behind a runtime flag from being exposed in
the CSS inspector tool.

  • page/RuntimeEnabledFeatures.h:

(WebCore::RuntimeEnabledFeatures::setCSSLogicalEnabled):
(WebCore::RuntimeEnabledFeatures::cssLogicalEnabled const):
Add the CSSLogicalEnabled runtime flag.

Source/WebKit:

Add a CSSLogicalEnabled runtime flag.

  • Shared/WebPreferences.yaml:

Source/WebKitLegacy/mac:

Add CSSLogicalEnabled runtime flag.

  • WebView/WebPreferenceKeysPrivate.h:
  • WebView/WebPreferences.mm:

(+[WebPreferences initialize]):
(-[WebPreferences cssLogicalEnabled]):
(-[WebPreferences setCSSLogicalEnabled:]):

  • WebView/WebPreferencesPrivate.h:
  • WebView/WebView.mm:

(-[WebView _preferencesChanged:]):

Tools:

  • DumpRenderTree/TestOptions.cpp:

(TestOptions::TestOptions):

  • DumpRenderTree/TestOptions.h:
  • DumpRenderTree/mac/DumpRenderTree.mm:

(setWebPreferencesForTestOptions):
Allow tests to enable the CSSLogicalEnabled flag in WK1.

  • Scripts/webkitpy/style/checkers/jsonchecker.py:

(JSONCSSPropertiesChecker.check_codegen_properties):
Allow CSS property definitions to have a 'runtime-flag' parameter which
disables the property when the specified runtime flag is disabled.

LayoutTests:

Add tests checking that CSS properties disabled behind runtime flags
are not exposed.

  • webexposed/css-properties-behind-flags-expected.txt: Added.
  • webexposed/css-properties-behind-flags.html: Added.
Location:
trunk
Files:
4 added
43 edited

Legend:

Unmodified
Added
Removed
  • trunk/LayoutTests/ChangeLog

    r240249 r240251  
     12019-01-22  Oriol Brufau  <obrufau@igalia.com>
     2
     3        [css-logical] Implement flow-relative margin, padding and border shorthands
     4        https://bugs.webkit.org/show_bug.cgi?id=188697
     5
     6        Reviewed by Simon Fraser and Antti Koivisto.
     7
     8        Add tests checking that CSS properties disabled behind runtime flags
     9        are not exposed.
     10
     11        * webexposed/css-properties-behind-flags-expected.txt: Added.
     12        * webexposed/css-properties-behind-flags.html: Added.
     13
    1142019-01-21  Antti Koivisto  <antti@apple.com>
    215
  • trunk/LayoutTests/imported/w3c/ChangeLog

    r240158 r240251  
     12019-01-22  Oriol Brufau  <obrufau@igalia.com>
     2
     3        [css-logical] Implement flow-relative margin, padding and border shorthands
     4        https://bugs.webkit.org/show_bug.cgi?id=188697
     5
     6        Reviewed by Simon Fraser and Antti Koivisto.
     7
     8        Import tests from the WPT test suite for CSS Logical Properties and Values,
     9        and enable the CSSLogicalEnabled runtime flag for them.
     10
     11        They still have some failures because sideways writing modes have not been
     12        implemented yet (https://bugs.webkit.org/show_bug.cgi?id=166941).
     13
     14        * web-platform-tests/css/css-logical/logical-box-border-color-expected.txt:
     15        * web-platform-tests/css/css-logical/logical-box-border-color.html:
     16        * web-platform-tests/css/css-logical/logical-box-border-shorthands-expected.txt:
     17        * web-platform-tests/css/css-logical/logical-box-border-shorthands.html:
     18        * web-platform-tests/css/css-logical/logical-box-border-style-expected.txt:
     19        * web-platform-tests/css/css-logical/logical-box-border-style.html:
     20        * web-platform-tests/css/css-logical/logical-box-border-width-expected.txt:
     21        * web-platform-tests/css/css-logical/logical-box-border-width.html:
     22        * web-platform-tests/css/css-logical/logical-box-inset-expected.txt:
     23        * web-platform-tests/css/css-logical/logical-box-inset.html:
     24        * web-platform-tests/css/css-logical/logical-box-margin-expected.txt:
     25        * web-platform-tests/css/css-logical/logical-box-margin.html:
     26        * web-platform-tests/css/css-logical/logical-box-padding-expected.txt:
     27        * web-platform-tests/css/css-logical/logical-box-padding.html:
     28        * web-platform-tests/css/css-logical/logical-box-size.html:
     29        * web-platform-tests/css/css-logical/resources/test-box-properties.js:
     30        (export.createBoxPropertyGroup):
     31        (export.createSizingPropertyGroup):
     32        (export.runTests.set test):
     33        (export.runTests):
     34        * web-platform-tests/css/css-logical/resources/test-shared.js: Added.
     35        (export.testCSSValues):
     36        (export.testComputedValues):
     37        (export.makeDeclaration):
     38        * web-platform-tests/css/css-logical/resources/w3c-import.log:
     39
    1402019-01-18  Ali Juma  <ajuma@chromium.org>
    241
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-border-color-expected.txt

    r238262 r240251  
    11
    22PASS Test that logical border-*-color properties are supported.
     3PASS Test that border-inline-color shorthand sets longhands and serializes correctly.
     4PASS Test that border-block-color shorthand sets longhands and serializes correctly.
     5PASS Test that border-color shorthand sets longhands and serializes correctly.
    36PASS Test that logical border-*-color properties share computed values with their physical associates, with 'writing-mode: horizontal-tb; direction: ltr; '.
    4 FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: ltr; ', border-inline-start-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
     7PASS Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: ltr; '.
    58PASS Test that border-*-color properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: ltr; '.
    69PASS Test that border-*-color properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: ltr; '.
    710PASS Test that logical border-*-color properties share computed values with their physical associates, with 'writing-mode: horizontal-tb; direction: rtl; '.
    8 FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: rtl; ', border-inline-start-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
     11PASS Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: rtl; '.
    912PASS Test that border-*-color properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: rtl; '.
    1013PASS Test that border-*-color properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: rtl; '.
    1114PASS Test that logical border-*-color properties share computed values with their physical associates, with 'writing-mode: vertical-rl; direction: rtl; '.
    12 FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-rl; direction: rtl; ', border-inline-start-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
     15PASS Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: rtl; '.
    1316PASS Test that border-*-color properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: rtl; '.
    1417PASS Test that border-*-color properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: rtl; '.
    1518FAIL Test that logical border-*-color properties share computed values with their physical associates, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', border-bottom-color expected "rgb(1, 1, 1)" but got "rgb(4, 4, 4)"
    16 FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', border-inline-start-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
     19FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', border-bottom-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
    1720FAIL Test that border-*-color properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: 'border-inline-start-color' last on single declaration, 'writing-mode: sideways-rl; direction: rtl; ', border-block-end-color expected "rgb(1, 1, 1)" but got "rgb(4, 4, 4)"
    1821FAIL Test that border-*-color properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: 'border-inline-start-color', two declarations, 'writing-mode: sideways-rl; direction: rtl; ', border-block-end-color expected "rgb(1, 1, 1)" but got "rgb(4, 4, 4)"
    1922PASS Test that logical border-*-color properties share computed values with their physical associates, with 'writing-mode: vertical-rl; direction: ltr; '.
    20 FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-rl; direction: ltr; ', border-inline-start-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
     23PASS Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: ltr; '.
    2124PASS Test that border-*-color properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: ltr; '.
    2225PASS Test that border-*-color properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: ltr; '.
    2326FAIL Test that logical border-*-color properties share computed values with their physical associates, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', border-top-color expected "rgb(1, 1, 1)" but got "rgb(3, 3, 3)"
    24 FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', border-inline-start-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
     27FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', border-top-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
    2528FAIL Test that border-*-color properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: 'border-inline-start-color' last on single declaration, 'writing-mode: sideways-rl; direction: ltr; ', border-left-color expected "rgb(1, 1, 1)" but got "rgb(5, 5, 5)"
    2629FAIL Test that border-*-color properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: 'border-inline-start-color', two declarations, 'writing-mode: sideways-rl; direction: ltr; ', border-left-color expected "rgb(1, 1, 1)" but got "rgb(5, 5, 5)"
    2730PASS Test that logical border-*-color properties share computed values with their physical associates, with 'writing-mode: vertical-lr; direction: rtl; '.
    28 FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-lr; direction: rtl; ', border-inline-start-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
     31PASS Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: rtl; '.
    2932PASS Test that border-*-color properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: rtl; '.
    3033PASS Test that border-*-color properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: rtl; '.
    3134FAIL Test that logical border-*-color properties share computed values with their physical associates, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', border-bottom-color expected "rgb(1, 1, 1)" but got "rgb(4, 4, 4)"
    32 FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', border-inline-start-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
     35FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', border-bottom-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
    3336FAIL Test that border-*-color properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: 'border-inline-start-color' last on single declaration, 'writing-mode: sideways-lr; direction: ltr; ', border-left-color expected "rgb(1, 1, 1)" but got "rgb(5, 5, 5)"
    3437FAIL Test that border-*-color properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: 'border-inline-start-color', two declarations, 'writing-mode: sideways-lr; direction: ltr; ', border-left-color expected "rgb(1, 1, 1)" but got "rgb(5, 5, 5)"
    3538PASS Test that logical border-*-color properties share computed values with their physical associates, with 'writing-mode: vertical-lr; direction: ltr; '.
    36 FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-lr; direction: ltr; ', border-inline-start-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
     39PASS Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: ltr; '.
    3740PASS Test that border-*-color properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: ltr; '.
    3841PASS Test that border-*-color properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: ltr; '.
    3942FAIL Test that logical border-*-color properties share computed values with their physical associates, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', border-top-color expected "rgb(1, 1, 1)" but got "rgb(3, 3, 3)"
    40 FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', border-inline-start-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
     43FAIL Test that border-*-color shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', border-top-color expected "rgb(1, 1, 1)" but got "rgb(0, 0, 0)"
    4144FAIL Test that border-*-color properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: 'border-inline-start-color' last on single declaration, 'writing-mode: sideways-lr; direction: rtl; ', border-block-start-color expected "rgb(1, 1, 1)" but got "rgb(3, 3, 3)"
    4245FAIL Test that border-*-color properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: 'border-inline-start-color', two declarations, 'writing-mode: sideways-lr; direction: rtl; ', border-block-start-color expected "rgb(1, 1, 1)" but got "rgb(3, 3, 3)"
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-border-color.html

    r238262 r240251  
    1 <!DOCTYPE html>
     1<!DOCTYPE html> <!-- webkit-test-runner [ internal:CSSLogicalEnabled=true ] -->
    22<meta charset="utf-8" />
    33<title>CSS Logical Properties: Flow-Relative Border Colors</title>
     
    1010<div id="log"></div>
    1111
    12 <script src="./resources/test-box-properties.js"></script>
    13 <script>
     12<script type="module">
     13import {runTests, createBoxPropertyGroup} from "./resources/test-box-properties.js";
    1414runTests(createBoxPropertyGroup("border-*-color", {type: "color"}));
    1515</script>
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-border-shorthands-expected.txt

    r238262 r240251  
    11
    22PASS Test that logical border-* properties are supported.
     3PASS Test that border-inline shorthand sets longhands and serializes correctly.
     4PASS Test that border-block shorthand sets longhands and serializes correctly.
     5PASS Test that border shorthand sets longhands and serializes correctly.
    36PASS Test that logical border-* properties share computed values with their physical associates, with 'writing-mode: horizontal-tb; direction: ltr; '.
    4 FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: ltr; ', border-inline-start expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
     7PASS Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: ltr; '.
    58PASS Test that border-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: ltr; '.
    69PASS Test that border-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: ltr; '.
    710PASS Test that logical border-* properties share computed values with their physical associates, with 'writing-mode: horizontal-tb; direction: rtl; '.
    8 FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: rtl; ', border-inline-start expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
     11PASS Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: rtl; '.
    912PASS Test that border-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: rtl; '.
    1013PASS Test that border-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: rtl; '.
    1114PASS Test that logical border-* properties share computed values with their physical associates, with 'writing-mode: vertical-rl; direction: rtl; '.
    12 FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-rl; direction: rtl; ', border-inline-start expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
     15PASS Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: rtl; '.
    1316PASS Test that border-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: rtl; '.
    1417PASS Test that border-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: rtl; '.
    1518FAIL Test that logical border-* properties share computed values with their physical associates, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', border-bottom expected "1px solid rgb(1, 1, 1)" but got "4px double rgb(4, 4, 4)"
    16 FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', border-inline-start expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
     19FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', border-bottom expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
    1720FAIL Test that border-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: 'border-inline-start' last on single declaration, 'writing-mode: sideways-rl; direction: rtl; ', border-block-end expected "1px solid rgb(1, 1, 1)" but got "4px double rgb(4, 4, 4)"
    1821FAIL Test that border-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: 'border-inline-start', two declarations, 'writing-mode: sideways-rl; direction: rtl; ', border-block-end expected "1px solid rgb(1, 1, 1)" but got "4px double rgb(4, 4, 4)"
    1922PASS Test that logical border-* properties share computed values with their physical associates, with 'writing-mode: vertical-rl; direction: ltr; '.
    20 FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-rl; direction: ltr; ', border-inline-start expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
     23PASS Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: ltr; '.
    2124PASS Test that border-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: ltr; '.
    2225PASS Test that border-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: ltr; '.
    2326FAIL Test that logical border-* properties share computed values with their physical associates, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', border-top expected "1px solid rgb(1, 1, 1)" but got "3px dotted rgb(3, 3, 3)"
    24 FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', border-inline-start expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
     27FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', border-top expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
    2528FAIL Test that border-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: 'border-inline-start' last on single declaration, 'writing-mode: sideways-rl; direction: ltr; ', border-left expected "1px solid rgb(1, 1, 1)" but got "5px groove rgb(5, 5, 5)"
    2629FAIL Test that border-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: 'border-inline-start', two declarations, 'writing-mode: sideways-rl; direction: ltr; ', border-left expected "1px solid rgb(1, 1, 1)" but got "5px groove rgb(5, 5, 5)"
    2730PASS Test that logical border-* properties share computed values with their physical associates, with 'writing-mode: vertical-lr; direction: rtl; '.
    28 FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-lr; direction: rtl; ', border-inline-start expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
     31PASS Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: rtl; '.
    2932PASS Test that border-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: rtl; '.
    3033PASS Test that border-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: rtl; '.
    3134FAIL Test that logical border-* properties share computed values with their physical associates, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', border-bottom expected "1px solid rgb(1, 1, 1)" but got "4px double rgb(4, 4, 4)"
    32 FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', border-inline-start expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
     35FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', border-bottom expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
    3336FAIL Test that border-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: 'border-inline-start' last on single declaration, 'writing-mode: sideways-lr; direction: ltr; ', border-left expected "1px solid rgb(1, 1, 1)" but got "5px groove rgb(5, 5, 5)"
    3437FAIL Test that border-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: 'border-inline-start', two declarations, 'writing-mode: sideways-lr; direction: ltr; ', border-left expected "1px solid rgb(1, 1, 1)" but got "5px groove rgb(5, 5, 5)"
    3538PASS Test that logical border-* properties share computed values with their physical associates, with 'writing-mode: vertical-lr; direction: ltr; '.
    36 FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-lr; direction: ltr; ', border-inline-start expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
     39PASS Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: ltr; '.
    3740PASS Test that border-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: ltr; '.
    3841PASS Test that border-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: ltr; '.
    3942FAIL Test that logical border-* properties share computed values with their physical associates, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', border-top expected "1px solid rgb(1, 1, 1)" but got "3px dotted rgb(3, 3, 3)"
    40 FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', border-inline-start expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
     43FAIL Test that border-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', border-top expected "1px solid rgb(1, 1, 1)" but got "0px none rgb(0, 0, 0)"
    4144FAIL Test that border-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: 'border-inline-start' last on single declaration, 'writing-mode: sideways-lr; direction: rtl; ', border-block-start expected "1px solid rgb(1, 1, 1)" but got "3px dotted rgb(3, 3, 3)"
    4245FAIL Test that border-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: 'border-inline-start', two declarations, 'writing-mode: sideways-lr; direction: rtl; ', border-block-start expected "1px solid rgb(1, 1, 1)" but got "3px dotted rgb(3, 3, 3)"
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-border-shorthands.html

    r238262 r240251  
    1 <!DOCTYPE html>
     1<!DOCTYPE html> <!-- webkit-test-runner [ internal:CSSLogicalEnabled=true ] -->
    22<meta charset="utf-8" />
    33<title>CSS Logical Properties: Flow-Relative Border Shorthands</title>
     
    1010<div id="log"></div>
    1111
    12 <script src="./resources/test-box-properties.js"></script>
    13 <script>
     12<script type="module">
     13import {runTests, createBoxPropertyGroup} from "./resources/test-box-properties.js";
    1414runTests(createBoxPropertyGroup("border-*", {type: ["length", "border-style", "color"]}));
    1515</script>
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-border-style-expected.txt

    r238262 r240251  
    11
    22PASS Test that logical border-*-style properties are supported.
     3PASS Test that border-inline-style shorthand sets longhands and serializes correctly.
     4PASS Test that border-block-style shorthand sets longhands and serializes correctly.
     5PASS Test that border-style shorthand sets longhands and serializes correctly.
    36PASS Test that logical border-*-style properties share computed values with their physical associates, with 'writing-mode: horizontal-tb; direction: ltr; '.
    4 FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: ltr; ', border-inline-start-style expected "solid" but got "none"
     7PASS Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: ltr; '.
    58PASS Test that border-*-style properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: ltr; '.
    69PASS Test that border-*-style properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: ltr; '.
    710PASS Test that logical border-*-style properties share computed values with their physical associates, with 'writing-mode: horizontal-tb; direction: rtl; '.
    8 FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: rtl; ', border-inline-start-style expected "solid" but got "none"
     11PASS Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: rtl; '.
    912PASS Test that border-*-style properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: rtl; '.
    1013PASS Test that border-*-style properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: rtl; '.
    1114PASS Test that logical border-*-style properties share computed values with their physical associates, with 'writing-mode: vertical-rl; direction: rtl; '.
    12 FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-rl; direction: rtl; ', border-inline-start-style expected "solid" but got "none"
     15PASS Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: rtl; '.
    1316PASS Test that border-*-style properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: rtl; '.
    1417PASS Test that border-*-style properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: rtl; '.
    1518FAIL Test that logical border-*-style properties share computed values with their physical associates, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', border-bottom-style expected "solid" but got "double"
    16 FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', border-inline-start-style expected "solid" but got "none"
     19FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', border-bottom-style expected "solid" but got "none"
    1720FAIL Test that border-*-style properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: 'border-inline-start-style' last on single declaration, 'writing-mode: sideways-rl; direction: rtl; ', border-block-end-style expected "solid" but got "double"
    1821FAIL Test that border-*-style properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: 'border-inline-start-style', two declarations, 'writing-mode: sideways-rl; direction: rtl; ', border-block-end-style expected "solid" but got "double"
    1922PASS Test that logical border-*-style properties share computed values with their physical associates, with 'writing-mode: vertical-rl; direction: ltr; '.
    20 FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-rl; direction: ltr; ', border-inline-start-style expected "solid" but got "none"
     23PASS Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: ltr; '.
    2124PASS Test that border-*-style properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: ltr; '.
    2225PASS Test that border-*-style properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: ltr; '.
    2326FAIL Test that logical border-*-style properties share computed values with their physical associates, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', border-top-style expected "solid" but got "dotted"
    24 FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', border-inline-start-style expected "solid" but got "none"
     27FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', border-top-style expected "solid" but got "none"
    2528FAIL Test that border-*-style properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: 'border-inline-start-style' last on single declaration, 'writing-mode: sideways-rl; direction: ltr; ', border-left-style expected "solid" but got "groove"
    2629FAIL Test that border-*-style properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: 'border-inline-start-style', two declarations, 'writing-mode: sideways-rl; direction: ltr; ', border-left-style expected "solid" but got "groove"
    2730PASS Test that logical border-*-style properties share computed values with their physical associates, with 'writing-mode: vertical-lr; direction: rtl; '.
    28 FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-lr; direction: rtl; ', border-inline-start-style expected "solid" but got "none"
     31PASS Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: rtl; '.
    2932PASS Test that border-*-style properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: rtl; '.
    3033PASS Test that border-*-style properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: rtl; '.
    3134FAIL Test that logical border-*-style properties share computed values with their physical associates, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', border-bottom-style expected "solid" but got "double"
    32 FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', border-inline-start-style expected "solid" but got "none"
     35FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', border-bottom-style expected "solid" but got "none"
    3336FAIL Test that border-*-style properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: 'border-inline-start-style' last on single declaration, 'writing-mode: sideways-lr; direction: ltr; ', border-left-style expected "solid" but got "groove"
    3437FAIL Test that border-*-style properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: 'border-inline-start-style', two declarations, 'writing-mode: sideways-lr; direction: ltr; ', border-left-style expected "solid" but got "groove"
    3538PASS Test that logical border-*-style properties share computed values with their physical associates, with 'writing-mode: vertical-lr; direction: ltr; '.
    36 FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-lr; direction: ltr; ', border-inline-start-style expected "solid" but got "none"
     39PASS Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: ltr; '.
    3740PASS Test that border-*-style properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: ltr; '.
    3841PASS Test that border-*-style properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: ltr; '.
    3942FAIL Test that logical border-*-style properties share computed values with their physical associates, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', border-top-style expected "solid" but got "dotted"
    40 FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', border-inline-start-style expected "solid" but got "none"
     43FAIL Test that border-*-style shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', border-top-style expected "solid" but got "none"
    4144FAIL Test that border-*-style properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: 'border-inline-start-style' last on single declaration, 'writing-mode: sideways-lr; direction: rtl; ', border-block-start-style expected "solid" but got "dotted"
    4245FAIL Test that border-*-style properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: 'border-inline-start-style', two declarations, 'writing-mode: sideways-lr; direction: rtl; ', border-block-start-style expected "solid" but got "dotted"
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-border-style.html

    r238262 r240251  
    1 <!DOCTYPE html>
     1<!DOCTYPE html> <!-- webkit-test-runner [ internal:CSSLogicalEnabled=true ] -->
    22<meta charset="utf-8" />
    33<title>CSS Logical Properties: Flow-Relative Border Styles</title>
     
    1010<div id="log"></div>
    1111
    12 <script src="./resources/test-box-properties.js"></script>
    13 <script>
     12<script type="module">
     13import {runTests, createBoxPropertyGroup} from "./resources/test-box-properties.js";
    1414runTests(createBoxPropertyGroup("border-*-style", {type: "border-style"}));
    1515</script>
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-border-width-expected.txt

    r238262 r240251  
    11
    22PASS Test that logical border-*-width properties are supported.
     3PASS Test that border-inline-width shorthand sets longhands and serializes correctly.
     4PASS Test that border-block-width shorthand sets longhands and serializes correctly.
     5PASS Test that border-width shorthand sets longhands and serializes correctly.
    36PASS Test that logical border-*-width properties share computed values with their physical associates, with 'writing-mode: horizontal-tb; direction: ltr; '.
    4 FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: ltr; ', border-inline-start-width expected "1px" but got "3px"
     7PASS Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: ltr; '.
    58PASS Test that border-*-width properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: ltr; '.
    69PASS Test that border-*-width properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: ltr; '.
    710PASS Test that logical border-*-width properties share computed values with their physical associates, with 'writing-mode: horizontal-tb; direction: rtl; '.
    8 FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: rtl; ', border-inline-start-width expected "1px" but got "3px"
     11PASS Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: rtl; '.
    912PASS Test that border-*-width properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: rtl; '.
    1013PASS Test that border-*-width properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: rtl; '.
    1114PASS Test that logical border-*-width properties share computed values with their physical associates, with 'writing-mode: vertical-rl; direction: rtl; '.
    12 FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-rl; direction: rtl; ', border-inline-start-width expected "1px" but got "3px"
     15PASS Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: rtl; '.
    1316PASS Test that border-*-width properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: rtl; '.
    1417PASS Test that border-*-width properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: rtl; '.
    1518FAIL Test that logical border-*-width properties share computed values with their physical associates, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', border-bottom-width expected "1px" but got "4px"
    16 FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', border-inline-start-width expected "1px" but got "3px"
     19FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', border-bottom-width expected "1px" but got "3px"
    1720FAIL Test that border-*-width properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: 'border-inline-start-width' last on single declaration, 'writing-mode: sideways-rl; direction: rtl; ', border-block-end-width expected "1px" but got "4px"
    1821FAIL Test that border-*-width properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: 'border-inline-start-width', two declarations, 'writing-mode: sideways-rl; direction: rtl; ', border-block-end-width expected "1px" but got "4px"
    1922PASS Test that logical border-*-width properties share computed values with their physical associates, with 'writing-mode: vertical-rl; direction: ltr; '.
    20 FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-rl; direction: ltr; ', border-inline-start-width expected "1px" but got "3px"
     23PASS Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: ltr; '.
    2124PASS Test that border-*-width properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: ltr; '.
    2225PASS Test that border-*-width properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: ltr; '.
    2326FAIL Test that logical border-*-width properties share computed values with their physical associates, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', border-top-width expected "1px" but got "3px"
    24 FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', border-inline-start-width expected "1px" but got "3px"
     27FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', border-top-width expected "1px" but got "3px"
    2528FAIL Test that border-*-width properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: 'border-inline-start-width' last on single declaration, 'writing-mode: sideways-rl; direction: ltr; ', border-left-width expected "1px" but got "5px"
    2629FAIL Test that border-*-width properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: 'border-inline-start-width', two declarations, 'writing-mode: sideways-rl; direction: ltr; ', border-left-width expected "1px" but got "5px"
    2730PASS Test that logical border-*-width properties share computed values with their physical associates, with 'writing-mode: vertical-lr; direction: rtl; '.
    28 FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-lr; direction: rtl; ', border-inline-start-width expected "1px" but got "3px"
     31PASS Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: rtl; '.
    2932PASS Test that border-*-width properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: rtl; '.
    3033PASS Test that border-*-width properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: rtl; '.
    3134FAIL Test that logical border-*-width properties share computed values with their physical associates, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', border-bottom-width expected "1px" but got "4px"
    32 FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', border-inline-start-width expected "1px" but got "3px"
     35FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', border-bottom-width expected "1px" but got "3px"
    3336FAIL Test that border-*-width properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: 'border-inline-start-width' last on single declaration, 'writing-mode: sideways-lr; direction: ltr; ', border-left-width expected "1px" but got "5px"
    3437FAIL Test that border-*-width properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: 'border-inline-start-width', two declarations, 'writing-mode: sideways-lr; direction: ltr; ', border-left-width expected "1px" but got "5px"
    3538PASS Test that logical border-*-width properties share computed values with their physical associates, with 'writing-mode: vertical-lr; direction: ltr; '.
    36 FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-lr; direction: ltr; ', border-inline-start-width expected "1px" but got "3px"
     39PASS Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: ltr; '.
    3740PASS Test that border-*-width properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: ltr; '.
    3841PASS Test that border-*-width properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: ltr; '.
    3942FAIL Test that logical border-*-width properties share computed values with their physical associates, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', border-top-width expected "1px" but got "3px"
    40 FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', border-inline-start-width expected "1px" but got "3px"
     43FAIL Test that border-*-width shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', border-top-width expected "1px" but got "3px"
    4144FAIL Test that border-*-width properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: 'border-inline-start-width' last on single declaration, 'writing-mode: sideways-lr; direction: rtl; ', border-block-start-width expected "1px" but got "3px"
    4245FAIL Test that border-*-width properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: 'border-inline-start-width', two declarations, 'writing-mode: sideways-lr; direction: rtl; ', border-block-start-width expected "1px" but got "3px"
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-border-width.html

    r238262 r240251  
    1 <!DOCTYPE html>
     1<!DOCTYPE html> <!-- webkit-test-runner [ internal:CSSLogicalEnabled=true ] -->
    22<meta charset="utf-8" />
    33<title>CSS Logical Properties: Flow-Relative Border Widths</title>
     
    1010<div id="log"></div>
    1111
    12 <script src="./resources/test-box-properties.js"></script>
    13 <script>
     12<script type="module">
     13import {runTests, createBoxPropertyGroup} from "./resources/test-box-properties.js";
    1414runTests(createBoxPropertyGroup("border-*-width", {
    1515  type: "length",
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-inset-expected.txt

    r238262 r240251  
    11
    22FAIL Test that logical inset-* properties are supported. assert_equals: logical properties in inline style, inset-inline-start expected "1px" but got ""
     3FAIL Test that inset-inline shorthand sets longhands and serializes correctly. assert_equals: shorthand in inline style, inset-inline expected "1px 2px" but got ""
     4FAIL Test that inset-block shorthand sets longhands and serializes correctly. assert_equals: shorthand in inline style, inset-block expected "1px 2px" but got ""
     5FAIL Test that inset shorthand sets longhands and serializes correctly. assert_equals: shorthand in inline style, inset expected "1px 2px 3px 4px" but got ""
    36FAIL Test that logical inset-* properties share computed values with their physical associates, with 'writing-mode: horizontal-tb; direction: ltr; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: ltr; ', inset-inline-start expected "1px" but got ""
    47FAIL Test that inset-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: ltr; ', inset-inline-start expected "1px" but got ""
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-inset.html

    r238262 r240251  
    1010<div id="log"></div>
    1111
    12 <script src="./resources/test-box-properties.js"></script>
    13 <script>
     12<script type="module">
     13import {runTests, createBoxPropertyGroup} from "./resources/test-box-properties.js";
    1414runTests(createBoxPropertyGroup("inset-*", {
    1515  type: "length",
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-margin-expected.txt

    r238262 r240251  
    11
    22PASS Test that logical margin-* properties are supported.
     3PASS Test that margin-inline shorthand sets longhands and serializes correctly.
     4PASS Test that margin-block shorthand sets longhands and serializes correctly.
     5PASS Test that margin shorthand sets longhands and serializes correctly.
    36PASS Test that logical margin-* properties share computed values with their physical associates, with 'writing-mode: horizontal-tb; direction: ltr; '.
    4 FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: ltr; ', margin-inline-start expected "1px" but got "0px"
     7PASS Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: ltr; '.
    58PASS Test that margin-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: ltr; '.
    69PASS Test that margin-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: ltr; '.
    710PASS Test that logical margin-* properties share computed values with their physical associates, with 'writing-mode: horizontal-tb; direction: rtl; '.
    8 FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: rtl; ', margin-inline-start expected "1px" but got "0px"
     11PASS Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: rtl; '.
    912PASS Test that margin-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: rtl; '.
    1013PASS Test that margin-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: rtl; '.
    1114PASS Test that logical margin-* properties share computed values with their physical associates, with 'writing-mode: vertical-rl; direction: rtl; '.
    12 FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-rl; direction: rtl; ', margin-inline-start expected "1px" but got "0px"
     15PASS Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: rtl; '.
    1316PASS Test that margin-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: rtl; '.
    1417PASS Test that margin-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: rtl; '.
    1518FAIL Test that logical margin-* properties share computed values with their physical associates, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', margin-bottom expected "1px" but got "4px"
    16 FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', margin-inline-start expected "1px" but got "0px"
     19FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', margin-bottom expected "1px" but got "0px"
    1720FAIL Test that margin-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: 'margin-inline-start' last on single declaration, 'writing-mode: sideways-rl; direction: rtl; ', margin-block-end expected "1px" but got "4px"
    1821FAIL Test that margin-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: 'margin-inline-start', two declarations, 'writing-mode: sideways-rl; direction: rtl; ', margin-block-end expected "1px" but got "4px"
    1922PASS Test that logical margin-* properties share computed values with their physical associates, with 'writing-mode: vertical-rl; direction: ltr; '.
    20 FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-rl; direction: ltr; ', margin-inline-start expected "1px" but got "0px"
     23PASS Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: ltr; '.
    2124PASS Test that margin-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: ltr; '.
    2225PASS Test that margin-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: ltr; '.
    2326FAIL Test that logical margin-* properties share computed values with their physical associates, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', margin-top expected "1px" but got "3px"
    24 FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', margin-inline-start expected "1px" but got "0px"
     27FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', margin-top expected "1px" but got "0px"
    2528FAIL Test that margin-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: 'margin-inline-start' last on single declaration, 'writing-mode: sideways-rl; direction: ltr; ', margin-left expected "1px" but got "5px"
    2629FAIL Test that margin-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: 'margin-inline-start', two declarations, 'writing-mode: sideways-rl; direction: ltr; ', margin-left expected "1px" but got "5px"
    2730PASS Test that logical margin-* properties share computed values with their physical associates, with 'writing-mode: vertical-lr; direction: rtl; '.
    28 FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-lr; direction: rtl; ', margin-inline-start expected "1px" but got "0px"
     31PASS Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: rtl; '.
    2932PASS Test that margin-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: rtl; '.
    3033PASS Test that margin-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: rtl; '.
    3134FAIL Test that logical margin-* properties share computed values with their physical associates, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', margin-bottom expected "1px" but got "4px"
    32 FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', margin-inline-start expected "1px" but got "0px"
     35FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', margin-bottom expected "1px" but got "0px"
    3336FAIL Test that margin-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: 'margin-inline-start' last on single declaration, 'writing-mode: sideways-lr; direction: ltr; ', margin-left expected "1px" but got "5px"
    3437FAIL Test that margin-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: 'margin-inline-start', two declarations, 'writing-mode: sideways-lr; direction: ltr; ', margin-left expected "1px" but got "5px"
    3538PASS Test that logical margin-* properties share computed values with their physical associates, with 'writing-mode: vertical-lr; direction: ltr; '.
    36 FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-lr; direction: ltr; ', margin-inline-start expected "1px" but got "0px"
     39PASS Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: ltr; '.
    3740PASS Test that margin-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: ltr; '.
    3841PASS Test that margin-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: ltr; '.
    3942FAIL Test that logical margin-* properties share computed values with their physical associates, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', margin-top expected "1px" but got "3px"
    40 FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', margin-inline-start expected "1px" but got "0px"
     43FAIL Test that margin-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', margin-top expected "1px" but got "0px"
    4144FAIL Test that margin-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: 'margin-inline-start' last on single declaration, 'writing-mode: sideways-lr; direction: rtl; ', margin-block-start expected "1px" but got "3px"
    4245FAIL Test that margin-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: 'margin-inline-start', two declarations, 'writing-mode: sideways-lr; direction: rtl; ', margin-block-start expected "1px" but got "3px"
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-margin.html

    r238262 r240251  
    1 <!DOCTYPE html>
     1<!DOCTYPE html> <!-- webkit-test-runner [ internal:CSSLogicalEnabled=true ] -->
    22<meta charset="utf-8" />
    33<title>CSS Logical Properties: Flow-Relative Margins</title>
     
    1010<div id="log"></div>
    1111
    12 <script src="./resources/test-box-properties.js"></script>
    13 <script>
     12<script type="module">
     13import {runTests, createBoxPropertyGroup} from "./resources/test-box-properties.js";
    1414runTests(createBoxPropertyGroup("margin-*", {type: "length"}));
    1515</script>
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-padding-expected.txt

    r238262 r240251  
    11
    22PASS Test that logical padding-* properties are supported.
     3PASS Test that padding-inline shorthand sets longhands and serializes correctly.
     4PASS Test that padding-block shorthand sets longhands and serializes correctly.
     5PASS Test that padding shorthand sets longhands and serializes correctly.
    36PASS Test that logical padding-* properties share computed values with their physical associates, with 'writing-mode: horizontal-tb; direction: ltr; '.
    4 FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: ltr; ', padding-inline-start expected "1px" but got "0px"
     7PASS Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: ltr; '.
    58PASS Test that padding-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: ltr; '.
    69PASS Test that padding-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: ltr; '.
    710PASS Test that logical padding-* properties share computed values with their physical associates, with 'writing-mode: horizontal-tb; direction: rtl; '.
    8 FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: horizontal-tb; direction: rtl; ', padding-inline-start expected "1px" but got "0px"
     11PASS Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: horizontal-tb; direction: rtl; '.
    912PASS Test that padding-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: rtl; '.
    1013PASS Test that padding-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: horizontal-tb; direction: rtl; '.
    1114PASS Test that logical padding-* properties share computed values with their physical associates, with 'writing-mode: vertical-rl; direction: rtl; '.
    12 FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-rl; direction: rtl; ', padding-inline-start expected "1px" but got "0px"
     15PASS Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: rtl; '.
    1316PASS Test that padding-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: rtl; '.
    1417PASS Test that padding-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: rtl; '.
    1518FAIL Test that logical padding-* properties share computed values with their physical associates, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', padding-bottom expected "1px" but got "4px"
    16 FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', padding-inline-start expected "1px" but got "0px"
     19FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: rtl; ', padding-bottom expected "1px" but got "0px"
    1720FAIL Test that padding-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: 'padding-inline-start' last on single declaration, 'writing-mode: sideways-rl; direction: rtl; ', padding-block-end expected "1px" but got "4px"
    1821FAIL Test that padding-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: rtl; '. assert_equals: 'padding-inline-start', two declarations, 'writing-mode: sideways-rl; direction: rtl; ', padding-block-end expected "1px" but got "4px"
    1922PASS Test that logical padding-* properties share computed values with their physical associates, with 'writing-mode: vertical-rl; direction: ltr; '.
    20 FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-rl; direction: ltr; ', padding-inline-start expected "1px" but got "0px"
     23PASS Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-rl; direction: ltr; '.
    2124PASS Test that padding-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: ltr; '.
    2225PASS Test that padding-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-rl; direction: ltr; '.
    2326FAIL Test that logical padding-* properties share computed values with their physical associates, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', padding-top expected "1px" but got "3px"
    24 FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', padding-inline-start expected "1px" but got "0px"
     27FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-rl; direction: ltr; ', padding-top expected "1px" but got "0px"
    2528FAIL Test that padding-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: 'padding-inline-start' last on single declaration, 'writing-mode: sideways-rl; direction: ltr; ', padding-left expected "1px" but got "5px"
    2629FAIL Test that padding-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-rl; direction: ltr; '. assert_equals: 'padding-inline-start', two declarations, 'writing-mode: sideways-rl; direction: ltr; ', padding-left expected "1px" but got "5px"
    2730PASS Test that logical padding-* properties share computed values with their physical associates, with 'writing-mode: vertical-lr; direction: rtl; '.
    28 FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-lr; direction: rtl; ', padding-inline-start expected "1px" but got "0px"
     31PASS Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: rtl; '.
    2932PASS Test that padding-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: rtl; '.
    3033PASS Test that padding-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: rtl; '.
    3134FAIL Test that logical padding-* properties share computed values with their physical associates, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', padding-bottom expected "1px" but got "4px"
    32 FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', padding-inline-start expected "1px" but got "0px"
     35FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: ltr; ', padding-bottom expected "1px" but got "0px"
    3336FAIL Test that padding-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: 'padding-inline-start' last on single declaration, 'writing-mode: sideways-lr; direction: ltr; ', padding-left expected "1px" but got "5px"
    3437FAIL Test that padding-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: ltr; '. assert_equals: 'padding-inline-start', two declarations, 'writing-mode: sideways-lr; direction: ltr; ', padding-left expected "1px" but got "5px"
    3538PASS Test that logical padding-* properties share computed values with their physical associates, with 'writing-mode: vertical-lr; direction: ltr; '.
    36 FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: ltr; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: vertical-lr; direction: ltr; ', padding-inline-start expected "1px" but got "0px"
     39PASS Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: vertical-lr; direction: ltr; '.
    3740PASS Test that padding-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: ltr; '.
    3841PASS Test that padding-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: vertical-lr; direction: ltr; '.
    3942FAIL Test that logical padding-* properties share computed values with their physical associates, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: logical properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', padding-top expected "1px" but got "3px"
    40 FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', padding-inline-start expected "1px" but got "0px"
     43FAIL Test that padding-* shorthands set the computed value of both logical and physical longhands, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: shorthand properties on one declaration, writing mode properties on another, 'writing-mode: sideways-lr; direction: rtl; ', padding-top expected "1px" but got "0px"
    4144FAIL Test that padding-* properties honor order of appearance when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: 'padding-inline-start' last on single declaration, 'writing-mode: sideways-lr; direction: rtl; ', padding-block-start expected "1px" but got "3px"
    4245FAIL Test that padding-* properties honor selector specificty when both logical and physical associates are declared, with 'writing-mode: sideways-lr; direction: rtl; '. assert_equals: 'padding-inline-start', two declarations, 'writing-mode: sideways-lr; direction: rtl; ', padding-block-start expected "1px" but got "3px"
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-padding.html

    r238262 r240251  
    1 <!DOCTYPE html>
     1<!DOCTYPE html> <!-- webkit-test-runner [ internal:CSSLogicalEnabled=true ] -->
    22<meta charset="utf-8" />
    33<title>CSS Logical Properties: Flow-Relative Padding</title>
     
    1010<div id="log"></div>
    1111
    12 <script src="./resources/test-box-properties.js"></script>
    13 <script>
     12<script type="module">
     13import {runTests, createBoxPropertyGroup} from "./resources/test-box-properties.js";
    1414runTests(createBoxPropertyGroup("padding-*", {type: "length"}));
    1515</script>
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-size.html

    r238262 r240251  
    1010<div id="log"></div>
    1111
    12 <script src="./resources/test-box-properties.js"></script>
    13 <script>
     12<script type="module">
     13import {runTests, createSizingPropertyGroup} from "./resources/test-box-properties.js";
    1414runTests(createSizingPropertyGroup(""));
    1515runTests(createSizingPropertyGroup("max-"));
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/resources/test-box-properties.js

    r238262 r240251  
    1 "use strict";
    2 (function(exports) {
    3   const sheet = document.head.appendChild(document.createElement("style"));
    4 
    5   // Specify size for outer <div> to avoid unconstrained-size warnings
    6   // when writing-mode of the inner test <div> is vertical-*
    7   const wrapper = document.body.appendChild(document.createElement("div"));
    8   wrapper.style.cssText = "width:100px; height: 100px;";
    9   const testElement = wrapper.appendChild(document.createElement("div"));
    10   testElement.id = testElement.className = "test";
    11 
    12   // Values to use while testing
    13   const testValues = {
    14     "length": ["1px", "2px", "3px", "4px", "5px"],
    15     "color": ["rgb(1, 1, 1)", "rgb(2, 2, 2)", "rgb(3, 3, 3)", "rgb(4, 4, 4)", "rgb(5, 5, 5)"],
    16     "border-style": ["solid", "dashed", "dotted", "double", "groove"],
     1import {
     2  testElement,
     3  writingModes,
     4  testCSSValues,
     5  testComputedValues,
     6  makeDeclaration
     7} from "./test-shared.js";
     8
     9// Values to use while testing
     10const testValues = {
     11  "length": ["1px", "2px", "3px", "4px", "5px"],
     12  "color": ["rgb(1, 1, 1)", "rgb(2, 2, 2)", "rgb(3, 3, 3)", "rgb(4, 4, 4)", "rgb(5, 5, 5)"],
     13  "border-style": ["solid", "dashed", "dotted", "double", "groove"],
     14};
     15
     16/**
     17 * Creates a group of physical and logical box properties, such as
     18 *
     19 * { physical: {
     20 *     left: "margin-left", right: "margin-right",
     21 *     top: "margin-top", bottom: "margin-bottom",
     22 *   }, logical: {
     23 *     inlineStart: "margin-inline-start", inlineEnd: "margin-inline-end",
     24 *     blockStart: "margin-block-start", blockEnd: "margin-block-end",
     25 *   }, shorthands: {
     26 *     "margin": ["margin-top", "margin-right", "margin-bottom", "margin-left"],
     27 *     "margin-inline": ["margin-inline-start", "margin-inline-end"],
     28 *     "margin-block": ["margin-block-start", "margin-block-end"],
     29 *   }, type: ["length"], prerequisites: "...", property: "margin-*" }
     30 *
     31 * @param {string} property
     32 *        A string representing the property names, like "margin-*".
     33 * @param {Object} descriptor
     34 * @param {string|string[]} descriptor.type
     35 *        Describes the kind of values accepted by the property, like "length".
     36 *        Must be a key or a collection of keys from the `testValues` object.
     37 * @param {Object={}} descriptor.prerequisites
     38 *        Represents property declarations that are needed by `property` to work.
     39 *        For example, border-width properties require a border style.
     40 */
     41export function createBoxPropertyGroup(property, descriptor) {
     42  const logical = {};
     43  const physical = {};
     44  const shorthands = {};
     45  for (const axis of ["inline", "block"]) {
     46    const shorthand = property.replace("*", axis);
     47    const longhands = [];
     48    shorthands[shorthand] = longhands;
     49    for (const side of ["start", "end"]) {
     50      const logicalSide = axis + "-" + side;
     51      const camelCase = logicalSide.replace(/-(.)/g, (match, $1) => $1.toUpperCase());
     52      const longhand = property.replace("*", logicalSide);
     53      logical[camelCase] = longhand;
     54      longhands.push(longhand);
     55    }
     56  }
     57  const isInset = property === "inset-*";
     58  let prerequisites = "";
     59  for (const physicalSide of ["left", "right", "top", "bottom"]) {
     60    physical[physicalSide] = isInset ? physicalSide : property.replace("*", physicalSide);
     61    prerequisites += makeDeclaration(descriptor.prerequisites, physicalSide);
     62  }
     63  shorthands[property.replace("-*", "")] =
     64    ["top", "right", "bottom", "left"].map(physicalSide => physical[physicalSide]);
     65  const type = [].concat(descriptor.type);
     66  return {logical, physical, shorthands, type, prerequisites, property};
     67}
     68
     69/**
     70 * Creates a group of physical and logical sizing properties.
     71 *
     72 * @param {string} prefix
     73 *        One of "", "max-" or "min-".
     74 */
     75export function createSizingPropertyGroup(prefix) {
     76  return {
     77    logical: {
     78      inline: `${prefix}inline-size`,
     79      block: `${prefix}block-size`,
     80    },
     81    physical: {
     82      horizontal: `${prefix}width`,
     83      vertical: `${prefix}height`,
     84    },
     85    type: ["length"],
     86    prerequisites: makeDeclaration({display: "block"}),
     87    property: (prefix ? prefix.slice(0, -1) + " " : "") + "sizing",
    1788  };
    18 
    19   // Six unique overall writing modes for property-mapping purposes.
    20   const writingModes = [
    21     {
    22       styles: [
    23         {"writing-mode": "horizontal-tb", "direction": "ltr"},
    24       ],
    25       blockStart: "top", blockEnd: "bottom", inlineStart: "left", inlineEnd: "right",
    26       block: "vertical", inline: "horizontal" },
    27     {
    28       styles: [
    29         {"writing-mode": "horizontal-tb", "direction": "rtl"},
    30       ],
    31       blockStart: "top", blockEnd: "bottom", inlineStart: "right", inlineEnd: "left",
    32       block: "vertical", inline: "horizontal" },
    33     {
    34       styles: [
    35         {"writing-mode": "vertical-rl", "direction": "rtl"},
    36         {"writing-mode": "sideways-rl", "direction": "rtl"},
    37       ],
    38       blockStart: "right", blockEnd: "left", inlineStart: "bottom", inlineEnd: "top",
    39       block: "horizontal", inline: "vertical" },
    40     {
    41       styles: [
    42         {"writing-mode": "vertical-rl", "direction": "ltr"},
    43         {"writing-mode": "sideways-rl", "direction": "ltr"},
    44       ],
    45       blockStart: "right", blockEnd: "left", inlineStart: "top", inlineEnd: "bottom",
    46       block: "horizontal", inline: "vertical" },
    47     {
    48       styles: [
    49         {"writing-mode": "vertical-lr", "direction": "rtl"},
    50         {"writing-mode": "sideways-lr", "direction": "ltr"},
    51       ],
    52       blockStart: "left", blockEnd: "right", inlineStart: "bottom", inlineEnd: "top",
    53       block: "horizontal", inline: "vertical" },
    54     {
    55       styles: [
    56         {"writing-mode": "vertical-lr", "direction": "ltr"},
    57         {"writing-mode": "sideways-lr", "direction": "rtl"},
    58       ],
    59       blockStart: "left", blockEnd: "right", inlineStart: "top", inlineEnd: "bottom",
    60       block: "horizontal", inline: "vertical" },
    61   ];
    62 
    63   function testCSSValues(testName, style, expectedValues) {
    64     for (const [property, value] of expectedValues) {
    65       assert_equals(style.getPropertyValue(property), value, `${testName}, ${property}`);
    66     }
    67   }
    68 
    69   function testComputedValues(testName, rules, expectedValues) {
    70     sheet.textContent = rules;
    71     const cs = getComputedStyle(testElement);
    72     testCSSValues(testName, cs, expectedValues);
    73     sheet.textContent = "";
    74   }
    75 
    76   function makeDeclaration(object = {}, replacement = "*") {
    77     let decl = "";
    78     for (const [property, value] of Object.entries(object)) {
    79       decl += `${property.replace("*", replacement)}: ${value}; `;
    80     }
    81     return decl;
    82   }
    83 
    84   /**
    85    * Creates a group of physical and logical box properties, such as
    86    *
    87    * { physical: {
    88    *     left: "margin-left", right: "margin-right",
    89    *     top: "margin-top", bottom: "margin-bottom",
    90    *   }, logical: {
    91    *     inlineStart: "margin-inline-start", inlineEnd: "margin-inline-end",
    92    *     blockStart: "margin-block-start", blockEnd: "margin-block-end",
    93    *   }, shorthands: {
    94    *     inline: ["margin-inline-start", "margin-inline-end"],
    95    *     block: ["margin-block-start", "margin-block-end"],
    96    *   }, type: ["length"], prerequisites: "...", property: "'margin-*'" }
    97    *
    98    * @param {string} property
    99    *        A string representing the property names, like "margin-*".
    100    * @param {Object} descriptor
    101    * @param {string|string[]} descriptor.type
    102    *        Describes the kind of values accepted by the property, like "length".
    103    *        Must be a key or a collection of keys from the `testValues` object.
    104    * @param {Object={}} descriptor.prerequisites
    105    *        Represents property declarations that are needed by `property` to work.
    106    *        For example, border-width properties require a border style.
    107    */
    108   exports.createBoxPropertyGroup = function(property, descriptor) {
    109     const logical = {};
    110     const physical = {};
    111     const shorthands = {};
    112     for (const axis of ["inline", "block"]) {
    113       const shorthand = property.replace("*", axis);
    114       const longhands = [];
    115       shorthands[shorthand] = longhands;
    116       for (const side of ["start", "end"]) {
    117         const logicalSide = axis + "-" + side;
    118         const camelCase = logicalSide.replace(/-(.)/g, (match, $1) => $1.toUpperCase());
    119         const longhand = property.replace("*", logicalSide);
    120         logical[camelCase] = longhand;
    121         longhands.push(longhand);
     89}
     90
     91/**
     92 * Tests a grup of logical and physical properties in different writing modes.
     93 *
     94 * @param {Object} group
     95 *        An object returned by createBoxPropertyGroup or createSizingPropertyGroup.
     96 */
     97export function runTests(group) {
     98  const values = testValues[group.type[0]].map(function(_, i) {
     99    return group.type.map(type => testValues[type][i]).join(" ");
     100  });
     101  const logicals = Object.values(group.logical);
     102  const physicals = Object.values(group.physical);
     103  const shorthands = group.shorthands ? Object.entries(group.shorthands) : null;
     104
     105  test(function() {
     106    const expected = [];
     107    for (const [i, logicalProp] of logicals.entries()) {
     108      testElement.style.setProperty(logicalProp, values[i]);
     109      expected.push([logicalProp, values[i]]);
     110    }
     111    testCSSValues("logical properties in inline style", testElement.style, expected);
     112  }, `Test that logical ${group.property} properties are supported.`);
     113  testElement.style.cssText = "";
     114
     115  const shorthandValues = {};
     116  for (const [shorthand, longhands] of shorthands || []) {
     117    let valueArray;
     118    if (group.type.length > 1) {
     119      valueArray = [values[0]];
     120    } else {
     121      valueArray = testValues[group.type].slice(0, longhands.length);
     122    }
     123    shorthandValues[shorthand] = valueArray;
     124    const value = valueArray.join(" ");
     125    const expected = [[shorthand, value]];
     126    for (let [i, longhand] of longhands.entries()) {
     127      expected.push([longhand, valueArray[group.type.length > 1 ? 0 : i]]);
     128    }
     129    test(function() {
     130      testElement.style.setProperty(shorthand, value);
     131      testCSSValues("shorthand in inline style", testElement.style, expected);
     132      const stylesheet = `.test { ${group.prerequisites} }`;
     133      testComputedValues("shorthand in computed style", stylesheet, expected);
     134    }, `Test that ${shorthand} shorthand sets longhands and serializes correctly.`);
     135    testElement.style.cssText = "";
     136  }
     137
     138  for (const writingMode of writingModes) {
     139    for (const style of writingMode.styles) {
     140      const writingModeDecl = makeDeclaration(style);
     141
     142      const associated = {};
     143      for (const [logicalSide, logicalProp] of Object.entries(group.logical)) {
     144        const physicalProp = group.physical[writingMode[logicalSide]];
     145        associated[logicalProp] = physicalProp;
     146        associated[physicalProp] = logicalProp;
    122147      }
    123     }
    124     const isInset = property === "inset-*";
    125     let prerequisites = "";
    126     for (const physicalSide of ["left", "right", "top", "bottom"]) {
    127       physical[physicalSide] = isInset ? physicalSide : property.replace("*", physicalSide);
    128       prerequisites += makeDeclaration(descriptor.prerequisites, physicalSide);
    129     }
    130     const type = [].concat(descriptor.type);
    131     return {name, logical, physical, shorthands, type, prerequisites, property};
    132   };
    133 
    134   /**
    135    * Creates a group of physical and logical sizing properties.
    136    *
    137    * @param {string} prefix
    138    *        One of "", "max-" or "min-".
    139    */
    140   exports.createSizingPropertyGroup = function(prefix) {
    141     return {
    142       logical: {
    143         inline: `${prefix}inline-size`,
    144         block: `${prefix}block-size`,
    145       },
    146       physical: {
    147         horizontal: `${prefix}width`,
    148         vertical: `${prefix}height`,
    149       },
    150       type: ["length"],
    151       prerequisites: makeDeclaration({display: "block"}),
    152       property: (prefix ? prefix.slice(0, -1) + " " : "") + "sizing",
    153     };
    154   };
    155 
    156   /**
    157    * Tests a grup of logical and physical properties in different writing modes.
    158    *
    159    * @param {Object} group
    160    *        An object returned by createBoxPropertyGroup or createSizingPropertyGroup.
    161    */
    162   exports.runTests = function(group) {
    163     const values = testValues[group.type[0]].map(function(_, i) {
    164       return group.type.map(type => testValues[type][i]).join(" ");
    165     });
    166     const logicals = Object.values(group.logical);
    167     const physicals = Object.values(group.physical);
    168     const shorthands = group.shorthands ? Object.entries(group.shorthands) : null;
    169 
    170     test(function() {
    171       const expected = [];
    172       for (const [i, logicalProp] of logicals.entries()) {
    173         testElement.style.setProperty(logicalProp, values[i]);
    174         expected.push([logicalProp, values[i]]);
     148
     149      // Test that logical properties are converted to their physical
     150      // equivalent correctly when all in the group are present on a single
     151      // declaration, with no overwriting of previous properties and
     152      // no physical properties present.  We put the writing mode properties
     153      // on a separate declaration to test that the computed values of these
     154      // properties are used, rather than those on the same declaration.
     155      test(function() {
     156        let decl = group.prerequisites;
     157        const expected = [];
     158        for (const [i, logicalProp] of logicals.entries()) {
     159          decl += `${logicalProp}: ${values[i]}; `;
     160          expected.push([logicalProp, values[i]]);
     161          expected.push([associated[logicalProp], values[i]]);
     162        }
     163        testComputedValues("logical properties on one declaration, writing " +
     164                           `mode properties on another, '${writingModeDecl}'`,
     165                           `.test { ${writingModeDecl} } .test { ${decl} }`,
     166                           expected);
     167      }, `Test that logical ${group.property} properties share computed values `
     168       + `with their physical associates, with '${writingModeDecl}'.`);
     169
     170      // Test logical shorthand properties.
     171      if (shorthands) {
     172        test(function() {
     173          for (const [shorthand, longhands] of shorthands) {
     174            let valueArray = shorthandValues[shorthand];
     175            const decl = group.prerequisites + `${shorthand}: ${valueArray.join(" ")}; `;
     176            const expected = [];
     177            for (let [i, longhand] of longhands.entries()) {
     178              const longhandValue = valueArray[group.type.length > 1 ? 0 : i];
     179              expected.push([longhand, longhandValue]);
     180              expected.push([associated[longhand], longhandValue]);
     181            }
     182            testComputedValues("shorthand properties on one declaration, writing " +
     183                               `mode properties on another, '${writingModeDecl}'`,
     184                               `.test { ${writingModeDecl} } .test { ${decl} }`,
     185                               expected);
     186          }
     187        }, `Test that ${group.property} shorthands set the computed value of both `
     188         + `logical and physical longhands, with '${writingModeDecl}'.`);
    175189      }
    176       testCSSValues("logical properties in inline style", testElement.style, expected);
    177     }, `Test that logical ${group.property} properties are supported.`);
    178     testElement.style.cssText = "";
    179 
    180     for (const writingMode of writingModes) {
    181       for (const style of writingMode.styles) {
    182         const writingModeDecl = makeDeclaration(style);
    183 
    184         const associated = {};
    185         for (const [logicalSide, logicalProp] of Object.entries(group.logical)) {
    186           const physicalProp = group.physical[writingMode[logicalSide]];
    187           associated[logicalProp] = physicalProp;
    188           associated[physicalProp] = logicalProp;
     190
     191      // Test that logical and physical properties are cascaded together,
     192      // honoring their relative order on a single declaration
     193      // (a) with a single logical property after the physical ones
     194      // (b) with a single physical property after the logical ones
     195      test(function() {
     196        for (const lastIsLogical of [true, false]) {
     197          const lasts = lastIsLogical ? logicals : physicals;
     198          const others = lastIsLogical ? physicals : logicals;
     199          for (const lastProp of lasts) {
     200            let decl = writingModeDecl + group.prerequisites;
     201            const expected = [];
     202            for (const [i, prop] of others.entries()) {
     203              decl += `${prop}: ${values[i]}; `;
     204              const valueIdx = associated[prop] === lastProp ? others.length : i;
     205              expected.push([prop, values[valueIdx]]);
     206              expected.push([associated[prop], values[valueIdx]]);
     207            }
     208            decl += `${lastProp}: ${values[others.length]}; `;
     209            testComputedValues(`'${lastProp}' last on single declaration, '${writingModeDecl}'`,
     210                               `.test { ${decl} }`,
     211                               expected);
     212          }
    189213        }
    190 
    191         // Test that logical properties are converted to their physical
    192         // equivalent correctly when all in the group are present on a single
    193         // declaration, with no overwriting of previous properties and
    194         // no physical properties present.  We put the writing mode properties
    195         // on a separate declaration to test that the computed values of these
    196         // properties are used, rather than those on the same declaration.
    197         test(function() {
    198           let decl = group.prerequisites;
    199           const expected = [];
    200           for (const [i, logicalProp] of logicals.entries()) {
    201             decl += `${logicalProp}: ${values[i]}; `;
    202             expected.push([logicalProp, values[i]]);
    203             expected.push([associated[logicalProp], values[i]]);
    204           }
    205           testComputedValues("logical properties on one declaration, writing " +
    206                              `mode properties on another, '${writingModeDecl}'`,
    207                              `.test { ${writingModeDecl} } .test { ${decl} }`,
    208                              expected);
    209         }, `Test that logical ${group.property} properties share computed values `
    210          + `with their physical associates, with '${writingModeDecl}'.`);
    211 
    212 
    213         // Test logical shorthand properties.
    214         if (shorthands) {
    215           test(function() {
    216             for (const [shorthand, longhands] of shorthands) {
    217               let shorthandValues;
    218               if (group.type.length > 1) {
    219                 shorthandValues = [values[0]];
    220               } else {
    221                 shorthandValues = testValues[group.type].slice(0, longhands.length);
    222               }
    223               const decl = group.prerequisites + `${shorthand}: ${shorthandValues.join(" ")}; `;
    224               const expected = [];
    225               for (let [i, longhand] of longhands.entries()) {
    226                 const longhandValue = shorthandValues[group.type.length > 1 ? 0 : i];
    227                 expected.push([longhand, longhandValue]);
    228                 expected.push([associated[longhand], longhandValue]);
    229               }
    230               testComputedValues("shorthand properties on one declaration, writing " +
    231                                  `mode properties on another, '${writingModeDecl}'`,
    232                                  `.test { ${writingModeDecl} } .test { ${decl} }`,
    233                                  expected);
     214      }, `Test that ${group.property} properties honor order of appearance when both `
     215       + `logical and physical associates are declared, with '${writingModeDecl}'.`);
     216
     217      // Test that logical and physical properties are cascaded properly when
     218      // on different declarations
     219      // (a) with a logical property in the high specificity rule
     220      // (b) with a physical property in the high specificity rule
     221      test(function() {
     222        for (const highIsLogical of [true, false]) {
     223          let lowDecl = writingModeDecl + group.prerequisites;
     224          const high = highIsLogical ? logicals : physicals;
     225          const others = highIsLogical ? physicals : logicals;
     226          for (const [i, prop] of others.entries()) {
     227            lowDecl += `${prop}: ${values[i]}; `;
     228          }
     229          for (const highProp of high) {
     230            const highDecl = `${highProp}: ${values[others.length]}; `;
     231            const expected = [];
     232            for (const [i, prop] of others.entries()) {
     233              const valueIdx = associated[prop] === highProp ? others.length : i;
     234              expected.push([prop, values[valueIdx]]);
     235              expected.push([associated[prop], values[valueIdx]]);
    234236            }
    235           }, `Test that ${group.property} shorthands set the computed value of both `
    236            + `logical and physical longhands, with '${writingModeDecl}'.`);
     237            testComputedValues(`'${highProp}', two declarations, '${writingModeDecl}'`,
     238                               `#test { ${highDecl} } .test { ${lowDecl} }`,
     239                               expected);
     240          }
    237241        }
    238 
    239         // Test that logical and physical properties are cascaded together,
    240         // honoring their relative order on a single declaration
    241         // (a) with a single logical property after the physical ones
    242         // (b) with a single physical property after the logical ones
    243         test(function() {
    244           for (const lastIsLogical of [true, false]) {
    245             const lasts = lastIsLogical ? logicals : physicals;
    246             const others = lastIsLogical ? physicals : logicals;
    247             for (const lastProp of lasts) {
    248               let decl = writingModeDecl + group.prerequisites;
    249               const expected = [];
    250               for (const [i, prop] of others.entries()) {
    251                 decl += `${prop}: ${values[i]}; `;
    252                 const valueIdx = associated[prop] === lastProp ? others.length : i;
    253                 expected.push([prop, values[valueIdx]]);
    254                 expected.push([associated[prop], values[valueIdx]]);
    255               }
    256               decl += `${lastProp}: ${values[others.length]}; `;
    257               testComputedValues(`'${lastProp}' last on single declaration, '${writingModeDecl}'`,
    258                                  `.test { ${decl} }`,
    259                                  expected);
    260             }
    261           }
    262         }, `Test that ${group.property} properties honor order of appearance when both `
    263          + `logical and physical associates are declared, with '${writingModeDecl}'.`);
    264 
    265         // Test that logical and physical properties are cascaded properly when
    266         // on different declarations
    267         // (a) with a logical property in the high specificity rule
    268         // (b) with a physical property in the high specificity rule
    269         test(function() {
    270           for (const highIsLogical of [true, false]) {
    271             let lowDecl = writingModeDecl + group.prerequisites;
    272             const high = highIsLogical ? logicals : physicals;
    273             const others = highIsLogical ? physicals : logicals;
    274             for (const [i, prop] of others.entries()) {
    275               lowDecl += `${prop}: ${values[i]}; `;
    276             }
    277             for (const highProp of high) {
    278               const highDecl = `${highProp}: ${values[others.length]}; `;
    279               const expected = [];
    280               for (const [i, prop] of others.entries()) {
    281                 const valueIdx = associated[prop] === highProp ? others.length : i;
    282                 expected.push([prop, values[valueIdx]]);
    283                 expected.push([associated[prop], values[valueIdx]]);
    284               }
    285               testComputedValues(`'${highProp}', two declarations, '${writingModeDecl}'`,
    286                                  `#test { ${highDecl} } .test { ${lowDecl} }`,
    287                                  expected);
    288             }
    289           }
    290         }, `Test that ${group.property} properties honor selector specificty when both `
    291          + `logical and physical associates are declared, with '${writingModeDecl}'.`);
    292       }
    293     }
    294   };
    295 })(window);
     242      }, `Test that ${group.property} properties honor selector specificty when both `
     243       + `logical and physical associates are declared, with '${writingModeDecl}'.`);
     244    }
     245  }
     246}
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/resources/w3c-import.log

    r238262 r240251  
    1616List of files:
    1717/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/resources/test-box-properties.js
     18/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/resources/test-shared.js
  • trunk/Source/WebCore/ChangeLog

    r240249 r240251  
     12019-01-22  Oriol Brufau  <obrufau@igalia.com>
     2
     3        [css-logical] Implement flow-relative margin, padding and border shorthands
     4        https://bugs.webkit.org/show_bug.cgi?id=188697
     5
     6        Reviewed by Simon Fraser and Antti Koivisto.
     7
     8        Tests: imported/w3c/web-platform-tests/css/css-logical/logical-box-border-color.html
     9               imported/w3c/web-platform-tests/css/css-logical/logical-box-border-shorthands.html
     10               imported/w3c/web-platform-tests/css/css-logical/logical-box-border-style.html
     11               imported/w3c/web-platform-tests/css/css-logical/logical-box-border-width.html
     12               imported/w3c/web-platform-tests/css/css-logical/logical-box-margin.html
     13               imported/w3c/web-platform-tests/css/css-logical/logical-box-padding.html
     14               webexposed/css-properties-behind-flags.html
     15
     16        * css/CSSComputedStyleDeclaration.cpp:
     17        (WebCore::ComputedStyleExtractor::valueForPropertyinStyle):
     18        Allow the new properties to serialize their computed value.
     19
     20        (WebCore::ComputedStyleExtractor::getCSSPropertyValuesFor2SidesShorthand):
     21        (WebCore::ComputedStyleExtractor::getCSSPropertyValuesFor4SidesShorthand):
     22        * css/CSSComputedStyleDeclaration.h:
     23        Rename getCSSPropertyValuesForSidesShorthand to getCSSPropertyValuesFor4SidesShorthand,
     24        and add analogous getCSSPropertyValuesFor2SidesShorthand for serializing 2-sided
     25        shorthands.
     26
     27        * css/CSSProperties.json:
     28        Add the new properties behind the CSSLogicalEnabled runtime flag.
     29
     30        * css/CSSStyleDeclaration.cpp:
     31        (WebCore::CSSStyleDeclaration::supportedPropertyNames const):
     32        Prevent CSS properties disabled behind a runtime flag from being exposed in
     33        style declarations.
     34
     35        * css/StyleProperties.cpp:
     36        (WebCore::StyleProperties::getPropertyValue const):
     37        Allow the new properties to serialize their specified value.
     38
     39        (WebCore::StyleProperties::get2Values const):
     40        Add get2Values, analogous to get4Values, for serializing 2-sided shorthands.
     41
     42        (WebCore::StyleProperties::borderPropertyValue const):
     43        Allow borderPropertyValue to serialize arbitrary multi-sided border shorthands
     44        corresponding to width, style and color.
     45
     46        (WebCore::MutableStyleProperties::setProperty):
     47        Prevent CSS properties disabled behind a runtime flag from being set a value.
     48
     49        (WebCore::StyleProperties::asText const):
     50        Allow the new properties to be serialized in cssText.
     51        Prevent CSS shorthands disabled behind a runtime flag from appearing in cssText,
     52        and serialize the longhands instead. Note that there could be another shorthand
     53        available which is enabled, but a proper solution would require bug 190496.
     54
     55        * css/StyleProperties.h:
     56        Update declarations of borderPropertyValue and get2Values.
     57
     58        * css/makeprop.pl:
     59        (addProperty):
     60        Add isEnabledCSSProperty function for checking that a CSS property is not
     61        disabled behind a runtime flag.
     62
     63        * css/parser/CSSPropertyParser.cpp:
     64        (WebCore::cssPropertyID):
     65        Prevent CSS properties disabled behind a runtime flag from being exposed in
     66        computed styles.
     67
     68        (WebCore::CSSPropertyParser::addProperty):
     69        Prevent CSS properties disabled behind a runtime flag from being set a value.
     70
     71        (WebCore::CSSPropertyParser::consumeBorder):
     72        Change consumeBorder to provide the caller with the parsed values instead of
     73        setting properties. Then the caller can decide to which properties the values
     74        should be set, and whether border-image should be reset or not.
     75
     76        (WebCore::CSSPropertyParser::consume2ValueShorthand):
     77        (WebCore::CSSPropertyParser::consume4ValueShorthand):
     78        Rename consume4Values to consume4ValueShorthand, and add analogous
     79        consume2ValueShorthand for parsing shorthands with two longhands.
     80
     81        (WebCore::CSSPropertyParser::parseShorthand):
     82        Allow the new properties to be parsed.
     83
     84        * css/parser/CSSPropertyParser.h:
     85        Update declarations of consumeBorder, consume2ValueShorthand and
     86        consume4ValueShorthand.
     87
     88        * inspector/agents/InspectorCSSAgent.cpp:
     89        (WebCore::InspectorCSSAgent::getSupportedCSSProperties):
     90        Prevent CSS properties disabled behind a runtime flag from being exposed in
     91        the CSS inspector tool.
     92
     93        * page/RuntimeEnabledFeatures.h:
     94        (WebCore::RuntimeEnabledFeatures::setCSSLogicalEnabled):
     95        (WebCore::RuntimeEnabledFeatures::cssLogicalEnabled const):
     96        Add the CSSLogicalEnabled runtime flag.
     97
    1982019-01-21  Antti Koivisto  <antti@apple.com>
    299
  • trunk/Source/WebCore/css/CSSComputedStyleDeclaration.cpp

    r239978 r240251  
    39303930            return value;
    39313931        }
     3932        case CSSPropertyBorderBlock: {
     3933            auto value = propertyValue(CSSPropertyBorderBlockStart, DoNotUpdateLayout);
     3934            if (!compareCSSValuePtr<CSSValue>(value, propertyValue(CSSPropertyBorderBlockEnd, DoNotUpdateLayout)))
     3935                return nullptr;
     3936            return value;
     3937        }
     3938        case CSSPropertyBorderBlockColor:
     3939            return getCSSPropertyValuesFor2SidesShorthand(borderBlockColorShorthand());
     3940        case CSSPropertyBorderBlockStyle:
     3941            return getCSSPropertyValuesFor2SidesShorthand(borderBlockStyleShorthand());
     3942        case CSSPropertyBorderBlockWidth:
     3943            return getCSSPropertyValuesFor2SidesShorthand(borderBlockWidthShorthand());
    39323944        case CSSPropertyBorderBottom:
    39333945            return getCSSPropertyValuesForShorthandProperties(borderBottomShorthand());
    39343946        case CSSPropertyBorderColor:
    3935             return getCSSPropertyValuesForSidesShorthand(borderColorShorthand());
     3947            return getCSSPropertyValuesFor4SidesShorthand(borderColorShorthand());
    39363948        case CSSPropertyBorderLeft:
    39373949            return getCSSPropertyValuesForShorthandProperties(borderLeftShorthand());
    39383950        case CSSPropertyBorderImage:
    39393951            return valueForNinePieceImage(style.borderImage());
     3952        case CSSPropertyBorderInline: {
     3953            auto value = propertyValue(CSSPropertyBorderInlineStart, DoNotUpdateLayout);
     3954            if (!compareCSSValuePtr<CSSValue>(value, propertyValue(CSSPropertyBorderInlineEnd, DoNotUpdateLayout)))
     3955                return nullptr;
     3956            return value;
     3957        }
     3958        case CSSPropertyBorderInlineColor:
     3959            return getCSSPropertyValuesFor2SidesShorthand(borderInlineColorShorthand());
     3960        case CSSPropertyBorderInlineStyle:
     3961            return getCSSPropertyValuesFor2SidesShorthand(borderInlineStyleShorthand());
     3962        case CSSPropertyBorderInlineWidth:
     3963            return getCSSPropertyValuesFor2SidesShorthand(borderInlineWidthShorthand());
    39403964        case CSSPropertyBorderRadius:
    39413965            return borderRadiusShorthandValue(style);
     
    39433967            return getCSSPropertyValuesForShorthandProperties(borderRightShorthand());
    39443968        case CSSPropertyBorderStyle:
    3945             return getCSSPropertyValuesForSidesShorthand(borderStyleShorthand());
     3969            return getCSSPropertyValuesFor4SidesShorthand(borderStyleShorthand());
    39463970        case CSSPropertyBorderTop:
    39473971            return getCSSPropertyValuesForShorthandProperties(borderTopShorthand());
    39483972        case CSSPropertyBorderWidth:
    3949             return getCSSPropertyValuesForSidesShorthand(borderWidthShorthand());
     3973            return getCSSPropertyValuesFor4SidesShorthand(borderWidthShorthand());
    39503974        case CSSPropertyColumnRule:
    39513975            return getCSSPropertyValuesForShorthandProperties(columnRuleShorthand());
     
    39553979            return getCSSPropertyValuesForShorthandProperties(listStyleShorthand());
    39563980        case CSSPropertyMargin:
    3957             return getCSSPropertyValuesForSidesShorthand(marginShorthand());
     3981            return getCSSPropertyValuesFor4SidesShorthand(marginShorthand());
     3982        case CSSPropertyMarginBlock:
     3983            return getCSSPropertyValuesFor2SidesShorthand(marginBlockShorthand());
     3984        case CSSPropertyMarginInline:
     3985            return getCSSPropertyValuesFor2SidesShorthand(marginInlineShorthand());
    39583986        case CSSPropertyOutline:
    39593987            return getCSSPropertyValuesForShorthandProperties(outlineShorthand());
    39603988        case CSSPropertyPadding:
    3961             return getCSSPropertyValuesForSidesShorthand(paddingShorthand());
    3962 
     3989            return getCSSPropertyValuesFor4SidesShorthand(paddingShorthand());
     3990        case CSSPropertyPaddingBlock:
     3991            return getCSSPropertyValuesFor2SidesShorthand(paddingBlockShorthand());
     3992        case CSSPropertyPaddingInline:
     3993            return getCSSPropertyValuesFor2SidesShorthand(paddingInlineShorthand());
    39633994#if ENABLE(CSS_SCROLL_SNAP)
    39643995        case CSSPropertyScrollSnapMargin:
    3965             return getCSSPropertyValuesForSidesShorthand(scrollSnapMarginShorthand());
     3996            return getCSSPropertyValuesFor4SidesShorthand(scrollSnapMarginShorthand());
    39663997        case CSSPropertyScrollSnapMarginBottom:
    39673998            return zoomAdjustedPixelValueForLength(style.scrollSnapMarginBottom(), style);
     
    39734004            return zoomAdjustedPixelValueForLength(style.scrollSnapMarginLeft(), style);
    39744005        case CSSPropertyScrollPadding:
    3975             return getCSSPropertyValuesForSidesShorthand(scrollPaddingShorthand());
     4006            return getCSSPropertyValuesFor4SidesShorthand(scrollPaddingShorthand());
    39764007        case CSSPropertyScrollPaddingBottom:
    39774008            return zoomAdjustedPixelValueForLength(style.scrollPaddingBottom(), style);
     
    42534284}
    42544285
    4255 RefPtr<CSSValueList> ComputedStyleExtractor::getCSSPropertyValuesForSidesShorthand(const StylePropertyShorthand& shorthand)
     4286RefPtr<CSSValueList> ComputedStyleExtractor::getCSSPropertyValuesFor2SidesShorthand(const StylePropertyShorthand& shorthand)
     4287{
     4288    auto list = CSSValueList::createSpaceSeparated();
     4289
     4290    // Assume the properties are in the usual order start, end.
     4291    auto startValue = propertyValue(shorthand.properties()[0], DoNotUpdateLayout);
     4292    auto endValue = propertyValue(shorthand.properties()[1], DoNotUpdateLayout);
     4293
     4294    // All 2 properties must be specified.
     4295    if (!startValue || !endValue)
     4296        return nullptr;
     4297
     4298    bool showEnd = !compareCSSValuePtr(startValue, endValue);
     4299
     4300    list->append(startValue.releaseNonNull());
     4301    if (showEnd)
     4302        list->append(endValue.releaseNonNull());
     4303
     4304    return WTFMove(list);
     4305}
     4306
     4307RefPtr<CSSValueList> ComputedStyleExtractor::getCSSPropertyValuesFor4SidesShorthand(const StylePropertyShorthand& shorthand)
    42564308{
    42574309    auto list = CSSValueList::createSpaceSeparated();
  • trunk/Source/WebCore/css/CSSComputedStyleDeclaration.h

    r239535 r240251  
    9393
    9494    Ref<CSSValueList> getCSSPropertyValuesForShorthandProperties(const StylePropertyShorthand&);
    95     RefPtr<CSSValueList> getCSSPropertyValuesForSidesShorthand(const StylePropertyShorthand&);
     95    RefPtr<CSSValueList> getCSSPropertyValuesFor2SidesShorthand(const StylePropertyShorthand&);
     96    RefPtr<CSSValueList> getCSSPropertyValuesFor4SidesShorthand(const StylePropertyShorthand&);
    9697    Ref<CSSValueList> getBackgroundShorthandValue();
    9798    Ref<CSSValueList> getCSSPropertyValuesForGridShorthand(const StylePropertyShorthand&);
  • trunk/Source/WebCore/css/CSSProperties.json

    r239978 r240251  
    125125        "generate code when the macro define is not enabled.",
    126126        "",
     127        "* runtime-flag:",
     128        "The name of the flag on RuntimeEnabledFeatures (e.g. \"cssLogical\")",
     129        "that conditionally enables the property.",
     130        "",
    127131        "2. Lesser known capabilities of this file format",
    128132        "",
     
    11931197            }
    11941198        },
     1199        "border-block": {
     1200            "codegen-properties": {
     1201                "runtime-flag": "cssLogical",
     1202                "longhands": [
     1203                    "border-block-start-color",
     1204                    "border-block-start-style",
     1205                    "border-block-start-width",
     1206                    "border-block-end-color",
     1207                    "border-block-end-style",
     1208                    "border-block-end-width"
     1209                ]
     1210            },
     1211            "specification": {
     1212                "category": "css-logical-props",
     1213                "url": "https://www.w3.org/TR/css-logical/#border-shorthands"
     1214            }
     1215        },
     1216        "border-block-color": {
     1217            "codegen-properties": {
     1218                "runtime-flag": "cssLogical",
     1219                "longhands": [
     1220                    "border-block-start-color",
     1221                    "border-block-end-color"
     1222                ]
     1223            },
     1224            "specification": {
     1225                "category": "css-logical-props",
     1226                "url": "https://www.w3.org/TR/css-logical/#border-color"
     1227            }
     1228        },
    11951229        "border-block-end": {
    11961230            "codegen-properties": {
     
    13211355            }
    13221356        },
     1357        "border-block-style": {
     1358            "codegen-properties": {
     1359                "runtime-flag": "cssLogical",
     1360                "longhands": [
     1361                    "border-block-start-style",
     1362                    "border-block-end-style"
     1363                ]
     1364            },
     1365            "specification": {
     1366                "category": "css-logical-props",
     1367                "url": "https://www.w3.org/TR/css-logical/#border-style"
     1368            }
     1369        },
     1370        "border-block-width": {
     1371            "codegen-properties": {
     1372                "runtime-flag": "cssLogical",
     1373                "longhands": [
     1374                    "border-block-start-width",
     1375                    "border-block-end-width"
     1376                ]
     1377            },
     1378            "specification": {
     1379                "category": "css-logical-props",
     1380                "url": "https://www.w3.org/TR/css-logical/#border-width"
     1381            }
     1382        },
    13231383        "border-bottom": {
    13241384            "codegen-properties": {
     
    14901550            }
    14911551        },
     1552        "border-inline": {
     1553            "codegen-properties": {
     1554                "runtime-flag": "cssLogical",
     1555                "longhands": [
     1556                    "border-inline-start-color",
     1557                    "border-inline-start-style",
     1558                    "border-inline-start-width",
     1559                    "border-inline-end-color",
     1560                    "border-inline-end-style",
     1561                    "border-inline-end-width"
     1562                ]
     1563            },
     1564            "specification": {
     1565                "category": "css-logical-props",
     1566                "url": "https://www.w3.org/TR/css-logical/#border-shorthands"
     1567            }
     1568        },
     1569        "border-inline-color": {
     1570            "codegen-properties": {
     1571                "runtime-flag": "cssLogical",
     1572                "longhands": [
     1573                    "border-inline-start-color",
     1574                    "border-inline-end-color"
     1575                ]
     1576            },
     1577            "specification": {
     1578                "category": "css-logical-props",
     1579                "url": "https://www.w3.org/TR/css-logical/#border-color"
     1580            }
     1581        },
    14921582        "border-inline-end": {
    14931583            "codegen-properties": {
     
    16121702                ],
    16131703                "skip-builder": true
     1704            },
     1705            "specification": {
     1706                "category": "css-logical-props",
     1707                "url": "https://www.w3.org/TR/css-logical/#border-width"
     1708            }
     1709        },
     1710        "border-inline-style": {
     1711            "codegen-properties": {
     1712                "runtime-flag": "cssLogical",
     1713                "longhands": [
     1714                    "border-inline-start-style",
     1715                    "border-inline-end-style"
     1716                ]
     1717            },
     1718            "specification": {
     1719                "category": "css-logical-props",
     1720                "url": "https://www.w3.org/TR/css-logical/#border-style"
     1721            }
     1722        },
     1723        "border-inline-width": {
     1724            "codegen-properties": {
     1725                "runtime-flag": "cssLogical",
     1726                "longhands": [
     1727                    "border-inline-start-width",
     1728                    "border-inline-end-width"
     1729                ]
    16141730            },
    16151731            "specification": {
     
    26482764            }
    26492765        },
    2650         "margin-block-end": {
    2651             "codegen-properties": {
    2652                 "aliases": [
    2653                     "-webkit-margin-after"
    2654                 ],
    2655                 "skip-builder": true
     2766        "margin-block": {
     2767            "codegen-properties": {
     2768                "runtime-flag": "cssLogical",
     2769                "longhands": [
     2770                    "margin-block-start",
     2771                    "margin-block-end"
     2772                ]
    26562773            },
    26572774            "specification": {
     
    26602777            }
    26612778        },
    2662         "margin-block-start": {
    2663             "codegen-properties": {
    2664                 "aliases": [
    2665                     "-webkit-margin-before"
     2779        "margin-block-end": {
     2780            "codegen-properties": {
     2781                "aliases": [
     2782                    "-webkit-margin-after"
    26662783                ],
    26672784                "skip-builder": true
     
    26722789            }
    26732790        },
     2791        "margin-block-start": {
     2792            "codegen-properties": {
     2793                "aliases": [
     2794                    "-webkit-margin-before"
     2795                ],
     2796                "skip-builder": true
     2797            },
     2798            "specification": {
     2799                "category": "css-logical-props",
     2800                "url": "https://www.w3.org/TR/css-logical/#margin-properties"
     2801            }
     2802        },
    26742803        "margin-bottom": {
    26752804            "codegen-properties": {
     
    26802809                "category": "css-22",
    26812810                "url": "https://www.w3.org/TR/CSS22/box.html#propdef-margin-bottom"
     2811            }
     2812        },
     2813        "margin-inline": {
     2814            "codegen-properties": {
     2815                "runtime-flag": "cssLogical",
     2816                "longhands": [
     2817                    "margin-inline-start",
     2818                    "margin-inline-end"
     2819                ]
     2820            },
     2821            "specification": {
     2822                "category": "css-logical-props",
     2823                "url": "https://www.w3.org/TR/css-logical/#margin-properties"
    26822824            }
    26832825        },
     
    30683210            }
    30693211        },
    3070         "padding-block-end": {
    3071             "codegen-properties": {
    3072                 "aliases": [
    3073                     "-webkit-padding-after"
    3074                 ],
    3075                 "skip-builder": true
     3212        "padding-block": {
     3213            "codegen-properties": {
     3214                "runtime-flag": "cssLogical",
     3215                "longhands": [
     3216                    "padding-block-start",
     3217                    "padding-block-end"
     3218                ]
    30763219            },
    30773220            "specification": {
     
    30803223            }
    30813224        },
    3082         "padding-block-start": {
    3083             "codegen-properties": {
    3084                 "aliases": [
    3085                     "-webkit-padding-before"
     3225        "padding-block-end": {
     3226            "codegen-properties": {
     3227                "aliases": [
     3228                    "-webkit-padding-after"
    30863229                ],
    30873230                "skip-builder": true
     
    30923235            }
    30933236        },
     3237        "padding-block-start": {
     3238            "codegen-properties": {
     3239                "aliases": [
     3240                    "-webkit-padding-before"
     3241                ],
     3242                "skip-builder": true
     3243            },
     3244            "specification": {
     3245                "category": "css-logical-props",
     3246                "url": "https://www.w3.org/TR/css-logical/#padding-properties"
     3247            }
     3248        },
    30943249        "padding-bottom": {
    30953250            "codegen-properties": {
     
    31003255                "category": "css-22",
    31013256                "url": "https://www.w3.org/TR/CSS22/box.html#propdef-padding-bottom"
     3257            }
     3258        },
     3259        "padding-inline": {
     3260            "codegen-properties": {
     3261                "runtime-flag": "cssLogical",
     3262                "longhands": [
     3263                    "padding-inline-start",
     3264                    "padding-inline-end"
     3265                ]
     3266            },
     3267            "specification": {
     3268                "category": "css-logical-props",
     3269                "url": "https://www.w3.org/TR/css-logical/#padding-properties"
    31023270            }
    31033271        },
  • trunk/Source/WebCore/css/CSSStyleDeclaration.cpp

    r239427 r240251  
    242242    auto* hashTableEntry = findProperty(name, outputLength);
    243243    if (auto propertyID = hashTableEntry ? hashTableEntry->id : 0) {
    244         propertyInfo.hadPixelOrPosPrefix = hadPixelOrPosPrefix;
    245         propertyInfo.propertyID = static_cast<CSSPropertyID>(propertyID);
    246         propertyInfoCache.get().add(propertyNameString, propertyInfo);
     244        auto id = static_cast<CSSPropertyID>(propertyID);
     245        if (isEnabledCSSProperty(id)) {
     246            propertyInfo.hadPixelOrPosPrefix = hadPixelOrPosPrefix;
     247            propertyInfo.propertyID = id;
     248            propertyInfoCache.get().add(propertyNameString, propertyInfo);
     249        }
    247250    }
    248251    return propertyInfo;
     
    309312Vector<AtomicString> CSSStyleDeclaration::supportedPropertyNames() const
    310313{
     314    static unsigned numNames = 0;
    311315    static const AtomicString* const cssPropertyNames = [] {
    312316        String names[numCSSProperties];
    313         for (int i = 0; i < numCSSProperties; ++i)
    314             names[i] = getJSPropertyName(static_cast<CSSPropertyID>(firstCSSProperty + i));
    315         std::sort(&names[0], &names[numCSSProperties], WTF::codePointCompareLessThan);
    316         auto* identifiers = new AtomicString[numCSSProperties];
    317         for (int i = 0; i < numCSSProperties; ++i)
     317        for (int i = 0; i < numCSSProperties; ++i) {
     318            CSSPropertyID id = static_cast<CSSPropertyID>(firstCSSProperty + i);
     319            if (isEnabledCSSProperty(id))
     320                names[numNames++] = getJSPropertyName(id);
     321        }
     322        std::sort(&names[0], &names[numNames], WTF::codePointCompareLessThan);
     323        auto* identifiers = new AtomicString[numNames];
     324        for (unsigned i = 0; i < numNames; ++i)
    318325            identifiers[i] = names[i];
    319326        return identifiers;
     
    321328
    322329    Vector<AtomicString> result;
    323     result.reserveInitialCapacity(numCSSProperties);
    324 
    325     for (unsigned i = 0; i < numCSSProperties; ++i)
     330    result.reserveInitialCapacity(numNames);
     331
     332    for (unsigned i = 0; i < numNames; ++i)
    326333        result.uncheckedAppend(cssPropertyNames[i]);
    327334
  • trunk/Source/WebCore/css/StyleProperties.cpp

    r239427 r240251  
    151151        return getLayeredShorthandValue(backgroundShorthand());
    152152    case CSSPropertyBorder:
    153         return borderPropertyValue();
     153        return borderPropertyValue(borderWidthShorthand(), borderStyleShorthand(), borderColorShorthand());
    154154    case CSSPropertyBorderTop:
    155155        return getShorthandValue(borderTopShorthand());
     
    160160    case CSSPropertyBorderLeft:
    161161        return getShorthandValue(borderLeftShorthand());
     162    case CSSPropertyBorderBlock:
     163        return borderPropertyValue(borderBlockWidthShorthand(), borderBlockStyleShorthand(), borderBlockColorShorthand());
     164    case CSSPropertyBorderBlockColor:
     165        return get2Values(borderBlockColorShorthand());
     166    case CSSPropertyBorderBlockStyle:
     167        return get2Values(borderBlockStyleShorthand());
     168    case CSSPropertyBorderBlockWidth:
     169        return get2Values(borderBlockWidthShorthand());
    162170    case CSSPropertyBorderBlockStart:
    163171        return getShorthandValue(borderBlockStartShorthand());
    164172    case CSSPropertyBorderBlockEnd:
    165173        return getShorthandValue(borderBlockEndShorthand());
     174    case CSSPropertyBorderInline:
     175        return borderPropertyValue(borderInlineWidthShorthand(), borderInlineStyleShorthand(), borderInlineColorShorthand());
     176    case CSSPropertyBorderInlineColor:
     177        return get2Values(borderInlineColorShorthand());
     178    case CSSPropertyBorderInlineStyle:
     179        return get2Values(borderInlineStyleShorthand());
     180    case CSSPropertyBorderInlineWidth:
     181        return get2Values(borderInlineWidthShorthand());
    166182    case CSSPropertyBorderInlineStart:
    167183        return getShorthandValue(borderInlineStartShorthand());
     
    204220    case CSSPropertyMargin:
    205221        return get4Values(marginShorthand());
     222    case CSSPropertyMarginBlock:
     223        return get2Values(marginBlockShorthand());
     224    case CSSPropertyMarginInline:
     225        return get2Values(marginInlineShorthand());
    206226    case CSSPropertyWebkitMarginCollapse:
    207227        return getShorthandValue(webkitMarginCollapseShorthand());
     
    210230    case CSSPropertyPadding:
    211231        return get4Values(paddingShorthand());
     232    case CSSPropertyPaddingBlock:
     233        return get2Values(paddingBlockShorthand());
     234    case CSSPropertyPaddingInline:
     235        return get2Values(paddingInlineShorthand());
    212236    case CSSPropertyTransition:
    213237        return getLayeredShorthandValue(transitionShorthand());
     
    357381}
    358382
     383String StyleProperties::get2Values(const StylePropertyShorthand& shorthand) const
     384{
     385    // Assume the properties are in the usual order start, end.
     386    int startValueIndex = findPropertyIndex(shorthand.properties()[0]);
     387    int endValueIndex = findPropertyIndex(shorthand.properties()[1]);
     388
     389    if (startValueIndex == -1 || endValueIndex == -1)
     390        return { };
     391
     392    auto start = propertyAt(startValueIndex);
     393    auto end = propertyAt(endValueIndex);
     394
     395    // All 2 properties must be specified.
     396    if (!start.value() || !end.value())
     397        return { };
     398
     399    // Important flags must be the same
     400    if (start.isImportant() != end.isImportant())
     401        return { };
     402
     403    if (start.isInherited() && end.isInherited())
     404        return getValueName(CSSValueInherit);
     405
     406    if (start.value()->isInitialValue() || end.value()->isInitialValue()) {
     407        if (start.value()->isInitialValue() && end.value()->isInitialValue() && !start.isImplicit())
     408            return getValueName(CSSValueInitial);
     409        return { };
     410    }
     411
     412    StringBuilder result;
     413    result.append(start.value()->cssText());
     414    if (!start.value()->equals(*end.value())) {
     415        result.append(' ');
     416        result.append(end.value()->cssText());
     417    }
     418    return result.toString();
     419}
     420
    359421String StyleProperties::get4Values(const StylePropertyShorthand& shorthand) const
    360422{
     
    622684}
    623685
    624 String StyleProperties::borderPropertyValue() const
    625 {
    626     const StylePropertyShorthand properties[3] = { borderWidthShorthand(), borderStyleShorthand(), borderColorShorthand() };
     686String StyleProperties::borderPropertyValue(const StylePropertyShorthand& width, const StylePropertyShorthand& style, const StylePropertyShorthand& color) const
     687{
     688    const StylePropertyShorthand properties[3] = { width, style, color };
    627689    String commonValue;
    628690    StringBuilder result;
     
    764826bool MutableStyleProperties::setProperty(CSSPropertyID propertyID, const String& value, bool important, CSSParserContext parserContext)
    765827{
     828    if (!isEnabledCSSProperty(propertyID))
     829        return false;
     830
    766831    // Setting the value to an empty string just removes the property in both IE and Gecko.
    767832    // Setting it to null seems to produce less consistent results, but we treat it just the same.
     
    910975        CSSPropertyID shorthandPropertyID = CSSPropertyInvalid;
    911976        CSSPropertyID borderFallbackShorthandProperty = CSSPropertyInvalid;
     977        CSSPropertyID borderBlockFallbackShorthandProperty = CSSPropertyInvalid;
     978        CSSPropertyID borderInlineFallbackShorthandProperty = CSSPropertyInvalid;
    912979        String value;
     980        auto serializeBorderShorthand = [&] (const CSSPropertyID borderProperty, const CSSPropertyID fallbackProperty) {
     981            // FIXME: Deal with cases where only some of border sides are specified.
     982            ASSERT(borderProperty - firstCSSProperty < shorthandPropertyAppeared.size());
     983            if (!shorthandPropertyAppeared[borderProperty - firstCSSProperty] && isEnabledCSSProperty(borderProperty)) {
     984                value = getPropertyValue(borderProperty);
     985                if (value.isNull())
     986                    shorthandPropertyAppeared.set(borderProperty - firstCSSProperty);
     987                else
     988                    shorthandPropertyID = borderProperty;
     989            } else if (shorthandPropertyUsed[borderProperty - firstCSSProperty])
     990                shorthandPropertyID = borderProperty;
     991            if (!shorthandPropertyID)
     992                shorthandPropertyID = fallbackProperty;
     993        };
    913994       
    914995        if (property.value() && property.value()->isPendingSubstitutionValue()) {
     
    9601041                if (!borderFallbackShorthandProperty)
    9611042                    borderFallbackShorthandProperty = CSSPropertyBorderColor;
    962 
    963                 // FIXME: Deal with cases where only some of border-(top|right|bottom|left) are specified.
    964                 ASSERT(CSSPropertyBorder - firstCSSProperty < shorthandPropertyAppeared.size());
    965                 if (!shorthandPropertyAppeared[CSSPropertyBorder - firstCSSProperty]) {
    966                     value = borderPropertyValue();
    967                     if (value.isNull())
    968                         shorthandPropertyAppeared.set(CSSPropertyBorder - firstCSSProperty);
    969                     else
    970                         shorthandPropertyID = CSSPropertyBorder;
    971                 } else if (shorthandPropertyUsed[CSSPropertyBorder - firstCSSProperty])
    972                     shorthandPropertyID = CSSPropertyBorder;
    973                 if (!shorthandPropertyID)
    974                     shorthandPropertyID = borderFallbackShorthandProperty;
     1043                serializeBorderShorthand(CSSPropertyBorder, borderFallbackShorthandProperty);
     1044                break;
     1045            case CSSPropertyBorderBlockStartWidth:
     1046            case CSSPropertyBorderBlockEndWidth:
     1047                if (!borderBlockFallbackShorthandProperty)
     1048                    borderBlockFallbackShorthandProperty = CSSPropertyBorderBlockWidth;
     1049                FALLTHROUGH;
     1050            case CSSPropertyBorderBlockStartStyle:
     1051            case CSSPropertyBorderBlockEndStyle:
     1052                if (!borderBlockFallbackShorthandProperty)
     1053                    borderBlockFallbackShorthandProperty = CSSPropertyBorderBlockStyle;
     1054                FALLTHROUGH;
     1055            case CSSPropertyBorderBlockStartColor:
     1056            case CSSPropertyBorderBlockEndColor:
     1057                if (!borderBlockFallbackShorthandProperty)
     1058                    borderBlockFallbackShorthandProperty = CSSPropertyBorderBlockColor;
     1059                serializeBorderShorthand(CSSPropertyBorderBlock, borderBlockFallbackShorthandProperty);
     1060                break;
     1061            case CSSPropertyBorderInlineStartWidth:
     1062            case CSSPropertyBorderInlineEndWidth:
     1063                if (!borderInlineFallbackShorthandProperty)
     1064                    borderInlineFallbackShorthandProperty = CSSPropertyBorderInlineWidth;
     1065                FALLTHROUGH;
     1066            case CSSPropertyBorderInlineStartStyle:
     1067            case CSSPropertyBorderInlineEndStyle:
     1068                if (!borderInlineFallbackShorthandProperty)
     1069                    borderInlineFallbackShorthandProperty = CSSPropertyBorderInlineStyle;
     1070                FALLTHROUGH;
     1071            case CSSPropertyBorderInlineStartColor:
     1072            case CSSPropertyBorderInlineEndColor:
     1073                if (!borderInlineFallbackShorthandProperty)
     1074                    borderInlineFallbackShorthandProperty = CSSPropertyBorderInlineColor;
     1075                serializeBorderShorthand(CSSPropertyBorderInline, borderInlineFallbackShorthandProperty);
    9751076                break;
    9761077            case CSSPropertyWebkitBorderHorizontalSpacing:
     
    9971098                shorthandPropertyID = CSSPropertyMargin;
    9981099                break;
     1100            case CSSPropertyMarginBlockStart:
     1101            case CSSPropertyMarginBlockEnd:
     1102                shorthandPropertyID = CSSPropertyMarginBlock;
     1103                break;
     1104            case CSSPropertyMarginInlineStart:
     1105            case CSSPropertyMarginInlineEnd:
     1106                shorthandPropertyID = CSSPropertyMarginInline;
     1107                break;
    9991108            case CSSPropertyOutlineWidth:
    10001109            case CSSPropertyOutlineStyle:
     
    10111120            case CSSPropertyPaddingLeft:
    10121121                shorthandPropertyID = CSSPropertyPadding;
     1122                break;
     1123            case CSSPropertyPaddingBlockStart:
     1124            case CSSPropertyPaddingBlockEnd:
     1125                shorthandPropertyID = CSSPropertyPaddingBlock;
     1126                break;
     1127            case CSSPropertyPaddingInlineStart:
     1128            case CSSPropertyPaddingInlineEnd:
     1129                shorthandPropertyID = CSSPropertyPaddingInline;
    10131130                break;
    10141131#if ENABLE(CSS_SCROLL_SNAP)
     
    10671184
    10681185        unsigned shortPropertyIndex = shorthandPropertyID - firstCSSProperty;
    1069         if (shorthandPropertyID) {
     1186        if (shorthandPropertyID && isEnabledCSSProperty(shorthandPropertyID)) {
    10701187            ASSERT(shortPropertyIndex < shorthandPropertyUsed.size());
    10711188            if (shorthandPropertyUsed[shortPropertyIndex])
  • trunk/Source/WebCore/css/StyleProperties.h

    r239427 r240251  
    163163    String getCommonValue(const StylePropertyShorthand&) const;
    164164    String getAlignmentShorthandValue(const StylePropertyShorthand&) const;
    165     String borderPropertyValue() const;
     165    String borderPropertyValue(const StylePropertyShorthand&, const StylePropertyShorthand&, const StylePropertyShorthand&) const;
    166166    String getLayeredShorthandValue(const StylePropertyShorthand&) const;
     167    String get2Values(const StylePropertyShorthand&) const;
    167168    String get4Values(const StylePropertyShorthand&) const;
    168169    String borderSpacingValue(const StylePropertyShorthand&) const;
  • trunk/Source/WebCore/css/makeprop.pl

    r239255 r240251  
    6161my @names;
    6262my @internalProprerties;
     63my %runtimeFlags;
    6364my $numPredefinedProperties = 2;
    6465my %nameIsInherited;
     
    200201                    # internal-only properties exist to make it easier to parse compound properties (e.g. background-repeat) as if they were shorthands.
    201202                    push @internalProprerties, $name
     203                } elsif ($codegenOptionName eq "runtime-flag") {
     204                    $runtimeFlags{$name} = $codegenProperties->{"runtime-flag"};
    202205                } else {
    203206                    die "Unrecognized codegen property \"$codegenOptionName\" for $name property.";
     
    244247#include \"CSSPropertyNames.h\"
    245248#include \"HashTools.h\"
     249#include "RuntimeEnabledFeatures.h"
    246250#include <wtf/ASCIICType.h>
    247251#include <wtf/text/AtomicString.h>
     
    321325}
    322326
     327bool isEnabledCSSProperty(const CSSPropertyID id)
     328{
     329    switch (id) {
     330EOF
     331
     332foreach my $name (keys %runtimeFlags) {
     333  print GPERF "    case CSSPropertyID::CSSProperty" . $nameToId{$name} . ":\n";
     334  print GPERF "        return RuntimeEnabledFeatures::sharedFeatures()." . $runtimeFlags{$name} . "Enabled();\n";
     335}
     336
     337print GPERF << "EOF";
     338    default:
     339        return true;
     340    }
     341}
     342
    323343const char* getPropertyName(CSSPropertyID id)
    324344{
     
    466486
    467487bool isInternalCSSProperty(const CSSPropertyID);
     488bool isEnabledCSSProperty(const CSSPropertyID);
    468489const char* getPropertyName(CSSPropertyID);
    469490const WTF::AtomicString& getPropertyNameAtomicString(CSSPropertyID id);
  • trunk/Source/WebCore/css/parser/CSSPropertyParser.cpp

    r239978 r240251  
    147147   
    148148    const Property* hashTableEntry = findProperty(name, length);
    149     return hashTableEntry ? static_cast<CSSPropertyID>(hashTableEntry->id) : CSSPropertyInvalid;
     149    if (hashTableEntry) {
     150        auto propertyID = static_cast<CSSPropertyID>(hashTableEntry->id);
     151        if (isEnabledCSSProperty(propertyID))
     152            return propertyID;
     153    }
     154    return CSSPropertyInvalid;
    150155}
    151156
     
    228233void CSSPropertyParser::addProperty(CSSPropertyID property, CSSPropertyID currentShorthand, Ref<CSSValue>&& value, bool important, bool implicit)
    229234{
     235    if (!isEnabledCSSProperty(property))
     236        return;
     237
    230238    int shorthandIndex = 0;
    231239    bool setFromShorthand = false;
     
    49914999}
    49925000
    4993 bool CSSPropertyParser::consumeBorder(bool important)
    4994 {
    4995     RefPtr<CSSValue> width;
    4996     RefPtr<CSSValue> style;
    4997     RefPtr<CSSValue> color;
    4998 
     5001bool CSSPropertyParser::consumeBorder(RefPtr<CSSValue>& width, RefPtr<CSSValue>& style, RefPtr<CSSValue>& color)
     5002{
    49995003    while (!width || !style || !color) {
    50005004        if (!width) {
     
    50265030        color = CSSValuePool::singleton().createImplicitInitialValue();
    50275031
    5028     addExpandedPropertyForValue(CSSPropertyBorderWidth, width.releaseNonNull(), important);
    5029     addExpandedPropertyForValue(CSSPropertyBorderStyle, style.releaseNonNull(), important);
    5030     addExpandedPropertyForValue(CSSPropertyBorderColor, color.releaseNonNull(), important);
    5031     addExpandedPropertyForValue(CSSPropertyBorderImage, CSSValuePool::singleton().createImplicitInitialValue(), important);
    5032 
    50335032    return m_range.atEnd();
    50345033}
    50355034
    5036 bool CSSPropertyParser::consume4Values(const StylePropertyShorthand& shorthand, bool important)
     5035bool CSSPropertyParser::consume2ValueShorthand(const StylePropertyShorthand& shorthand, bool important)
     5036{
     5037    ASSERT(shorthand.length() == 2);
     5038    const CSSPropertyID* longhands = shorthand.properties();
     5039    RefPtr<CSSValue> start = parseSingleValue(longhands[0], shorthand.id());
     5040    if (!start)
     5041        return false;
     5042
     5043    RefPtr<CSSValue> end = parseSingleValue(longhands[1], shorthand.id());
     5044    bool endImplicit = !end;
     5045    if (endImplicit)
     5046        end = start;
     5047    addProperty(longhands[0], shorthand.id(), start.releaseNonNull(), important);
     5048    addProperty(longhands[1], shorthand.id(), end.releaseNonNull(), important, endImplicit);
     5049
     5050    return m_range.atEnd();
     5051}
     5052
     5053bool CSSPropertyParser::consume4ValueShorthand(const StylePropertyShorthand& shorthand, bool important)
    50375054{
    50385055    ASSERT(shorthand.length() == 4);
     
    57325749        return consumeShorthandGreedily(webkitTextDecorationShorthand(), important);
    57335750    case CSSPropertyMargin:
    5734         return consume4Values(marginShorthand(), important);
     5751        return consume4ValueShorthand(marginShorthand(), important);
     5752    case CSSPropertyMarginBlock:
     5753        return consume2ValueShorthand(marginBlockShorthand(), important);
     5754    case CSSPropertyMarginInline:
     5755        return consume2ValueShorthand(marginInlineShorthand(), important);
    57355756    case CSSPropertyPadding:
    5736         return consume4Values(paddingShorthand(), important);
     5757        return consume4ValueShorthand(paddingShorthand(), important);
     5758    case CSSPropertyPaddingBlock:
     5759        return consume2ValueShorthand(paddingBlockShorthand(), important);
     5760    case CSSPropertyPaddingInline:
     5761        return consume2ValueShorthand(paddingInlineShorthand(), important);
    57375762#if ENABLE(CSS_SCROLL_SNAP)
    57385763    case CSSPropertyScrollSnapMargin:
    5739         return consume4Values(scrollSnapMarginShorthand(), important);
     5764        return consume4ValueShorthand(scrollSnapMarginShorthand(), important);
    57405765    case CSSPropertyScrollPadding:
    5741         return consume4Values(scrollPaddingShorthand(), important);
     5766        return consume4ValueShorthand(scrollPaddingShorthand(), important);
    57425767#endif
    57435768    case CSSPropertyWebkitTextEmphasis:
     
    57455770    case CSSPropertyOutline:
    57465771        return consumeShorthandGreedily(outlineShorthand(), important);
     5772    case CSSPropertyBorderInline: {
     5773        RefPtr<CSSValue> width;
     5774        RefPtr<CSSValue> style;
     5775        RefPtr<CSSValue> color;
     5776        if (!consumeBorder(width, style, color))
     5777            return false;
     5778
     5779        addExpandedPropertyForValue(CSSPropertyBorderInlineWidth, width.releaseNonNull(), important);
     5780        addExpandedPropertyForValue(CSSPropertyBorderInlineStyle, style.releaseNonNull(), important);
     5781        addExpandedPropertyForValue(CSSPropertyBorderInlineColor, color.releaseNonNull(), important);
     5782        return true;
     5783    }
     5784    case CSSPropertyBorderInlineColor:
     5785        return consume2ValueShorthand(borderInlineColorShorthand(), important);
     5786    case CSSPropertyBorderInlineStyle:
     5787        return consume2ValueShorthand(borderInlineStyleShorthand(), important);
     5788    case CSSPropertyBorderInlineWidth:
     5789        return consume2ValueShorthand(borderInlineWidthShorthand(), important);
    57475790    case CSSPropertyBorderInlineStart:
    57485791        return consumeShorthandGreedily(borderInlineStartShorthand(), important);
    57495792    case CSSPropertyBorderInlineEnd:
    57505793        return consumeShorthandGreedily(borderInlineEndShorthand(), important);
     5794    case CSSPropertyBorderBlock: {
     5795        RefPtr<CSSValue> width;
     5796        RefPtr<CSSValue> style;
     5797        RefPtr<CSSValue> color;
     5798        if (!consumeBorder(width, style, color))
     5799            return false;
     5800
     5801        addExpandedPropertyForValue(CSSPropertyBorderBlockWidth, width.releaseNonNull(), important);
     5802        addExpandedPropertyForValue(CSSPropertyBorderBlockStyle, style.releaseNonNull(), important);
     5803        addExpandedPropertyForValue(CSSPropertyBorderBlockColor, color.releaseNonNull(), important);
     5804        return true;
     5805    }
     5806    case CSSPropertyBorderBlockColor:
     5807        return consume2ValueShorthand(borderBlockColorShorthand(), important);
     5808    case CSSPropertyBorderBlockStyle:
     5809        return consume2ValueShorthand(borderBlockStyleShorthand(), important);
     5810    case CSSPropertyBorderBlockWidth:
     5811        return consume2ValueShorthand(borderBlockWidthShorthand(), important);
    57515812    case CSSPropertyBorderBlockStart:
    57525813        return consumeShorthandGreedily(borderBlockStartShorthand(), important);
     
    57865847    }
    57875848    case CSSPropertyBorderColor:
    5788         return consume4Values(borderColorShorthand(), important);
     5849        return consume4ValueShorthand(borderColorShorthand(), important);
    57895850    case CSSPropertyBorderStyle:
    5790         return consume4Values(borderStyleShorthand(), important);
     5851        return consume4ValueShorthand(borderStyleShorthand(), important);
    57915852    case CSSPropertyBorderWidth:
    5792         return consume4Values(borderWidthShorthand(), important);
     5853        return consume4ValueShorthand(borderWidthShorthand(), important);
    57935854    case CSSPropertyBorderTop:
    57945855        return consumeShorthandGreedily(borderTopShorthand(), important);
     
    57995860    case CSSPropertyBorderLeft:
    58005861        return consumeShorthandGreedily(borderLeftShorthand(), important);
    5801     case CSSPropertyBorder:
    5802         return consumeBorder(important);
     5862    case CSSPropertyBorder: {
     5863        RefPtr<CSSValue> width;
     5864        RefPtr<CSSValue> style;
     5865        RefPtr<CSSValue> color;
     5866        if (!consumeBorder(width, style, color))
     5867            return false;
     5868
     5869        addExpandedPropertyForValue(CSSPropertyBorderWidth, width.releaseNonNull(), important);
     5870        addExpandedPropertyForValue(CSSPropertyBorderStyle, style.releaseNonNull(), important);
     5871        addExpandedPropertyForValue(CSSPropertyBorderColor, color.releaseNonNull(), important);
     5872        addExpandedPropertyForValue(CSSPropertyBorderImage, CSSValuePool::singleton().createImplicitInitialValue(), important);
     5873        return true;
     5874    }
    58035875    case CSSPropertyBorderImage:
    58045876        return consumeBorderImage(property, important);
  • trunk/Source/WebCore/css/parser/CSSPropertyParser.h

    r238262 r240251  
    7070    void addExpandedPropertyForValue(CSSPropertyID propId, Ref<CSSValue>&&, bool);
    7171
    72     bool consumeBorder(bool important);
     72    bool consumeBorder(RefPtr<CSSValue>& width, RefPtr<CSSValue>& style, RefPtr<CSSValue>& color);
    7373
    7474    bool parseShorthand(CSSPropertyID, bool important);
    7575    bool consumeShorthandGreedily(const StylePropertyShorthand&, bool important);
    76     bool consume4Values(const StylePropertyShorthand&, bool important);
     76    bool consume2ValueShorthand(const StylePropertyShorthand&, bool important);
     77    bool consume4ValueShorthand(const StylePropertyShorthand&, bool important);
    7778
    7879    // Legacy parsing allows <string>s for animation-name
  • trunk/Source/WebCore/inspector/agents/InspectorCSSAgent.cpp

    r239273 r240251  
    720720    for (int i = firstCSSProperty; i <= lastCSSProperty; ++i) {
    721721        CSSPropertyID propertyID = convertToCSSPropertyID(i);
    722         if (isInternalCSSProperty(propertyID))
     722        if (isInternalCSSProperty(propertyID) || !isEnabledCSSProperty(propertyID))
    723723            continue;
    724724
     
    740740            for (unsigned j = 0; j < shorthand.length(); ++j) {
    741741                CSSPropertyID longhandID = shorthand.properties()[j];
    742                 longhands->addItem(getPropertyNameString(longhandID));
     742                if (isEnabledCSSProperty(longhandID))
     743                    longhands->addItem(getPropertyNameString(longhandID));
    743744            }
    744745            property->setLonghands(WTFMove(longhands));
  • trunk/Source/WebCore/page/RuntimeEnabledFeatures.h

    r240129 r240251  
    338338    bool systemPreviewEnabled() const { return m_systemPreviewEnabled; }
    339339#endif
     340
     341    void setCSSLogicalEnabled(bool isEnabled) { m_CSSLogicalEnabled = isEnabled; }
     342    bool cssLogicalEnabled() const { return m_CSSLogicalEnabled; }
    340343
    341344    WEBCORE_EXPORT static RuntimeEnabledFeatures& sharedFeatures();
     
    512515    bool m_undoManagerAPIEnabled { false };
    513516
     517    bool m_CSSLogicalEnabled { false };
     518
    514519    friend class WTF::NeverDestroyed<RuntimeEnabledFeatures>;
    515520};
  • trunk/Source/WebKit/ChangeLog

    r240250 r240251  
     12019-01-22  Oriol Brufau  <obrufau@igalia.com>
     2
     3        [css-logical] Implement flow-relative margin, padding and border shorthands
     4        https://bugs.webkit.org/show_bug.cgi?id=188697
     5
     6        Reviewed by Simon Fraser and Antti Koivisto.
     7
     8        Add a CSSLogicalEnabled runtime flag.
     9
     10        * Shared/WebPreferences.yaml:
     11
    1122019-01-22  Frederic Wang  <fwang@igalia.com>
    213
  • trunk/Source/WebKit/Shared/WebPreferences.yaml

    r240250 r240251  
    15361536  category: internal
    15371537  webcoreBinding: RuntimeEnabledFeatures
     1538
     1539CSSLogicalEnabled:
     1540  type: bool
     1541  defaultValue: false
     1542  humanReadableName: "CSS Logical Properties and Values"
     1543  humanReadableDescription: "Enable CSS Logical Properties and Values"
     1544  webcoreBinding: RuntimeEnabledFeatures
     1545  category: internal
  • trunk/Source/WebKitLegacy/mac/ChangeLog

    r240237 r240251  
     12019-01-22  Oriol Brufau  <obrufau@igalia.com>
     2
     3        [css-logical] Implement flow-relative margin, padding and border shorthands
     4        https://bugs.webkit.org/show_bug.cgi?id=188697
     5
     6        Reviewed by Simon Fraser and Antti Koivisto.
     7
     8        Add CSSLogicalEnabled runtime flag.
     9
     10        * WebView/WebPreferenceKeysPrivate.h:
     11        * WebView/WebPreferences.mm:
     12        (+[WebPreferences initialize]):
     13        (-[WebPreferences cssLogicalEnabled]):
     14        (-[WebPreferences setCSSLogicalEnabled:]):
     15        * WebView/WebPreferencesPrivate.h:
     16        * WebView/WebView.mm:
     17        (-[WebView _preferencesChanged:]):
     18
    1192019-01-15  Darin Adler  <darin@apple.com>
    220
  • trunk/Source/WebKitLegacy/mac/WebView/WebPreferenceKeysPrivate.h

    r239470 r240251  
    264264#define WebKitServerTimingEnabledPreferenceKey @"WebKitServerTimingEnabled"
    265265#define WebKitSelectionAcrossShadowBoundariesEnabledPreferenceKey @"WebKitSelectionAcrossShadowBoundariesEnabled"
     266#define WebKitCSSLogicalEnabledPreferenceKey @"WebKitCSSLogicalEnabled"
  • trunk/Source/WebKitLegacy/mac/WebView/WebPreferences.mm

    r239897 r240251  
    669669#endif
    670670        [NSNumber numberWithBool:YES], WebKitSelectionAcrossShadowBoundariesEnabledPreferenceKey,
     671        [NSNumber numberWithBool:NO], WebKitCSSLogicalEnabledPreferenceKey,
    671672#if ENABLE(INTERSECTION_OBSERVER)
    672673        @NO, WebKitIntersectionObserverEnabledPreferenceKey,
     
    33793380}
    33803381
     3382- (BOOL)cssLogicalEnabled
     3383{
     3384    return [self _boolValueForKey:WebKitCSSLogicalEnabledPreferenceKey];
     3385}
     3386
     3387- (void)setCSSLogicalEnabled:(BOOL)flag
     3388{
     3389    [self _setBoolValue:flag forKey:WebKitCSSLogicalEnabledPreferenceKey];
     3390}
     3391
    33813392@end
    33823393
  • trunk/Source/WebKitLegacy/mac/WebView/WebPreferencesPrivate.h

    r239470 r240251  
    582582- (void)setSelectionAcrossShadowBoundariesEnabled:(BOOL)flag;
    583583- (BOOL)selectionAcrossShadowBoundariesEnabled;
     584
     585- (void)setCSSLogicalEnabled:(BOOL)flag;
     586- (BOOL)cssLogicalEnabled;
    584587
    585588@property (nonatomic) BOOL visualViewportEnabled;
  • trunk/Source/WebKitLegacy/mac/WebView/WebView.mm

    r240237 r240251  
    30783078#endif
    30793079
     3080    RuntimeEnabledFeatures::sharedFeatures().setCSSLogicalEnabled([preferences cssLogicalEnabled]);
     3081
    30803082    settings.setHiddenPageDOMTimerThrottlingEnabled([preferences hiddenPageDOMTimerThrottlingEnabled]);
    30813083
  • trunk/Tools/ChangeLog

    r240245 r240251  
     12019-01-22  Oriol Brufau  <obrufau@igalia.com>
     2
     3        [css-logical] Implement flow-relative margin, padding and border shorthands
     4        https://bugs.webkit.org/show_bug.cgi?id=188697
     5
     6        Reviewed by Simon Fraser and Antti Koivisto.
     7
     8        * DumpRenderTree/TestOptions.cpp:
     9        (TestOptions::TestOptions):
     10        * DumpRenderTree/TestOptions.h:
     11        * DumpRenderTree/mac/DumpRenderTree.mm:
     12        (setWebPreferencesForTestOptions):
     13        Allow tests to enable the CSSLogicalEnabled flag in WK1.
     14
     15        * Scripts/webkitpy/style/checkers/jsonchecker.py:
     16        (JSONCSSPropertiesChecker.check_codegen_properties):
     17        Allow CSS property definitions to have a 'runtime-flag' parameter which
     18        disables the property when the specified runtime flag is disabled.
     19
    1202019-01-21  Fujii Hironori  <Hironori.Fujii@sony.com>
    221
  • trunk/Tools/DumpRenderTree/TestOptions.cpp

    r239470 r240251  
    108108        else if (key == "experimental:WebGPUEnabled")
    109109            enableWebGPU = parseBooleanTestHeaderValue(value);
     110        else if (key == "internal:CSSLogicalEnabled")
     111            enableCSSLogical = parseBooleanTestHeaderValue(value);
    110112        pairStart = pairEnd + 1;
    111113    }
  • trunk/Tools/DumpRenderTree/TestOptions.h

    r239470 r240251  
    4545    bool enableSelectionAcrossShadowBoundaries { true };
    4646    bool enableWebGPU { false };
     47    bool enableCSSLogical { false };
    4748    std::string jscOptions;
    4849
  • trunk/Tools/DumpRenderTree/mac/DumpRenderTree.mm

    r239496 r240251  
    10111011    preferences.selectionAcrossShadowBoundariesEnabled = options.enableSelectionAcrossShadowBoundaries;
    10121012    preferences.webGPUEnabled = options.enableWebGPU;
     1013    preferences.CSSLogicalEnabled = options.enableCSSLogical;
    10131014}
    10141015
  • trunk/Tools/Scripts/webkitpy/style/checkers/jsonchecker.py

    r238262 r240251  
    289289            'name-for-methods': self.validate_string,
    290290            'no-default-color': self.validate_boolean,
     291            'runtime-flag': self.validate_string,
    291292            'setter': self.validate_string,
    292293            'skip-builder': self.validate_boolean,
Note: See TracChangeset for help on using the changeset viewer.