Accept two values in the overflow shorthand
authorcommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 8 Oct 2019 19:24:23 +0000 (19:24 +0000)
committercommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 8 Oct 2019 19:24:23 +0000 (19:24 +0000)
https://bugs.webkit.org/show_bug.cgi?id=184691

Patch by Alexey Shvayka <shvaikalesh@gmail.com> on 2019-10-08
Reviewed by Simon Fraser.

LayoutTests/imported/w3c:

* web-platform-tests/css/css-overflow/overflow-shorthand-001-expected.txt:
* web-platform-tests/css/css-overflow/parsing/overflow-computed-expected.txt:
* web-platform-tests/css/css-overflow/parsing/overflow-valid-expected.txt:
* web-platform-tests/css/cssom/shorthand-values-expected.txt:

Source/WebCore:

In https://github.com/w3c/csswg-drafts/issues/2484 it was resolved to accept one or two values in
the overflow shorthand, instead of only one. If two values are specified, the first would be used
for overflow-x and the second for overflow-y. This change was shipped in Firefox 61 and Chrome 68.
This patch implements new syntax while preserving handling of -webkit-paged-x and -webkit-paged-y.

Tests: fast/css/cssText-shorthand.html
       fast/css/getComputedStyle/getComputedStyle-overflow.html
       imported/w3c/web-platform-tests/css/css-overflow/overflow-shorthand-001.html
       imported/w3c/web-platform-tests/css/css-overflow/parsing/overflow-computed.html
       imported/w3c/web-platform-tests/css/css-overflow/parsing/overflow-valid.html
       imported/w3c/web-platform-tests/css/cssom/shorthand-values.html

* css/CSSComputedStyleDeclaration.cpp:
(WebCore::ComputedStyleExtractor::valueForPropertyInStyle):
* css/CSSProperties.json:
* css/StyleProperties.cpp:
(WebCore::StyleProperties::getPropertyValue const):
* css/parser/CSSPropertyParser.cpp:
(WebCore::CSSPropertyParser::consumeOverflowShorthand):
(WebCore::CSSPropertyParser::parseShorthand):
* css/parser/CSSPropertyParser.h:

LayoutTests:

* fast/css/cssText-shorthand-expected.txt:
* fast/css/getComputedStyle/getComputedStyle-overflow-expected.txt:
* fast/css/getComputedStyle/getComputedStyle-overflow.html:
* platform/ios/fast/css/invalidation-errors-2-expected.txt:
* platform/ios/fast/css/invalidation-errors-expected.txt:
* platform/mac/fast/css/invalidation-errors-2-expected.txt:
* platform/mac/fast/css/invalidation-errors-expected.txt:

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

19 files changed:
LayoutTests/ChangeLog
LayoutTests/fast/css/cssText-shorthand-expected.txt
LayoutTests/fast/css/getComputedStyle/getComputedStyle-overflow-expected.txt
LayoutTests/fast/css/getComputedStyle/getComputedStyle-overflow.html
LayoutTests/imported/w3c/ChangeLog
LayoutTests/imported/w3c/web-platform-tests/css/css-overflow/overflow-shorthand-001-expected.txt
LayoutTests/imported/w3c/web-platform-tests/css/css-overflow/parsing/overflow-computed-expected.txt
LayoutTests/imported/w3c/web-platform-tests/css/css-overflow/parsing/overflow-valid-expected.txt
LayoutTests/imported/w3c/web-platform-tests/css/cssom/shorthand-values-expected.txt
LayoutTests/platform/ios/fast/css/invalidation-errors-2-expected.txt
LayoutTests/platform/ios/fast/css/invalidation-errors-expected.txt
LayoutTests/platform/mac/fast/css/invalidation-errors-2-expected.txt
LayoutTests/platform/mac/fast/css/invalidation-errors-expected.txt
Source/WebCore/ChangeLog
Source/WebCore/css/CSSComputedStyleDeclaration.cpp
Source/WebCore/css/CSSProperties.json
Source/WebCore/css/StyleProperties.cpp
Source/WebCore/css/parser/CSSPropertyParser.cpp
Source/WebCore/css/parser/CSSPropertyParser.h

index 512f22e..3364396 100644 (file)
@@ -1,3 +1,18 @@
+2019-10-08  Alexey Shvayka  <shvaikalesh@gmail.com>
+
+        Accept two values in the overflow shorthand
+        https://bugs.webkit.org/show_bug.cgi?id=184691
+
+        Reviewed by Simon Fraser.
+
+        * fast/css/cssText-shorthand-expected.txt:
+        * fast/css/getComputedStyle/getComputedStyle-overflow-expected.txt:
+        * fast/css/getComputedStyle/getComputedStyle-overflow.html:
+        * platform/ios/fast/css/invalidation-errors-2-expected.txt:
+        * platform/ios/fast/css/invalidation-errors-expected.txt:
+        * platform/mac/fast/css/invalidation-errors-2-expected.txt:
+        * platform/mac/fast/css/invalidation-errors-expected.txt:
+
 2019-10-08  Ali Juma  <ajuma@chromium.org>
 
         Unreviewed test gardening
