Changeset 238244 in webkit


Ignore:
Timestamp:
Nov 15, 2018 1:15:26 PM (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 2018-11-15
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-as-js-properties.html
webexposed/css-properties-behind-flags.html
webexposed/css-property-listing.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.

  • platform/ios/webexposed/css-properties-as-js-properties-expected.txt: Added.
  • platform/ios/webexposed/css-property-listing-expected.txt: Added.
  • platform/mac/webexposed/css-properties-as-js-properties-expected.txt: Added.
  • platform/mac/webexposed/css-property-listing-expected.txt: Added.
  • platform/win/webexposed/css-properties-as-js-properties-expected.txt: Added.
  • platform/win/webexposed/css-property-listing-expected.txt: Added.
  • webexposed/css-properties-as-js-properties-expected.txt: Added.
  • webexposed/css-properties-as-js-properties.html: Added.
  • webexposed/css-properties-behind-flags-expected.txt: Added.
  • webexposed/css-properties-behind-flags.html: Added.
  • webexposed/css-property-listing-expected.txt: Added.
  • webexposed/css-property-listing.html: Added.
Location:
trunk
Files:
17 added
43 edited

Legend:

Unmodified
Added
Removed
  • trunk/LayoutTests/ChangeLog

    r238243 r238244  
     12018-11-15  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        * platform/ios/webexposed/css-properties-as-js-properties-expected.txt: Added.
     12        * platform/ios/webexposed/css-property-listing-expected.txt: Added.
     13        * platform/mac/webexposed/css-properties-as-js-properties-expected.txt: Added.
     14        * platform/mac/webexposed/css-property-listing-expected.txt: Added.
     15        * platform/win/webexposed/css-properties-as-js-properties-expected.txt: Added.
     16        * platform/win/webexposed/css-property-listing-expected.txt: Added.
     17        * webexposed/css-properties-as-js-properties-expected.txt: Added.
     18        * webexposed/css-properties-as-js-properties.html: Added.
     19        * webexposed/css-properties-behind-flags-expected.txt: Added.
     20        * webexposed/css-properties-behind-flags.html: Added.
     21        * webexposed/css-property-listing-expected.txt: Added.
     22        * webexposed/css-property-listing.html: Added.
     23
    1242018-11-15  Jiewen Tan  <jiewen_tan@apple.com>
    225
  • trunk/LayoutTests/imported/w3c/ChangeLog

    r238242 r238244  
     12018-11-15  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
    1402018-11-15  Truitt Savell  <tsavell@apple.com>
    241
  • trunk/LayoutTests/imported/w3c/web-platform-tests/css/css-logical/logical-box-border-color-expected.txt

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r234798 r238244  
    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

    r238242 r238244  
     12018-11-15  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-as-js-properties.html
     15               webexposed/css-properties-behind-flags.html
     16               webexposed/css-property-listing.html
     17
     18        * css/CSSComputedStyleDeclaration.cpp:
     19        (WebCore::ComputedStyleExtractor::valueForPropertyinStyle):
     20        Allow the new properties to serialize their computed value.
     21
     22        (WebCore::ComputedStyleExtractor::getCSSPropertyValuesFor2SidesShorthand):
     23        (WebCore::ComputedStyleExtractor::getCSSPropertyValuesFor4SidesShorthand):
     24        * css/CSSComputedStyleDeclaration.h:
     25        Rename getCSSPropertyValuesForSidesShorthand to getCSSPropertyValuesFor4SidesShorthand,
     26        and add analogous getCSSPropertyValuesFor2SidesShorthand for serializing 2-sided
     27        shorthands.
     28
     29        * css/CSSProperties.json:
     30        Add the new properties behind the CSSLogicalEnabled runtime flag.
     31
     32        * css/CSSStyleDeclaration.cpp:
     33        (WebCore::CSSStyleDeclaration::supportedPropertyNames const):
     34        Prevent CSS properties disabled behind a runtime flag from being exposed in
     35        style declarations.
     36
     37        * css/StyleProperties.cpp:
     38        (WebCore::StyleProperties::getPropertyValue const):
     39        Allow the new properties to serialize their specified value.
     40
     41        (WebCore::StyleProperties::get2Values const):
     42        Add get2Values, analogous to get4Values, for serializing 2-sided shorthands.
     43
     44        (WebCore::StyleProperties::borderPropertyValue const):
     45        Allow borderPropertyValue to serialize arbitrary multi-sided border shorthands
     46        corresponding to width, style and color.
     47
     48        (WebCore::MutableStyleProperties::setProperty):
     49        Prevent CSS properties disabled behind a runtime flag from being set a value.
     50
     51        (WebCore::StyleProperties::asText const):
     52        Allow the new properties to be serialized in cssText.
     53        Prevent CSS shorthands disabled behind a runtime flag from appearing in cssText,
     54        and serialize the longhands instead. Note that there could be another shorthand
     55        available which is enabled, but a proper solution would require bug 190496.
     56
     57        * css/StyleProperties.h:
     58        Update declarations of borderPropertyValue and get2Values.
     59
     60        * css/makeprop.pl:
     61        (addProperty):
     62        Add isEnabledCSSProperty function for checking that a CSS property is not
     63        disabled behind a runtime flag.
     64
     65        * css/parser/CSSPropertyParser.cpp:
     66        (WebCore::cssPropertyID):
     67        Prevent CSS properties disabled behind a runtime flag from being exposed in
     68        computed styles.
     69
     70        (WebCore::CSSPropertyParser::addProperty):
     71        Prevent CSS properties disabled behind a runtime flag from being set a value.
     72
     73        (WebCore::CSSPropertyParser::consumeBorder):
     74        Change consumeBorder to provide the caller with the parsed values instead of
     75        setting properties. Then the caller can decide to which properties the values
     76        should be set, and whether border-image should be reset or not.
     77
     78        (WebCore::CSSPropertyParser::consume2ValueShorthand):
     79        (WebCore::CSSPropertyParser::consume4ValueShorthand):
     80        Rename consume4Values to consume4ValueShorthand, and add analogous
     81        consume2ValueShorthand for parsing shorthands with two longhands.
     82
     83        (WebCore::CSSPropertyParser::parseShorthand):
     84        Allow the new properties to be parsed.
     85
     86        * css/parser/CSSPropertyParser.h:
     87        Update declarations of consumeBorder, consume2ValueShorthand and
     88        consume4ValueShorthand.
     89
     90        * inspector/agents/InspectorCSSAgent.cpp:
     91        (WebCore::InspectorCSSAgent::getSupportedCSSProperties):
     92        Prevent CSS properties disabled behind a runtime flag from being exposed in
     93        the CSS inspector tool.
     94
     95        * page/RuntimeEnabledFeatures.h:
     96        (WebCore::RuntimeEnabledFeatures::setCSSLogicalEnabled):
     97        (WebCore::RuntimeEnabledFeatures::cssLogicalEnabled const):
     98        Add the CSSLogicalEnabled runtime flag.
     99
    11002018-11-15  Truitt Savell  <tsavell@apple.com>
    2101
  • trunk/Source/WebCore/css/CSSComputedStyleDeclaration.cpp

    r238071 r238244  
    39023902            return value;
    39033903        }
     3904        case CSSPropertyBorderBlock: {
     3905            auto value = propertyValue(CSSPropertyBorderBlockStart, DoNotUpdateLayout);
     3906            if (!compareCSSValuePtr<CSSValue>(value, propertyValue(CSSPropertyBorderBlockEnd, DoNotUpdateLayout)))
     3907                return nullptr;
     3908            return value;
     3909        }
     3910        case CSSPropertyBorderBlockColor:
     3911            return getCSSPropertyValuesFor2SidesShorthand(borderBlockColorShorthand());
     3912        case CSSPropertyBorderBlockStyle:
     3913            return getCSSPropertyValuesFor2SidesShorthand(borderBlockStyleShorthand());
     3914        case CSSPropertyBorderBlockWidth:
     3915            return getCSSPropertyValuesFor2SidesShorthand(borderBlockWidthShorthand());
    39043916        case CSSPropertyBorderBottom:
    39053917            return getCSSPropertyValuesForShorthandProperties(borderBottomShorthand());
    39063918        case CSSPropertyBorderColor:
    3907             return getCSSPropertyValuesForSidesShorthand(borderColorShorthand());
     3919            return getCSSPropertyValuesFor4SidesShorthand(borderColorShorthand());
    39083920        case CSSPropertyBorderLeft:
    39093921            return getCSSPropertyValuesForShorthandProperties(borderLeftShorthand());
    39103922        case CSSPropertyBorderImage:
    39113923            return valueForNinePieceImage(style.borderImage());
     3924        case CSSPropertyBorderInline: {
     3925            auto value = propertyValue(CSSPropertyBorderInlineStart, DoNotUpdateLayout);
     3926            if (!compareCSSValuePtr<CSSValue>(value, propertyValue(CSSPropertyBorderInlineEnd, DoNotUpdateLayout)))
     3927                return nullptr;
     3928            return value;
     3929        }
     3930        case CSSPropertyBorderInlineColor:
     3931            return getCSSPropertyValuesFor2SidesShorthand(borderInlineColorShorthand());
     3932        case CSSPropertyBorderInlineStyle:
     3933            return getCSSPropertyValuesFor2SidesShorthand(borderInlineStyleShorthand());
     3934        case CSSPropertyBorderInlineWidth:
     3935            return getCSSPropertyValuesFor2SidesShorthand(borderInlineWidthShorthand());
    39123936        case CSSPropertyBorderRadius:
    39133937            return borderRadiusShorthandValue(style);
     
    39153939            return getCSSPropertyValuesForShorthandProperties(borderRightShorthand());
    39163940        case CSSPropertyBorderStyle:
    3917             return getCSSPropertyValuesForSidesShorthand(borderStyleShorthand());
     3941            return getCSSPropertyValuesFor4SidesShorthand(borderStyleShorthand());
    39183942        case CSSPropertyBorderTop:
    39193943            return getCSSPropertyValuesForShorthandProperties(borderTopShorthand());
    39203944        case CSSPropertyBorderWidth:
    3921             return getCSSPropertyValuesForSidesShorthand(borderWidthShorthand());
     3945            return getCSSPropertyValuesFor4SidesShorthand(borderWidthShorthand());
    39223946        case CSSPropertyColumnRule:
    39233947            return getCSSPropertyValuesForShorthandProperties(columnRuleShorthand());
     
    39273951            return getCSSPropertyValuesForShorthandProperties(listStyleShorthand());
    39283952        case CSSPropertyMargin:
    3929             return getCSSPropertyValuesForSidesShorthand(marginShorthand());
     3953            return getCSSPropertyValuesFor4SidesShorthand(marginShorthand());
     3954        case CSSPropertyMarginBlock:
     3955            return getCSSPropertyValuesFor2SidesShorthand(marginBlockShorthand());
     3956        case CSSPropertyMarginInline:
     3957            return getCSSPropertyValuesFor2SidesShorthand(marginInlineShorthand());
    39303958        case CSSPropertyOutline:
    39313959            return getCSSPropertyValuesForShorthandProperties(outlineShorthand());
    39323960        case CSSPropertyPadding:
    3933             return getCSSPropertyValuesForSidesShorthand(paddingShorthand());
    3934 
     3961            return getCSSPropertyValuesFor4SidesShorthand(paddingShorthand());
     3962        case CSSPropertyPaddingBlock:
     3963            return getCSSPropertyValuesFor2SidesShorthand(paddingBlockShorthand());
     3964        case CSSPropertyPaddingInline:
     3965            return getCSSPropertyValuesFor2SidesShorthand(paddingInlineShorthand());
    39353966#if ENABLE(CSS_SCROLL_SNAP)
    39363967        case CSSPropertyScrollSnapMargin:
    3937             return getCSSPropertyValuesForSidesShorthand(scrollSnapMarginShorthand());
     3968            return getCSSPropertyValuesFor4SidesShorthand(scrollSnapMarginShorthand());
    39383969        case CSSPropertyScrollSnapMarginBottom:
    39393970            return zoomAdjustedPixelValueForLength(style.scrollSnapMarginBottom(), style);
     
    39453976            return zoomAdjustedPixelValueForLength(style.scrollSnapMarginLeft(), style);
    39463977        case CSSPropertyScrollPadding:
    3947             return getCSSPropertyValuesForSidesShorthand(scrollPaddingShorthand());
     3978            return getCSSPropertyValuesFor4SidesShorthand(scrollPaddingShorthand());
    39483979        case CSSPropertyScrollPaddingBottom:
    39493980            return zoomAdjustedPixelValueForLength(style.scrollPaddingBottom(), style);
     
    42254256}
    42264257
    4227 RefPtr<CSSValueList> ComputedStyleExtractor::getCSSPropertyValuesForSidesShorthand(const StylePropertyShorthand& shorthand)
     4258RefPtr<CSSValueList> ComputedStyleExtractor::getCSSPropertyValuesFor2SidesShorthand(const StylePropertyShorthand& shorthand)
     4259{
     4260    auto list = CSSValueList::createSpaceSeparated();
     4261
     4262    // Assume the properties are in the usual order start, end.
     4263    auto startValue = propertyValue(shorthand.properties()[0], DoNotUpdateLayout);
     4264    auto endValue = propertyValue(shorthand.properties()[1], DoNotUpdateLayout);
     4265
     4266    // All 2 properties must be specified.
     4267    if (!startValue || !endValue)
     4268        return nullptr;
     4269
     4270    bool showEnd = !compareCSSValuePtr(startValue, endValue);
     4271
     4272    list->append(startValue.releaseNonNull());
     4273    if (showEnd)
     4274        list->append(endValue.releaseNonNull());
     4275
     4276    return WTFMove(list);
     4277}
     4278
     4279RefPtr<CSSValueList> ComputedStyleExtractor::getCSSPropertyValuesFor4SidesShorthand(const StylePropertyShorthand& shorthand)
    42284280{
    42294281    auto list = CSSValueList::createSpaceSeparated();
  • trunk/Source/WebCore/css/CSSComputedStyleDeclaration.h

    r233935 r238244  
    9393
    9494    RefPtr<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    RefPtr<CSSValueList> getCSSPropertyValuesForGridShorthand(const StylePropertyShorthand&);
  • trunk/Source/WebCore/css/CSSProperties.json

    r238155 r238244  
    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

    r237266 r238244  
    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

    r237697 r238244  
    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

    r237697 r238244  
    164164    String getCommonValue(const StylePropertyShorthand&) const;
    165165    String getAlignmentShorthandValue(const StylePropertyShorthand&) const;
    166     String borderPropertyValue() const;
     166    String borderPropertyValue(const StylePropertyShorthand&, const StylePropertyShorthand&, const StylePropertyShorthand&) const;
    167167    String getLayeredShorthandValue(const StylePropertyShorthand&) const;
     168    String get2Values(const StylePropertyShorthand&) const;
    168169    String get4Values(const StylePropertyShorthand&) const;
    169170    String borderSpacingValue(const StylePropertyShorthand&) const;
  • trunk/Source/WebCore/css/makeprop.pl

    r236828 r238244  
    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>
     
    325329}
    326330
     331bool isEnabledCSSProperty(const CSSPropertyID id)
     332{
     333    switch (id) {
     334EOF
     335
     336foreach my $name (keys %runtimeFlags) {
     337  print GPERF "    case CSSPropertyID::CSSProperty" . $nameToId{$name} . ":\n";
     338  print GPERF "        return RuntimeEnabledFeatures::sharedFeatures()." . $runtimeFlags{$name} . "Enabled();\n";
     339}
     340
     341print GPERF << "EOF";
     342    default:
     343        return true;
     344    }
     345}
     346
    327347const char* getPropertyName(CSSPropertyID id)
    328348{
     
    472492
    473493bool isInternalCSSProperty(const CSSPropertyID);
     494bool isEnabledCSSProperty(const CSSPropertyID);
    474495const char* getPropertyName(CSSPropertyID);
    475496const WTF::AtomicString& getPropertyNameAtomicString(CSSPropertyID id);
  • trunk/Source/WebCore/css/parser/CSSPropertyParser.cpp

    r238071 r238244  
    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;
     
    49794987}
    49804988
    4981 bool CSSPropertyParser::consumeBorder(bool important)
    4982 {
    4983     RefPtr<CSSValue> width;
    4984     RefPtr<CSSValue> style;
    4985     RefPtr<CSSValue> color;
    4986 
     4989bool CSSPropertyParser::consumeBorder(RefPtr<CSSValue>& width, RefPtr<CSSValue>& style, RefPtr<CSSValue>& color)
     4990{
    49874991    while (!width || !style || !color) {
    49884992        if (!width) {
     
    50145018        color = CSSValuePool::singleton().createImplicitInitialValue();
    50155019
    5016     addExpandedPropertyForValue(CSSPropertyBorderWidth, width.releaseNonNull(), important);
    5017     addExpandedPropertyForValue(CSSPropertyBorderStyle, style.releaseNonNull(), important);
    5018     addExpandedPropertyForValue(CSSPropertyBorderColor, color.releaseNonNull(), important);
    5019     addExpandedPropertyForValue(CSSPropertyBorderImage, CSSValuePool::singleton().createImplicitInitialValue(), important);
    5020 
    50215020    return m_range.atEnd();
    50225021}
    50235022
    5024 bool CSSPropertyParser::consume4Values(const StylePropertyShorthand& shorthand, bool important)
     5023bool CSSPropertyParser::consume2ValueShorthand(const StylePropertyShorthand& shorthand, bool important)
     5024{
     5025    ASSERT(shorthand.length() == 2);
     5026    const CSSPropertyID* longhands = shorthand.properties();
     5027    RefPtr<CSSValue> start = parseSingleValue(longhands[0], shorthand.id());
     5028    if (!start)
     5029        return false;
     5030
     5031    RefPtr<CSSValue> end = parseSingleValue(longhands[1], shorthand.id());
     5032    bool endImplicit = !end;
     5033    if (endImplicit)
     5034        end = start;
     5035    addProperty(longhands[0], shorthand.id(), start.releaseNonNull(), important);
     5036    addProperty(longhands[1], shorthand.id(), end.releaseNonNull(), important, endImplicit);
     5037
     5038    return m_range.atEnd();
     5039}
     5040
     5041bool CSSPropertyParser::consume4ValueShorthand(const StylePropertyShorthand& shorthand, bool important)
    50255042{
    50265043    ASSERT(shorthand.length() == 4);
     
    57205737        return consumeShorthandGreedily(webkitTextDecorationShorthand(), important);
    57215738    case CSSPropertyMargin:
    5722         return consume4Values(marginShorthand(), important);
     5739        return consume4ValueShorthand(marginShorthand(), important);
     5740    case CSSPropertyMarginBlock:
     5741        return consume2ValueShorthand(marginBlockShorthand(), important);
     5742    case CSSPropertyMarginInline:
     5743        return consume2ValueShorthand(marginInlineShorthand(), important);
    57235744    case CSSPropertyPadding:
    5724         return consume4Values(paddingShorthand(), important);
     5745        return consume4ValueShorthand(paddingShorthand(), important);
     5746    case CSSPropertyPaddingBlock:
     5747        return consume2ValueShorthand(paddingBlockShorthand(), important);
     5748    case CSSPropertyPaddingInline:
     5749        return consume2ValueShorthand(paddingInlineShorthand(), important);
    57255750#if ENABLE(CSS_SCROLL_SNAP)
    57265751    case CSSPropertyScrollSnapMargin:
    5727         return consume4Values(scrollSnapMarginShorthand(), important);
     5752        return consume4ValueShorthand(scrollSnapMarginShorthand(), important);
    57285753    case CSSPropertyScrollPadding:
    5729         return consume4Values(scrollPaddingShorthand(), important);
     5754        return consume4ValueShorthand(scrollPaddingShorthand(), important);
    57305755#endif
    57315756    case CSSPropertyWebkitTextEmphasis:
     
    57335758    case CSSPropertyOutline:
    57345759        return consumeShorthandGreedily(outlineShorthand(), important);
     5760    case CSSPropertyBorderInline: {
     5761        RefPtr<CSSValue> width;
     5762        RefPtr<CSSValue> style;
     5763        RefPtr<CSSValue> color;
     5764        if (!consumeBorder(width, style, color))
     5765            return false;
     5766
     5767        addExpandedPropertyForValue(CSSPropertyBorderInlineWidth, width.releaseNonNull(), important);
     5768        addExpandedPropertyForValue(CSSPropertyBorderInlineStyle, style.releaseNonNull(), important);
     5769        addExpandedPropertyForValue(CSSPropertyBorderInlineColor, color.releaseNonNull(), important);
     5770        return true;
     5771    }
     5772    case CSSPropertyBorderInlineColor:
     5773        return consume2ValueShorthand(borderInlineColorShorthand(), important);
     5774    case CSSPropertyBorderInlineStyle:
     5775        return consume2ValueShorthand(borderInlineStyleShorthand(), important);
     5776    case CSSPropertyBorderInlineWidth:
     5777        return consume2ValueShorthand(borderInlineWidthShorthand(), important);
    57355778    case CSSPropertyBorderInlineStart:
    57365779        return consumeShorthandGreedily(borderInlineStartShorthand(), important);
    57375780    case CSSPropertyBorderInlineEnd:
    57385781        return consumeShorthandGreedily(borderInlineEndShorthand(), important);
     5782    case CSSPropertyBorderBlock: {
     5783        RefPtr<CSSValue> width;
     5784        RefPtr<CSSValue> style;
     5785        RefPtr<CSSValue> color;
     5786        if (!consumeBorder(width, style, color))
     5787            return false;
     5788
     5789        addExpandedPropertyForValue(CSSPropertyBorderBlockWidth, width.releaseNonNull(), important);
     5790        addExpandedPropertyForValue(CSSPropertyBorderBlockStyle, style.releaseNonNull(), important);
     5791        addExpandedPropertyForValue(CSSPropertyBorderBlockColor, color.releaseNonNull(), important);
     5792        return true;
     5793    }
     5794    case CSSPropertyBorderBlockColor:
     5795        return consume2ValueShorthand(borderBlockColorShorthand(), important);
     5796    case CSSPropertyBorderBlockStyle:
     5797        return consume2ValueShorthand(borderBlockStyleShorthand(), important);
     5798    case CSSPropertyBorderBlockWidth:
     5799        return consume2ValueShorthand(borderBlockWidthShorthand(), important);
    57395800    case CSSPropertyBorderBlockStart:
    57405801        return consumeShorthandGreedily(borderBlockStartShorthand(), important);
     
    57745835    }
    57755836    case CSSPropertyBorderColor:
    5776         return consume4Values(borderColorShorthand(), important);
     5837        return consume4ValueShorthand(borderColorShorthand(), important);
    57775838    case CSSPropertyBorderStyle:
    5778         return consume4Values(borderStyleShorthand(), important);
     5839        return consume4ValueShorthand(borderStyleShorthand(), important);
    57795840    case CSSPropertyBorderWidth:
    5780         return consume4Values(borderWidthShorthand(), important);
     5841        return consume4ValueShorthand(borderWidthShorthand(), important);
    57815842    case CSSPropertyBorderTop:
    57825843        return consumeShorthandGreedily(borderTopShorthand(), important);
     
    57875848    case CSSPropertyBorderLeft:
    57885849        return consumeShorthandGreedily(borderLeftShorthand(), important);
    5789     case CSSPropertyBorder:
    5790         return consumeBorder(important);
     5850    case CSSPropertyBorder: {
     5851        RefPtr<CSSValue> width;
     5852        RefPtr<CSSValue> style;
     5853        RefPtr<CSSValue> color;
     5854        if (!consumeBorder(width, style, color))
     5855            return false;
     5856
     5857        addExpandedPropertyForValue(CSSPropertyBorderWidth, width.releaseNonNull(), important);
     5858        addExpandedPropertyForValue(CSSPropertyBorderStyle, style.releaseNonNull(), important);
     5859        addExpandedPropertyForValue(CSSPropertyBorderColor, color.releaseNonNull(), important);
     5860        addExpandedPropertyForValue(CSSPropertyBorderImage, CSSValuePool::singleton().createImplicitInitialValue(), important);
     5861        return true;
     5862    }
    57915863    case CSSPropertyBorderImage:
    57925864        return consumeBorderImage(property, important);
  • trunk/Source/WebCore/css/parser/CSSPropertyParser.h

    r237697 r238244  
    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

    r236091 r238244  
    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

    r238213 r238244  
    322322    bool systemPreviewEnabled() const { return m_systemPreviewEnabled; }
    323323#endif
     324
     325    void setCSSLogicalEnabled(bool isEnabled) { m_CSSLogicalEnabled = isEnabled; }
     326    bool cssLogicalEnabled() const { return m_CSSLogicalEnabled; }
    324327
    325328    WEBCORE_EXPORT static RuntimeEnabledFeatures& sharedFeatures();
     
    485488#endif
    486489
     490    bool m_CSSLogicalEnabled { false };
     491
    487492    friend class WTF::NeverDestroyed<RuntimeEnabledFeatures>;
    488493};
  • trunk/Source/WebKit/ChangeLog

    r238240 r238244  
     12018-11-15  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
    1122018-11-15  Jiewen Tan  <jiewen_tan@apple.com>
    213
  • trunk/Source/WebKit/Shared/WebPreferences.yaml

    r238213 r238244  
    14621462  webcoreBinding: RuntimeEnabledFeatures
    14631463  condition: ENABLE(DATALIST_ELEMENT)
     1464
     1465CSSLogicalEnabled:
     1466  type: bool
     1467  defaultValue: false
     1468  humanReadableName: "CSS Logical Properties and Values"
     1469  humanReadableDescription: "Enable CSS Logical Properties and Values"
     1470  webcoreBinding: RuntimeEnabledFeatures
     1471  category: internal
  • trunk/Source/WebKitLegacy/mac/ChangeLog

    r238206 r238244  
     12018-11-15  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
    1192018-11-14  Joseph Pecoraro  <pecoraro@apple.com>
    220
  • trunk/Source/WebKitLegacy/mac/WebView/WebPreferenceKeysPrivate.h

    r237170 r238244  
    265265#define WebKitServerTimingEnabledPreferenceKey @"WebKitServerTimingEnabled"
    266266#define WebKitSelectionAcrossShadowBoundariesEnabledPreferenceKey @"WebKitSelectionAcrossShadowBoundariesEnabled"
     267#define WebKitCSSLogicalEnabledPreferenceKey @"WebKitCSSLogicalEnabled"
  • trunk/Source/WebKitLegacy/mac/WebView/WebPreferences.mm

    r237421 r238244  
    669669#endif
    670670        [NSNumber numberWithBool:YES], WebKitSelectionAcrossShadowBoundariesEnabledPreferenceKey,
     671        [NSNumber numberWithBool:NO], WebKitCSSLogicalEnabledPreferenceKey,
    671672#if ENABLE(INTERSECTION_OBSERVER)
    672673        @NO, WebKitIntersectionObserverEnabledPreferenceKey,
     
    33903391}
    33913392
     3393- (BOOL)cssLogicalEnabled
     3394{
     3395    return [self _boolValueForKey:WebKitCSSLogicalEnabledPreferenceKey];
     3396}
     3397
     3398- (void)setCSSLogicalEnabled:(BOOL)flag
     3399{
     3400    [self _setBoolValue:flag forKey:WebKitCSSLogicalEnabledPreferenceKey];
     3401}
     3402
    33923403@end
    33933404
  • trunk/Source/WebKitLegacy/mac/WebView/WebPreferencesPrivate.h

    r237170 r238244  
    585585- (void)setSelectionAcrossShadowBoundariesEnabled:(BOOL)flag;
    586586- (BOOL)selectionAcrossShadowBoundariesEnabled;
     587
     588- (void)setCSSLogicalEnabled:(BOOL)flag;
     589- (BOOL)cssLogicalEnabled;
    587590
    588591@property (nonatomic) BOOL visualViewportEnabled;
  • trunk/Source/WebKitLegacy/mac/WebView/WebView.mm

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

    r238241 r238244  
     12018-11-15  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
    1202018-11-15  Timothy Hatcher  <timothy@apple.com>
    221
  • trunk/Tools/DumpRenderTree/TestOptions.cpp

    r237301 r238244  
    110110        else if (key == "experimental:WebGPUEnabled")
    111111            enableWebGPU = parseBooleanTestHeaderValue(value);
     112        else if (key == "internal:CSSLogicalEnabled")
     113            enableCSSLogical = parseBooleanTestHeaderValue(value);
    112114        pairStart = pairEnd + 1;
    113115    }
  • trunk/Tools/DumpRenderTree/TestOptions.h

    r237170 r238244  
    4646    bool enableSelectionAcrossShadowBoundaries { true };
    4747    bool enableWebGPU { false };
     48    bool enableCSSLogical { false };
    4849    std::string jscOptions;
    4950
  • trunk/Tools/DumpRenderTree/mac/DumpRenderTree.mm

    r238134 r238244  
    10121012    preferences.selectionAcrossShadowBoundariesEnabled = options.enableSelectionAcrossShadowBoundaries;
    10131013    preferences.webGPUEnabled = options.enableWebGPU;
     1014    preferences.CSSLogicalEnabled = options.enableCSSLogical;
    10141015}
    10151016
  • trunk/Tools/Scripts/webkitpy/style/checkers/jsonchecker.py

    r225733 r238244  
    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.