index 6b9c884..60f7c98 100644 (file)
@@ -19,7 +19,7 @@ PASS normalizeCssText(element.style.cssText) is "font-family: sans-serif; font-s
 PASS normalizeCssText(element.style.cssText) is "list-style: circle inside"
 PASS normalizeCssText(element.style.cssText) is "margin: 1px 2px 3px 4px"
 PASS normalizeCssText(element.style.cssText) is "outline: blue dotted 2px"
-FAIL normalizeCssText(element.style.cssText) should be overflow: scroll hidden. Was overflow-x: scroll; overflow-y: hidden.
+PASS normalizeCssText(element.style.cssText) is "overflow: scroll hidden"
 PASS normalizeCssText(element.style.cssText) is "overflow: scroll"
 PASS normalizeCssText(element.style.cssText) is "padding: 1px 2px 3px 4px"
 PASS normalizeCssText(element.style.cssText) is "list-style-type: lower-alpha"
index 0bf156a..690d3b0 100644 (file)
@@ -25,23 +25,15 @@ PASS computedStyle.getPropertyValue('overflow-x') is "auto"
 PASS computedStyle.getPropertyValue('overflow-y') is "auto"
 PASS computedStyle.getPropertyValue('overflow') is "auto"
 
-PASS computedStyle.getPropertyValue('overflow-x') is "auto"
-PASS computedStyle.getPropertyValue('overflow-y') is "auto"
-PASS computedStyle.getPropertyValue('overflow') is "auto"
-
-PASS computedStyle.getPropertyValue('overflow-x') is "auto"
-PASS computedStyle.getPropertyValue('overflow-y') is "auto"
-PASS computedStyle.getPropertyValue('overflow') is "auto"
-
 Paged tests
 
 PASS computedStyle.getPropertyValue('overflow-x') is "auto"
 PASS computedStyle.getPropertyValue('overflow-y') is "-webkit-paged-x"
-PASS computedStyle.getPropertyValue('overflow') is "-webkit-paged-x"
+PASS computedStyle.getPropertyValue('overflow') is "auto -webkit-paged-x"
 
 PASS computedStyle.getPropertyValue('overflow-x') is "auto"
 PASS computedStyle.getPropertyValue('overflow-y') is "-webkit-paged-y"
-PASS computedStyle.getPropertyValue('overflow') is "-webkit-paged-y"
+PASS computedStyle.getPropertyValue('overflow') is "auto -webkit-paged-y"
 
 Longhand tests
 
@@ -54,59 +46,59 @@ PASS e.style.overflow is "scroll"
 
 PASS computedStyle.getPropertyValue('overflow-x') is "scroll"
 PASS computedStyle.getPropertyValue('overflow-y') is "auto"
-PASS computedStyle.getPropertyValue('overflow') is "auto"
+PASS computedStyle.getPropertyValue('overflow') is "scroll auto"
 PASS e.style.overflowX is "scroll"
 PASS e.style.overflowY is "auto"
-PASS e.style.overflow is ""
+PASS e.style.overflow is "scroll auto"
 
 PASS computedStyle.getPropertyValue('overflow-x') is "auto"
 PASS computedStyle.getPropertyValue('overflow-y') is "scroll"
-PASS computedStyle.getPropertyValue('overflow') is "auto"
+PASS computedStyle.getPropertyValue('overflow') is "auto scroll"
 PASS e.style.overflowX is "auto"
 PASS e.style.overflowY is "scroll"
-PASS e.style.overflow is ""
+PASS e.style.overflow is "auto scroll"
 
 PASS computedStyle.getPropertyValue('overflow-x') is "auto"
 PASS computedStyle.getPropertyValue('overflow-y') is "hidden"
-PASS computedStyle.getPropertyValue('overflow') is "auto"
+PASS computedStyle.getPropertyValue('overflow') is "auto hidden"
 PASS e.style.overflowX is "visible"
 PASS e.style.overflowY is "hidden"
-PASS e.style.overflow is ""
+PASS e.style.overflow is "visible hidden"
 
 PASS computedStyle.getPropertyValue('overflow-x') is "auto"
 PASS computedStyle.getPropertyValue('overflow-y') is "hidden"
-PASS computedStyle.getPropertyValue('overflow') is "auto"
+PASS computedStyle.getPropertyValue('overflow') is "auto hidden"
 PASS e.style.overflowX is "overlay"
 PASS e.style.overflowY is "hidden"
-PASS e.style.overflow is ""
+PASS e.style.overflow is "overlay hidden"
 
 PASS computedStyle.getPropertyValue('overflow-x') is "auto"
 PASS computedStyle.getPropertyValue('overflow-y') is "-webkit-paged-y"
-PASS computedStyle.getPropertyValue('overflow') is "-webkit-paged-y"
+PASS computedStyle.getPropertyValue('overflow') is "auto -webkit-paged-y"
 PASS e.style.overflowX is "visible"
 PASS e.style.overflowY is "-webkit-paged-y"
-PASS e.style.overflow is ""
+PASS e.style.overflow is "visible -webkit-paged-y"
 
 PASS computedStyle.getPropertyValue('overflow-x') is "auto"
 PASS computedStyle.getPropertyValue('overflow-y') is "-webkit-paged-x"
-PASS computedStyle.getPropertyValue('overflow') is "-webkit-paged-x"
+PASS computedStyle.getPropertyValue('overflow') is "auto -webkit-paged-x"
 PASS e.style.overflowX is "auto"
 PASS e.style.overflowY is "-webkit-paged-x"
-PASS e.style.overflow is ""
+PASS e.style.overflow is "auto -webkit-paged-x"
 
 PASS computedStyle.getPropertyValue('overflow-x') is "auto"
 PASS computedStyle.getPropertyValue('overflow-y') is "-webkit-paged-x"
-PASS computedStyle.getPropertyValue('overflow') is "-webkit-paged-x"
+PASS computedStyle.getPropertyValue('overflow') is "auto -webkit-paged-x"
 PASS e.style.overflowX is "auto"
 PASS e.style.overflowY is "-webkit-paged-x"
-PASS e.style.overflow is ""
+PASS e.style.overflow is "auto -webkit-paged-x"
 
 PASS computedStyle.getPropertyValue('overflow-x') is "auto"
 PASS computedStyle.getPropertyValue('overflow-y') is "-webkit-paged-x"
-PASS computedStyle.getPropertyValue('overflow') is "-webkit-paged-x"
+PASS computedStyle.getPropertyValue('overflow') is "auto -webkit-paged-x"
 PASS e.style.overflowX is "auto"
 PASS e.style.overflowY is "-webkit-paged-x"
-PASS e.style.overflow is ""
+PASS e.style.overflow is "auto -webkit-paged-x"
 PASS successfullyParsed is true
 
 TEST COMPLETE
index 1f85b8d..527ea25 100644 (file)
@@ -27,9 +27,6 @@ const tests = [
     [ 'visible', 'visible' ],
     [ 'hidden', 'hidden' ],
     [ 'overlay', 'auto' ],
-
-    [ 'hidden visible', 'auto' ], // WebKit doesn't support different values of overflow on different axes.
-    [ 'hidden hidden', 'auto' ], // WebKit doesn't support different values of overflow on different axes, and thus only accepts a single value for overflow.
 ];
 
 for (let test of tests) {
@@ -46,8 +43,8 @@ debug('Paged tests');
 
 const pagedTests = [
     // shorthand, expected-x, expected-y, expected-shorthand
-    [ '-webkit-paged-x', 'auto', '-webkit-paged-x', '-webkit-paged-x' ],
-    [ '-webkit-paged-y', 'auto', '-webkit-paged-y', '-webkit-paged-y' ],
+    [ '-webkit-paged-x', 'auto', '-webkit-paged-x', 'auto -webkit-paged-x' ],
+    [ '-webkit-paged-y', 'auto', '-webkit-paged-y', 'auto -webkit-paged-y' ],
 ];
 
 for (let test of pagedTests) {
@@ -69,36 +66,36 @@ const longhandTests = [
         'scroll', 'scroll', 'scroll'],
 
     [ 'scroll', 'auto',
-        'scroll', 'auto', 'auto',
-        'scroll', 'auto', ''],
+        'scroll', 'auto', 'scroll auto',
+        'scroll', 'auto', 'scroll auto'],
 
     [ 'auto', 'scroll',
-        'auto', 'scroll', 'auto',
-        'auto', 'scroll', ''],
+        'auto', 'scroll', 'auto scroll',
+        'auto', 'scroll', 'auto scroll'],
 
     [ 'visible', 'hidden',
-        'auto', 'hidden', 'auto',
-        'visible', 'hidden', ''],
+        'auto', 'hidden', 'auto hidden',
+        'visible', 'hidden', 'visible hidden'],
 
     [ 'overlay', 'hidden',
-        'auto','hidden', 'auto',
-        'overlay', 'hidden', ''],
+        'auto', 'hidden', 'auto hidden',
+        'overlay', 'hidden', 'overlay hidden'],
 
     [ 'visible', '-webkit-paged-y',
-        'auto', '-webkit-paged-y', '-webkit-paged-y',
-        'visible', '-webkit-paged-y', ''],
+        'auto', '-webkit-paged-y', 'auto -webkit-paged-y',
+        'visible', '-webkit-paged-y', 'visible -webkit-paged-y'],
 
     [ 'auto', '-webkit-paged-x',
-        'auto', '-webkit-paged-x', '-webkit-paged-x',
-        'auto', '-webkit-paged-x', ''],
+        'auto', '-webkit-paged-x', 'auto -webkit-paged-x',
+        'auto', '-webkit-paged-x', 'auto -webkit-paged-x'],
 
     [ '-webkit-paged-x', '-webkit-paged-x',
-        'auto', '-webkit-paged-x', '-webkit-paged-x',
-        'auto', '-webkit-paged-x', ''],
+        'auto', '-webkit-paged-x', 'auto -webkit-paged-x',
+        'auto', '-webkit-paged-x', 'auto -webkit-paged-x'],
 
     [ '-webkit-paged-y', '-webkit-paged-x',
-        'auto', '-webkit-paged-x', '-webkit-paged-x',
-        'auto', '-webkit-paged-x', ''],
+        'auto', '-webkit-paged-x', 'auto -webkit-paged-x',
+        'auto', '-webkit-paged-x', 'auto -webkit-paged-x'],
 ];
 
 for (let test of longhandTests) {
index 31b7229..043395a 100644 (file)
@@ -1,3 +1,15 @@
+2019-10-08  Alexey Shvayka  <shvaikalesh@gmail.com>
+
+        Accept two values in the overflow shorthand
+        https://bugs.webkit.org/show_bug.cgi?id=184691
+
+        Reviewed by Simon Fraser.
+
+        * web-platform-tests/css/css-overflow/overflow-shorthand-001-expected.txt:
+        * web-platform-tests/css/css-overflow/parsing/overflow-computed-expected.txt:
+        * web-platform-tests/css/css-overflow/parsing/overflow-valid-expected.txt:
+        * web-platform-tests/css/cssom/shorthand-values-expected.txt:
+
 2019-10-08  Ali Juma  <ajuma@chromium.org>
 
         Import autofocus Web Platform Tests
index 8f35ddf..efd079a 100644 (file)
@@ -1,18 +1,18 @@
 
-FAIL overflow: auto auto works assert_equals: expected "auto" but got ""
-FAIL overflow: auto hidden works assert_equals: expected "auto hidden" but got ""
-FAIL overflow: auto scroll works assert_equals: expected "auto scroll" but got ""
-FAIL overflow: auto visible works assert_equals: expected "auto visible" but got ""
-FAIL overflow: hidden auto works assert_equals: expected "hidden auto" but got ""
-FAIL overflow: hidden hidden works assert_equals: expected "hidden" but got ""
-FAIL overflow: hidden scroll works assert_equals: expected "hidden scroll" but got ""
-FAIL overflow: hidden visible works assert_equals: expected "hidden visible" but got ""
-FAIL overflow: scroll auto works assert_equals: expected "scroll auto" but got ""
-FAIL overflow: scroll hidden works assert_equals: expected "scroll hidden" but got ""
-FAIL overflow: scroll scroll works assert_equals: expected "scroll" but got ""
-FAIL overflow: scroll visible works assert_equals: expected "scroll visible" but got ""
-FAIL overflow: visible auto works assert_equals: expected "visible auto" but got ""
-FAIL overflow: visible hidden works assert_equals: expected "visible hidden" but got ""
-FAIL overflow: visible scroll works assert_equals: expected "visible scroll" but got ""
-FAIL overflow: visible visible works assert_equals: expected "visible" but got ""
+PASS overflow: auto auto works 
+PASS overflow: auto hidden works 
+PASS overflow: auto scroll works 
+PASS overflow: auto visible works 
+PASS overflow: hidden auto works 
+PASS overflow: hidden hidden works 
+PASS overflow: hidden scroll works 
+PASS overflow: hidden visible works 
+PASS overflow: scroll auto works 
+PASS overflow: scroll hidden works 
+PASS overflow: scroll scroll works 
+PASS overflow: scroll visible works 
+PASS overflow: visible auto works 
+PASS overflow: visible hidden works 
+PASS overflow: visible scroll works 
+PASS overflow: visible visible works 
 
index 1382189..7c9052f 100644 (file)
@@ -4,21 +4,21 @@ PASS Property overflow value 'hidden' computes to 'hidden'
 FAIL Property overflow value 'clip' computes to 'clip' assert_equals: expected "clip" but got "visible"
 PASS Property overflow value 'scroll' computes to 'scroll' 
 PASS Property overflow value 'auto' computes to 'auto' 
-FAIL Property overflow value 'auto auto' computes to 'auto' assert_equals: expected "auto" but got "visible"
+PASS Property overflow value 'auto auto' computes to 'auto' 
 FAIL Property overflow value 'auto clip' computes to 'auto hidden' assert_equals: expected "auto hidden" but got "visible"
-FAIL Property overflow value 'auto visible' computes to 'auto' assert_equals: expected "auto" but got "visible"
+PASS Property overflow value 'auto visible' computes to 'auto' 
 FAIL Property overflow value 'clip auto' computes to 'hidden auto' assert_equals: expected "hidden auto" but got "visible"
 FAIL Property overflow value 'clip clip' computes to 'clip' assert_equals: expected "clip" but got "visible"
 FAIL Property overflow value 'clip hidden' computes to 'hidden' assert_equals: expected "hidden" but got "visible"
 FAIL Property overflow value 'clip scroll' computes to 'hidden scroll' assert_equals: expected "hidden scroll" but got "visible"
 FAIL Property overflow value 'hidden clip' computes to 'hidden' assert_equals: expected "hidden" but got "visible"
-FAIL Property overflow value 'hidden visible' computes to 'hidden auto' assert_equals: expected "hidden auto" but got "visible"
-FAIL Property overflow value 'scroll auto' computes to 'scroll auto' assert_equals: expected "scroll auto" but got "visible"
+PASS Property overflow value 'hidden visible' computes to 'hidden auto' 
+PASS Property overflow value 'scroll auto' computes to 'scroll auto' 
 FAIL Property overflow value 'scroll clip' computes to 'scroll hidden' assert_equals: expected "scroll hidden" but got "visible"
-FAIL Property overflow value 'scroll visible' computes to 'scroll auto' assert_equals: expected "scroll auto" but got "visible"
-FAIL Property overflow value 'visible auto' computes to 'auto' assert_equals: expected "auto" but got "visible"
-FAIL Property overflow value 'visible hidden' computes to 'auto hidden' assert_equals: expected "auto hidden" but got "visible"
-FAIL Property overflow value 'visible scroll' computes to 'auto scroll' assert_equals: expected "auto scroll" but got "visible"
+PASS Property overflow value 'scroll visible' computes to 'scroll auto' 
+PASS Property overflow value 'visible auto' computes to 'auto' 
+PASS Property overflow value 'visible hidden' computes to 'auto hidden' 
+PASS Property overflow value 'visible scroll' computes to 'auto scroll' 
 PASS Property overflow value 'visible visible' computes to 'visible' 
 PASS Property overflow-x value 'scroll' computes to 'scroll' 
 PASS Property overflow-x value 'hidden' computes to 'hidden' 
index 1f0b906..332e7c6 100644 (file)
@@ -4,11 +4,11 @@ PASS e.style['overflow'] = "hidden" should set the property value
 FAIL e.style['overflow'] = "clip" should set the property value assert_not_equals: property should be set got disallowed value ""
 PASS e.style['overflow'] = "scroll" should set the property value 
 PASS e.style['overflow'] = "auto" should set the property value 
-FAIL e.style['overflow'] = "visible visible" should set the property value assert_not_equals: property should be set got disallowed value ""
-FAIL e.style['overflow'] = "hidden visible" should set the property value assert_not_equals: property should be set got disallowed value ""
+PASS e.style['overflow'] = "visible visible" should set the property value 
+PASS e.style['overflow'] = "hidden visible" should set the property value 
 FAIL e.style['overflow'] = "clip clip" should set the property value assert_not_equals: property should be set got disallowed value ""
-FAIL e.style['overflow'] = "scroll auto" should set the property value assert_not_equals: property should be set got disallowed value ""
-FAIL e.style['overflow'] = "auto auto" should set the property value assert_not_equals: property should be set got disallowed value ""
+PASS e.style['overflow'] = "scroll auto" should set the property value 
+PASS e.style['overflow'] = "auto auto" should set the property value 
 PASS e.style['overflow-x'] = "visible" should set the property value 
 PASS e.style['overflow-x'] = "scroll" should set the property value 
 FAIL e.style['overflow-y'] = "clip" should set the property value assert_not_equals: property should be set got disallowed value ""
index 98037d9..aeb7669 100644 (file)
@@ -10,7 +10,7 @@ PASS The serialization of border: 1px; border-top: 1px !important; should be can
 PASS The serialization of border: 1px; border-top-color: red; should be canonical. 
 PASS The serialization of border: solid; border-style: dotted should be canonical. 
 PASS The serialization of border-width: 1px; should be canonical. 
-FAIL The serialization of overflow-x: scroll; overflow-y: hidden; should be canonical. assert_equals: expected "overflow: scroll hidden;" but got "overflow-x: scroll; overflow-y: hidden;"
+PASS The serialization of overflow-x: scroll; overflow-y: hidden; should be canonical. 
 PASS The serialization of overflow-x: scroll; overflow-y: scroll; should be canonical. 
 PASS The serialization of outline-width: 2px; outline-style: dotted; outline-color: blue; should be canonical. 
 PASS The serialization of margin-top: 1px; margin-right: 2px; margin-bottom: 3px; margin-left: 4px; should be canonical. 
index 25cbc05..35f1f73 100644 (file)
@@ -13,15 +13,15 @@ layer at (0,0) size 800x600
         RenderInline {DIV} at (0,0) size 0x0
           RenderText {#text} at (0,0) size 0x0
         RenderText {#text} at (0,0) size 0x0
-layer at (8,44) size 200x200
+layer at (8,44) size 200x200 clip at (8,44) size 185x200
   RenderBlock (floating) {DIV} at (0,0) size 200x200 [color=#FFFFFF] [bgcolor=#006400]
-    RenderText {#text} at (0,0) size 187x144
+    RenderText {#text} at (0,0) size 178x144
       text run at (0,0) width 154: "this text should be left-"
       text run at (0,18) width 153: "aligned, all lower-case,"
       text run at (0,36) width 165: "normal font, white, 14px,"
       text run at (0,54) width 177: "bold, normally spaced and"
       text run at (0,72) width 162: "wrapped, in a darkgreen"
       text run at (0,90) width 99: "200x200px div "
-      text run at (98,90) width 89: "in the top left"
-      text run at (0,108) width 171: "corner with no borders or"
-      text run at (0,126) width 58: "outlines."
+      text run at (98,90) width 64: "in the top"
+      text run at (0,108) width 178: "left corner with no borders"
+      text run at (0,126) width 76: "or outlines."
index 25cbc05..35f1f73 100644 (file)
@@ -13,15 +13,15 @@ layer at (0,0) size 800x600
         RenderInline {DIV} at (0,0) size 0x0
           RenderText {#text} at (0,0) size 0x0
         RenderText {#text} at (0,0) size 0x0
-layer at (8,44) size 200x200
+layer at (8,44) size 200x200 clip at (8,44) size 185x200
   RenderBlock (floating) {DIV} at (0,0) size 200x200 [color=#FFFFFF] [bgcolor=#006400]
-    RenderText {#text} at (0,0) size 187x144
+    RenderText {#text} at (0,0) size 178x144
       text run at (0,0) width 154: "this text should be left-"
       text run at (0,18) width 153: "aligned, all lower-case,"
       text run at (0,36) width 165: "normal font, white, 14px,"
       text run at (0,54) width 177: "bold, normally spaced and"
       text run at (0,72) width 162: "wrapped, in a darkgreen"
       text run at (0,90) width 99: "200x200px div "
-      text run at (98,90) width 89: "in the top left"
-      text run at (0,108) width 171: "corner with no borders or"
-      text run at (0,126) width 58: "outlines."
+      text run at (98,90) width 64: "in the top"
+      text run at (0,108) width 178: "left corner with no borders"
+      text run at (0,126) width 76: "or outlines."
index 87ec46c..c7de656 100644 (file)
@@ -13,15 +13,15 @@ layer at (0,0) size 800x600
         RenderInline {DIV} at (0,0) size 0x0
           RenderText {#text} at (0,0) size 0x0
         RenderText {#text} at (0,0) size 0x0
-layer at (8,42) size 200x200
+layer at (8,42) size 200x200 clip at (8,42) size 185x200
   RenderBlock (floating) {DIV} at (0,0) size 200x200 [color=#FFFFFF] [bgcolor=#006400]
-    RenderText {#text} at (0,0) size 187x128
+    RenderText {#text} at (0,0) size 178x128
       text run at (0,0) width 154: "this text should be left-"
       text run at (0,16) width 153: "aligned, all lower-case,"
       text run at (0,32) width 165: "normal font, white, 14px,"
       text run at (0,48) width 177: "bold, normally spaced and"
       text run at (0,64) width 162: "wrapped, in a darkgreen"
       text run at (0,80) width 99: "200x200px div "
-      text run at (98,80) width 89: "in the top left"
-      text run at (0,96) width 171: "corner with no borders or"
-      text run at (0,112) width 58: "outlines."
+      text run at (98,80) width 64: "in the top"
+      text run at (0,96) width 178: "left corner with no borders"
+      text run at (0,112) width 76: "or outlines."
index 87ec46c..c7de656 100644 (file)
@@ -13,15 +13,15 @@ layer at (0,0) size 800x600
         RenderInline {DIV} at (0,0) size 0x0
           RenderText {#text} at (0,0) size 0x0
         RenderText {#text} at (0,0) size 0x0
-layer at (8,42) size 200x200
+layer at (8,42) size 200x200 clip at (8,42) size 185x200
   RenderBlock (floating) {DIV} at (0,0) size 200x200 [color=#FFFFFF] [bgcolor=#006400]
-    RenderText {#text} at (0,0) size 187x128
+    RenderText {#text} at (0,0) size 178x128
       text run at (0,0) width 154: "this text should be left-"
       text run at (0,16) width 153: "aligned, all lower-case,"
       text run at (0,32) width 165: "normal font, white, 14px,"
       text run at (0,48) width 177: "bold, normally spaced and"
       text run at (0,64) width 162: "wrapped, in a darkgreen"
       text run at (0,80) width 99: "200x200px div "
-      text run at (98,80) width 89: "in the top left"
-      text run at (0,96) width 171: "corner with no borders or"
-      text run at (0,112) width 58: "outlines."
+      text run at (98,80) width 64: "in the top"
+      text run at (0,96) width 178: "left corner with no borders"
+      text run at (0,112) width 76: "or outlines."
index 2503a75..50996e5 100644 (file)
@@ -1,3 +1,32 @@
+2019-10-08  Alexey Shvayka  <shvaikalesh@gmail.com>
+
+        Accept two values in the overflow shorthand
+        https://bugs.webkit.org/show_bug.cgi?id=184691
+
+        Reviewed by Simon Fraser.
+
+        In https://github.com/w3c/csswg-drafts/issues/2484 it was resolved to accept one or two values in
+        the overflow shorthand, instead of only one. If two values are specified, the first would be used
+        for overflow-x and the second for overflow-y. This change was shipped in Firefox 61 and Chrome 68.
+        This patch implements new syntax while preserving handling of -webkit-paged-x and -webkit-paged-y.
+
+        Tests: fast/css/cssText-shorthand.html
+               fast/css/getComputedStyle/getComputedStyle-overflow.html
+               imported/w3c/web-platform-tests/css/css-overflow/overflow-shorthand-001.html
+               imported/w3c/web-platform-tests/css/css-overflow/parsing/overflow-computed.html
+               imported/w3c/web-platform-tests/css/css-overflow/parsing/overflow-valid.html
+               imported/w3c/web-platform-tests/css/cssom/shorthand-values.html
+
+        * css/CSSComputedStyleDeclaration.cpp:
+        (WebCore::ComputedStyleExtractor::valueForPropertyInStyle):
+        * css/CSSProperties.json:
+        * css/StyleProperties.cpp:
+        (WebCore::StyleProperties::getPropertyValue const):
+        * css/parser/CSSPropertyParser.cpp:
+        (WebCore::CSSPropertyParser::consumeOverflowShorthand):
+        (WebCore::CSSPropertyParser::parseShorthand):
+        * css/parser/CSSPropertyParser.h:
+
 2019-10-08  Wenson Hsieh  <wenson_hsieh@apple.com>
 
         Unreviewed, fix WebCore's features.json after r250824
index 5806fac..922eed7 100644 (file)
@@ -3406,7 +3406,7 @@ RefPtr<CSSValue> ComputedStyleExtractor::valueForPropertyInStyle(const RenderSty
         case CSSPropertyOutlineWidth:
             return zoomAdjustedPixelValue(style.outlineWidth(), style);
         case CSSPropertyOverflow:
-            return cssValuePool.createValue(std::max(style.overflowX(), style.overflowY()));
+            return getCSSPropertyValuesFor2SidesShorthand(overflowShorthand());
         case CSSPropertyOverflowWrap:
             return cssValuePool.createValue(style.overflowWrap());
         case CSSPropertyOverflowX:
index aac2fb9..306aaca 100644 (file)
@@ -93,7 +93,7 @@
         "setting the inherited value, it will not fallback to using the parent's",
         "\"color\" property if the inherited color is invalid.",
         "",
-        "* fone-property:",
+        "* font-property:",
         "Indicates that this CSS property is font-related. It must have corresponding",
         "methods on the FontDescription class.",
         "",
                 ]
             },
             "specification": {
-                "category": "css-22",
-                "url": "https://www.w3.org/TR/CSS22/visufx.html#propdef-overflow"
+                "category": "css-overflow",
+                "url": "https://www.w3.org/TR/css-overflow-3/#propdef-overflow"
             }
         },
         "overflow-wrap": {
index 19cb033..70cd7d5 100644 (file)
@@ -243,7 +243,7 @@ String StyleProperties::getPropertyValue(CSSPropertyID propertyID) const
     case CSSPropertyWebkitMarginCollapse:
         return getShorthandValue(webkitMarginCollapseShorthand());
     case CSSPropertyOverflow:
-        return getCommonValue(overflowShorthand());
+        return get2Values(overflowShorthand());
     case CSSPropertyPadding:
         return get4Values(paddingShorthand());
     case CSSPropertyPaddingBlock:
index 7ffc67c..ffcb2a6 100644 (file)
@@ -5228,6 +5228,35 @@ bool CSSPropertyParser::consumeBackgroundShorthand(const StylePropertyShorthand&
     return true;
 }
 
+bool CSSPropertyParser::consumeOverflowShorthand(bool important)
+{
+    CSSValueID xValueID = m_range.consumeIncludingWhitespace().id();
+    if (!CSSParserFastPaths::isValidKeywordPropertyAndValue(CSSPropertyOverflowY, xValueID, m_context))
+        return false;
+
+    CSSValueID yValueID;
+    if (m_range.atEnd()) {
+        yValueID = xValueID;
+
+        // FIXME: -webkit-paged-x or -webkit-paged-y only apply to overflow-y. If this value has been
+        // set using the shorthand, then for now overflow-x will default to auto, but once we implement
+        // pagination controls, it should default to hidden. If the overflow-y value is anything but
+        // paged-x or paged-y, then overflow-x and overflow-y should have the same value.
+        if (xValueID == CSSValueWebkitPagedX || xValueID == CSSValueWebkitPagedY)
+            xValueID = CSSValueAuto;
+    } else 
+        yValueID = m_range.consumeIncludingWhitespace().id();
+
+    if (!CSSParserFastPaths::isValidKeywordPropertyAndValue(CSSPropertyOverflowY, yValueID, m_context))
+        return false;
+    if (!m_range.atEnd())
+        return false;
+
+    addProperty(CSSPropertyOverflowX, CSSPropertyOverflow, CSSValuePool::singleton().createIdentifierValue(xValueID), important);
+    addProperty(CSSPropertyOverflowY, CSSPropertyOverflow, CSSValuePool::singleton().createIdentifierValue(yValueID), important);
+    return true;
+}
+
 // FIXME-NEWPARSER: Hack to work around the fact that we aren't using CSSCustomIdentValue
 // for stuff yet. This can be replaced by CSSValue::isCustomIdentValue() once we switch
 // to using CSSCustomIdentValue everywhere.
@@ -5587,27 +5616,8 @@ bool CSSPropertyParser::parseShorthand(CSSPropertyID property, bool important)
         addProperty(CSSPropertyWebkitMarginAfterCollapse, CSSPropertyWebkitMarginCollapse, CSSValuePool::singleton().createIdentifierValue(id), important);
         return true;
     }
-    case CSSPropertyOverflow: {
-        CSSValueID id = m_range.consumeIncludingWhitespace().id();
-        if (!CSSParserFastPaths::isValidKeywordPropertyAndValue(CSSPropertyOverflowY, id, m_context))
-            return false;
-        if (!m_range.atEnd())
-            return false;
-        RefPtr<CSSValue> overflowYValue = CSSValuePool::singleton().createIdentifierValue(id);
-        RefPtr<CSSValue> overflowXValue;
-
-        // FIXME: -webkit-paged-x or -webkit-paged-y only apply to overflow-y. If this value has been
-        // set using the shorthand, then for now overflow-x will default to auto, but once we implement
-        // pagination controls, it should default to hidden. If the overflow-y value is anything but
-        // paged-x or paged-y, then overflow-x and overflow-y should have the same value.
-        if (id == CSSValueWebkitPagedX || id == CSSValueWebkitPagedY)
-            overflowXValue = CSSValuePool::singleton().createIdentifierValue(CSSValueAuto);
-        else
-            overflowXValue = overflowYValue;
-        addProperty(CSSPropertyOverflowX, CSSPropertyOverflow, *overflowXValue, important);
-        addProperty(CSSPropertyOverflowY, CSSPropertyOverflow, *overflowYValue, important);
-        return true;
-    }
+    case CSSPropertyOverflow:
+        return consumeOverflowShorthand(important);
     case CSSPropertyFont: {
         const CSSParserToken& token = m_range.peek();
         if (token.id() >= CSSValueCaption && token.id() <= CSSValueStatusBar)
index bcd1b92..65e8605 100644 (file)
@@ -79,6 +79,7 @@ private:
     // Legacy parsing allows <string>s for animation-name
     bool consumeAnimationShorthand(const StylePropertyShorthand&, bool important);
     bool consumeBackgroundShorthand(const StylePropertyShorthand&, bool important);
+    bool consumeOverflowShorthand(bool important);
 
     bool consumeColumns(bool important);