Unprefix -webkit-sticky
authordrousso@apple.com <drousso@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 16 Apr 2019 19:48:37 +0000 (19:48 +0000)
committerdrousso@apple.com <drousso@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 16 Apr 2019 19:48:37 +0000 (19:48 +0000)
https://bugs.webkit.org/show_bug.cgi?id=196962
<rdar://problem/40903458>

Reviewed by Simon Fraser.

Source/WebCore:

Updated existing tests.

This change doesn't modify functionality, only exposing a new unprefixed CSS value.

* css/CSSProperties.json:
* css/CSSValueKeywords.in:

* css/CSSPrimitiveValueMappings.h:
(WebCore::CSSPrimitiveValue::CSSPrimitiveValue):
(WebCore::CSSPrimitiveValue::operator PositionType const):

* css/parser/CSSParserFastPaths.cpp:
(WebCore::CSSParserFastPaths::isValidKeywordPropertyAndValue):

* editing/EditingStyle.cpp:
(WebCore::EditingStyle::convertPositionStyle):

Source/WebInspectorUI:

Replace all `-webkit-sticky` with `sticky`.

* UserInterface/Models/CSSKeywordCompletions.js:
* UserInterface/Views/AuditTestCaseContentView.css:
(.content-view-container > .content-view.audit-test-case > header):
* UserInterface/Views/AuditTestGroupContentView.css:
(.content-view.audit-test-group.contains-test-case > header):
* UserInterface/Views/ChangesDetailsSidebarPanel.css:
(.changes-panel .resource-section > .header):
* UserInterface/Views/DetailsSection.css:
(.details-section > .header):
* UserInterface/Views/NetworkDetailView.css:
(.network-detail .navigation-bar):
* UserInterface/Views/SettingsTabContentView.css:
(.content-view.settings .navigation-bar):
* UserInterface/Views/Table.css:
(.table > .header):

LayoutTests:

* compositing/layer-creation/no-compositing-for-sticky.html:
* editing/pasteboard/copy-paste-converts-sticky.html:
* editing/pasteboard/copy-paste-converts-sticky-expected.txt:
* fast/block/positioning/fixed-container-with-sticky-parent.html:
* fast/block/sticky-position-containing-block-crash.html:
* fast/css/sticky/inflow-sticky.html:
* fast/css/sticky/inline-sticky-abspos-child.html:
* fast/css/sticky/inline-sticky.html:
* fast/css/sticky/multiple-layers-sticky-crash.html:
* fast/css/sticky/parsing-position-sticky-expected.txt:
* fast/css/sticky/remove-inline-sticky-crash.html:
* fast/css/sticky/remove-sticky-crash.html:
* fast/css/sticky/replaced-sticky.html:
* fast/css/sticky/resources/parsing-position-sticky.js:
* fast/css/sticky/sticky-as-positioning-container.html:
* fast/css/sticky/sticky-both-sides.html:
* fast/css/sticky/sticky-bottom-overflow-padding.html:
* fast/css/sticky/sticky-left-percentage.html:
* fast/css/sticky/sticky-left.html:
* fast/css/sticky/sticky-margins.html:
* fast/css/sticky/sticky-overflowing.html:
* fast/css/sticky/sticky-side-margins.html:
* fast/css/sticky/sticky-stacking-context.html:
* fast/css/sticky/sticky-stacking-context-expected.html:
* fast/css/sticky/sticky-table-row-top.html:
* fast/css/sticky/sticky-table-thead-top.html:
* fast/css/sticky/sticky-top-margins.html:
* fast/css/sticky/sticky-top-overflow-container-overflow.html:
* fast/css/sticky/sticky-top-overflow.html:
* fast/css/sticky/sticky-top-zoomed.html:
* fast/css/sticky/sticky-top-zoomed-expected.html:
* fast/css/sticky/sticky-top.html:
* fast/css/sticky/sticky-writing-mode-horizontal-bt.html:
* fast/css/sticky/sticky-writing-mode-vertical-lr.html:
* fast/css/sticky/sticky-writing-mode-vertical-rl.html:
* fast/multicol/newmulticol/table-section-crash.html:
* fast/scrolling/ios/reconcile-layer-position-recursive.html:
* fast/scrolling/rtl-scrollbars-sticky-document-2.html:
* fast/scrolling/rtl-scrollbars-sticky-document.html:
* fast/scrolling/rtl-scrollbars-sticky-iframe-2.html:
* fast/scrolling/rtl-scrollbars-sticky-iframe.html:
* fast/scrolling/rtl-scrollbars-sticky-overflow-scroll-2.html:
* fast/scrolling/rtl-scrollbars-sticky-overflow-scroll.html:
* fast/scrolling/sticky-to-fixed.html:
* legacy-animation-engine/fast/multicol/newmulticol/table-section-crash.html:
* scrollingcoordinator/scrolling-tree/resources/doc-with-sticky.html:
* svg/text/select-text-inside-non-static-position.html:
* tiled-drawing/scrolling/sticky/negative-scroll-offset.html:
* tiled-drawing/scrolling/sticky/sticky-horizontal.html:
* tiled-drawing/scrolling/sticky/sticky-layers.html:
* tiled-drawing/scrolling/sticky/sticky-vertical.html:

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

67 files changed:
LayoutTests/ChangeLog
LayoutTests/compositing/layer-creation/no-compositing-for-sticky.html
LayoutTests/editing/pasteboard/copy-paste-converts-sticky-expected.txt
LayoutTests/editing/pasteboard/copy-paste-converts-sticky.html
LayoutTests/fast/block/positioning/fixed-container-with-sticky-parent.html
LayoutTests/fast/block/sticky-position-containing-block-crash.html
LayoutTests/fast/css/sticky/inflow-sticky.html
LayoutTests/fast/css/sticky/inline-sticky-abspos-child.html
LayoutTests/fast/css/sticky/inline-sticky.html
LayoutTests/fast/css/sticky/multiple-layers-sticky-crash.html
LayoutTests/fast/css/sticky/parsing-position-sticky-expected.txt
LayoutTests/fast/css/sticky/remove-inline-sticky-crash.html
LayoutTests/fast/css/sticky/remove-sticky-crash.html
LayoutTests/fast/css/sticky/replaced-sticky.html
LayoutTests/fast/css/sticky/resources/parsing-position-sticky.js
LayoutTests/fast/css/sticky/sticky-as-positioning-container.html
LayoutTests/fast/css/sticky/sticky-both-sides.html
LayoutTests/fast/css/sticky/sticky-bottom-overflow-padding.html
LayoutTests/fast/css/sticky/sticky-left-percentage.html
LayoutTests/fast/css/sticky/sticky-left.html
LayoutTests/fast/css/sticky/sticky-margins.html
LayoutTests/fast/css/sticky/sticky-overflowing.html
LayoutTests/fast/css/sticky/sticky-side-margins.html
LayoutTests/fast/css/sticky/sticky-stacking-context-expected.html
LayoutTests/fast/css/sticky/sticky-stacking-context.html
LayoutTests/fast/css/sticky/sticky-table-row-top.html
LayoutTests/fast/css/sticky/sticky-table-thead-top.html
LayoutTests/fast/css/sticky/sticky-top-margins.html
LayoutTests/fast/css/sticky/sticky-top-overflow-container-overflow.html
LayoutTests/fast/css/sticky/sticky-top-overflow.html
LayoutTests/fast/css/sticky/sticky-top-zoomed-expected.html
LayoutTests/fast/css/sticky/sticky-top-zoomed.html
LayoutTests/fast/css/sticky/sticky-top.html
LayoutTests/fast/css/sticky/sticky-writing-mode-horizontal-bt.html
LayoutTests/fast/css/sticky/sticky-writing-mode-vertical-lr.html
LayoutTests/fast/css/sticky/sticky-writing-mode-vertical-rl.html
LayoutTests/fast/multicol/newmulticol/table-section-crash.html
LayoutTests/fast/scrolling/ios/reconcile-layer-position-recursive.html
LayoutTests/fast/scrolling/rtl-scrollbars-sticky-document-2.html
LayoutTests/fast/scrolling/rtl-scrollbars-sticky-document.html
LayoutTests/fast/scrolling/rtl-scrollbars-sticky-iframe-2.html
LayoutTests/fast/scrolling/rtl-scrollbars-sticky-iframe.html
LayoutTests/fast/scrolling/rtl-scrollbars-sticky-overflow-scroll-2.html
LayoutTests/fast/scrolling/rtl-scrollbars-sticky-overflow-scroll.html
LayoutTests/fast/scrolling/sticky-to-fixed.html
LayoutTests/legacy-animation-engine/fast/multicol/newmulticol/table-section-crash.html
LayoutTests/scrollingcoordinator/scrolling-tree/resources/doc-with-sticky.html
LayoutTests/svg/text/select-text-inside-non-static-position.html
LayoutTests/tiled-drawing/scrolling/sticky/negative-scroll-offset.html
LayoutTests/tiled-drawing/scrolling/sticky/sticky-horizontal.html
LayoutTests/tiled-drawing/scrolling/sticky/sticky-layers.html
LayoutTests/tiled-drawing/scrolling/sticky/sticky-vertical.html
Source/WebCore/ChangeLog
Source/WebCore/css/CSSPrimitiveValueMappings.h
Source/WebCore/css/CSSProperties.json
Source/WebCore/css/CSSValueKeywords.in
Source/WebCore/css/parser/CSSParserFastPaths.cpp
Source/WebCore/editing/EditingStyle.cpp
Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/UserInterface/Models/CSSKeywordCompletions.js
Source/WebInspectorUI/UserInterface/Views/AuditTestCaseContentView.css
Source/WebInspectorUI/UserInterface/Views/AuditTestGroupContentView.css
Source/WebInspectorUI/UserInterface/Views/ChangesDetailsSidebarPanel.css
Source/WebInspectorUI/UserInterface/Views/DetailsSection.css
Source/WebInspectorUI/UserInterface/Views/NetworkDetailView.css
Source/WebInspectorUI/UserInterface/Views/SettingsTabContentView.css
Source/WebInspectorUI/UserInterface/Views/Table.css

index 652664b..3684f83 100644 (file)
@@ -1,3 +1,63 @@
+2019-04-16  Devin Rousso  <drousso@apple.com>
+
+        Unprefix -webkit-sticky
+        https://bugs.webkit.org/show_bug.cgi?id=196962
+        <rdar://problem/40903458>
+
+        Reviewed by Simon Fraser.
+
+        * compositing/layer-creation/no-compositing-for-sticky.html:
+        * editing/pasteboard/copy-paste-converts-sticky.html:
+        * editing/pasteboard/copy-paste-converts-sticky-expected.txt:
+        * fast/block/positioning/fixed-container-with-sticky-parent.html:
+        * fast/block/sticky-position-containing-block-crash.html:
+        * fast/css/sticky/inflow-sticky.html:
+        * fast/css/sticky/inline-sticky-abspos-child.html:
+        * fast/css/sticky/inline-sticky.html:
+        * fast/css/sticky/multiple-layers-sticky-crash.html:
+        * fast/css/sticky/parsing-position-sticky-expected.txt:
+        * fast/css/sticky/remove-inline-sticky-crash.html:
+        * fast/css/sticky/remove-sticky-crash.html:
+        * fast/css/sticky/replaced-sticky.html:
+        * fast/css/sticky/resources/parsing-position-sticky.js:
+        * fast/css/sticky/sticky-as-positioning-container.html:
+        * fast/css/sticky/sticky-both-sides.html:
+        * fast/css/sticky/sticky-bottom-overflow-padding.html:
+        * fast/css/sticky/sticky-left-percentage.html:
+        * fast/css/sticky/sticky-left.html:
+        * fast/css/sticky/sticky-margins.html:
+        * fast/css/sticky/sticky-overflowing.html:
+        * fast/css/sticky/sticky-side-margins.html:
+        * fast/css/sticky/sticky-stacking-context.html:
+        * fast/css/sticky/sticky-stacking-context-expected.html:
+        * fast/css/sticky/sticky-table-row-top.html:
+        * fast/css/sticky/sticky-table-thead-top.html:
+        * fast/css/sticky/sticky-top-margins.html:
+        * fast/css/sticky/sticky-top-overflow-container-overflow.html:
+        * fast/css/sticky/sticky-top-overflow.html:
+        * fast/css/sticky/sticky-top-zoomed.html:
+        * fast/css/sticky/sticky-top-zoomed-expected.html:
+        * fast/css/sticky/sticky-top.html:
+        * fast/css/sticky/sticky-writing-mode-horizontal-bt.html:
+        * fast/css/sticky/sticky-writing-mode-vertical-lr.html:
+        * fast/css/sticky/sticky-writing-mode-vertical-rl.html:
+        * fast/multicol/newmulticol/table-section-crash.html:
+        * fast/scrolling/ios/reconcile-layer-position-recursive.html:
+        * fast/scrolling/rtl-scrollbars-sticky-document-2.html:
+        * fast/scrolling/rtl-scrollbars-sticky-document.html:
+        * fast/scrolling/rtl-scrollbars-sticky-iframe-2.html:
+        * fast/scrolling/rtl-scrollbars-sticky-iframe.html:
+        * fast/scrolling/rtl-scrollbars-sticky-overflow-scroll-2.html:
+        * fast/scrolling/rtl-scrollbars-sticky-overflow-scroll.html:
+        * fast/scrolling/sticky-to-fixed.html:
+        * legacy-animation-engine/fast/multicol/newmulticol/table-section-crash.html:
+        * scrollingcoordinator/scrolling-tree/resources/doc-with-sticky.html:
+        * svg/text/select-text-inside-non-static-position.html:
+        * tiled-drawing/scrolling/sticky/negative-scroll-offset.html:
+        * tiled-drawing/scrolling/sticky/sticky-horizontal.html:
+        * tiled-drawing/scrolling/sticky/sticky-layers.html:
+        * tiled-drawing/scrolling/sticky/sticky-vertical.html:
+
 2019-04-16  John Wilander  <wilander@apple.com>
 
         Increase timeout threshold in http/tests/adClickAttribution/send-attribution-conversion-request.html to address flakiness
index 44f46a4..198da37 100644 (file)
@@ -25,7 +25,7 @@
     }
     
     .sticky {
-      position: -webkit-sticky;
+      position: sticky;
       display: inline-block;
       background: silver;
       margin: 4px;
index 9e98c64..3c879be 100644 (file)
@@ -21,7 +21,7 @@ first test - before:
 |     "
 abc"
 |     <div>
-|       style="position: -webkit-sticky; left: 0px; top: 0px;"
+|       style="position: sticky; left: 0px; top: 0px;"
 |       "def"
 |     "ghi
 "
index d54b16d..6d7531e 100644 (file)
@@ -4,7 +4,7 @@
 <script type="text/javascript" src="../../resources/dump-as-markup.js"></script>
 </head>
 <body>
-abc<div style="position: -webkit-sticky; left: 0px; top: 0px;">def</div>ghi
+abc<div style="position: sticky; left: 0px; top: 0px;">def</div>ghi
 <br/>
 
 <script>
index effa958..f85ac9f 100644 (file)
@@ -8,10 +8,10 @@
 </script>
 </head>
 <body>
-<div style="position: -webkit-sticky; left: 50px; width: 20px; height: 20px; border: 1px solid green;">
+<div style="position: sticky; left: 50px; width: 20px; height: 20px; border: 1px solid green;">
   <div class=fixed style="width: 20px; height: 20px; background-color: green;"></div>
 </div>
-<div style="position: -webkit-sticky; left: 50px; width: 20px; height: 20px; margin: 5px; border: 1px solid green;">
+<div style="position: sticky; left: 50px; width: 20px; height: 20px; margin: 5px; border: 1px solid green;">
   <div class=fixed style="width: 20px; height: 20px; background-color: green;"></div>
 </div>
 
index cf05dc5..2decb20 100644 (file)
@@ -7,7 +7,7 @@ https://bugs.webkit.org/show_bug.cgi?id=105654
     <div>
       <i>
         <i>
-          <i style="position: -webkit-sticky; display: table-footer-group;">
+          <i style="position: sticky; display: table-footer-group;">
             <span></span>
           </i>
         </i>
index 3461efd..c25a988 100644 (file)
@@ -37,7 +37,7 @@
     }
     .sticky {
         background-color: green;
-        position: -webkit-sticky;
+        position: sticky;
         top: 300px;
     }
 </style>
index 59a9099..98a0f62 100644 (file)
@@ -34,7 +34,7 @@
         width: 200px;
         height: 200px;
         color: blue;
-        position: -webkit-sticky;
+        position: sticky;
         top: 100px;
     }
     
index 32c525f..81550ba 100644 (file)
@@ -34,7 +34,7 @@
         width: 200px;
         height: 200px;
         color: blue;
-        position: -webkit-sticky;
+        position: sticky;
         top: 100px;
     }
     
index 71c4be5..c9fc7ac 100644 (file)
@@ -12,7 +12,7 @@
     }
 
     div {
-      position: -webkit-sticky;
+      position: sticky;
     }
   </style>
 </head>
index cff779e..02da871 100644 (file)
@@ -1,10 +1,10 @@
-This tests checks that the -webkit-sticky value for position parses correctly.
+This tests checks that the sticky value for position parses correctly.
 
 On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
 
 
 PASS test("position: -webkit-sticky;") is "-webkit-sticky"
-PASS test("position: sticky;") is ""
+PASS test("position: sticky;") is "sticky"
 PASS successfullyParsed is true
 
 TEST COMPLETE
index 10950a3..c85c123 100644 (file)
@@ -14,7 +14,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 100px;
         background-color: green;
     }
index e00f138..071a054 100644 (file)
@@ -14,7 +14,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 100px;
         background-color: green;
     }
index 7951e93..34075c0 100644 (file)
@@ -29,7 +29,7 @@
     
     .sticky {
         background-color: silver;
-        position: -webkit-sticky;
+        position: sticky;
         top: 100px;
     }
     
index 29cf2b5..e04c3aa 100644 (file)
@@ -1,4 +1,4 @@
-description("This tests checks that the -webkit-sticky value for position parses correctly.");
+description("This tests checks that the sticky value for position parses correctly.");
 
 function test(value)
 {
@@ -12,4 +12,4 @@ function test(value)
 }
 
 shouldBe('test("position: -webkit-sticky;")', '"-webkit-sticky"');
-shouldBeEqualToString('test("position: sticky;")', '');
+shouldBe('test("position: sticky;")', '"sticky"');
index 972b82b..cac31e4 100644 (file)
@@ -28,7 +28,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 100px;
         background-color: silver;
     }
index 5a772d9..047820c 100644 (file)
@@ -35,7 +35,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         left: 50px;
         right: 50px;
         background-color: green;
index d0c97d7..86b90b2 100644 (file)
@@ -35,7 +35,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         bottom: 0px;
         background-color: green;
     }
index b03c493..8a21f55 100644 (file)
@@ -27,7 +27,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         /* DRT window is 800px wide */
         left: 12.5%;
         background-color: green;
index fdb4d84..b2537be 100644 (file)
@@ -27,7 +27,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         left: 100px;
         background-color: green;
     }
index 0dfb9c3..e11ebc5 100644 (file)
@@ -29,7 +29,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 10px;
         background-color: green;
     }
index 1bbdd96..89a6321 100644 (file)
@@ -46,7 +46,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 200px;
         right: 200px;
         background-color: green;
index d617550..7bb0d84 100644 (file)
@@ -27,7 +27,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         left: 100px;
         background-color: green;
     }
index 9c1cc98..f08c448 100644 (file)
@@ -19,7 +19,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
     }
     
     .child {
index d0ce938..6200fe1 100644 (file)
@@ -18,7 +18,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
     }
     
     .intermediate {
index 2a1c4ff..8913bcf 100644 (file)
@@ -35,7 +35,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 100px;
         background-color: green;
     }
index a6baa87..a545f1e 100644 (file)
@@ -35,7 +35,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 100px;
         background-color: green;
     }
index 76da84e..ed7cc48 100644 (file)
@@ -29,7 +29,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 10px;
         margin: 20px;
         background-color: green;
index c70ca29..ad2277b 100644 (file)
@@ -34,7 +34,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 100px;
         background-color: green;
     }
index cb451c0..d6eaf3e 100644 (file)
@@ -34,7 +34,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 100px;
         background-color: green;
     }
index ae761ac..e65ebcd 100644 (file)
@@ -32,7 +32,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 75px;
         background-color: green;
     }
index 5f30dd4..950a6ff 100644 (file)
@@ -32,7 +32,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 75px;
         background-color: green;
     }
index 76c91b8..947536d 100644 (file)
@@ -28,7 +28,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 100px;
         background-color: green;
     }
index a18ad14..88d3896 100644 (file)
@@ -30,7 +30,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         top: 100px;
         bottom: 100px;
         background-color: green;
index 79042fe..4b3eb4f 100644 (file)
@@ -29,7 +29,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         background-color: green;
         width: 100px;
         height: 100px;
index 5b041ab..52b516f 100644 (file)
@@ -29,7 +29,7 @@
     }
 
     .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         background-color: green;
         width: 100px;
         height: 100px;
index 7158c0d..159827d 100644 (file)
@@ -18,7 +18,7 @@
     head.appendChild(style);
     style = document.createElement("style");
     style.innerHTML = "* { \n\
-        position: -webkit-sticky;\n\
+        position: sticky;\n\
         -webkit-animation-direction: alternate-reverse;";
 
     head.appendChild(style);
index e1cdedb..beea64e 100644 (file)
@@ -19,7 +19,6 @@
          background: yellow;
       }
       .sticky {
-         position: -webkit-sticky;
          position: sticky;
          height: 100px;
          width: 100px;
index 21506ba..a5cb255 100644 (file)
@@ -11,7 +11,7 @@ if (window.internals) {
 <body style="margin: 0px;">
 This test makes sure that position-sticky obeys RTL scrollbars when positioning.
 <div style="position: absolute; top: 100px; left: 0px; width: 2000px; height: 2000px;">
-    <div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div><div style="display: inline-block; position: -webkit-sticky; left: 0px; right: 0px; width: 100px; height: 100px; background: green;"></div><div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div>
+    <div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div><div style="display: inline-block; position: sticky; left: 0px; right: 0px; width: 100px; height: 100px; background: green;"></div><div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div>
 </div>
 <script>
 window.scroll(850, 0);
index d394dfb..61e4eeb 100644 (file)
@@ -11,7 +11,7 @@ if (window.internals) {
 <body style="margin: 0px;">
 This test makes sure that position-sticky obeys RTL scrollbars when positioning.
 <div style="position: absolute; top: 100px; left: 0px; width: 2000px; height: 2000px;">
-    <div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div><div style="display: inline-block; position: -webkit-sticky; left: 0px; right: 0px; width: 100px; height: 100px; background: green;"></div><div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div>
+    <div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div><div style="display: inline-block; position: sticky; left: 0px; right: 0px; width: 100px; height: 100px; background: green;"></div><div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div>
 </div>
 </body>
 </html>
index 941575e..be1d958 100644 (file)
@@ -15,7 +15,7 @@ This test makes sure that position-sticky obeys RTL scrollbars when positioning.
 </head>
 <body>
 <div style='position: absolute; top: 0px; left: 0px; width: 2000px; height: 2000px'>
-    <div style='display: inline-block; position: static; width: 800px; height: 100px; background: blue;'></div><div style='display: inline-block; position: -webkit-sticky; left: 0px; right: 0px; width: 100px; height: 100px; background: green;'></div><div style='display: inline-block; position: static; width: 800px; height: 100px; background: blue;'></div>
+    <div style='display: inline-block; position: static; width: 800px; height: 100px; background: blue;'></div><div style='display: inline-block; position: sticky; left: 0px; right: 0px; width: 100px; height: 100px; background: green;'></div><div style='display: inline-block; position: static; width: 800px; height: 100px; background: blue;'></div>
 </div>
 <script>
 window.scroll(850, 0);
index ab76c37..401d00c 100644 (file)
@@ -15,7 +15,7 @@ This test makes sure that position-sticky obeys RTL scrollbars when positioning.
 </head>
 <body>
 <div style='position: absolute; top: 0px; left: 0px; width: 2000px; height: 2000px'>
-    <div style='display: inline-block; position: static; width: 800px; height: 100px; background: blue;'></div><div style='display: inline-block; position: -webkit-sticky; left: 0px; right: 0px; width: 100px; height: 100px; background: green;'></div><div style='display: inline-block; position: static; width: 800px; height: 100px; background: blue;'></div>
+    <div style='display: inline-block; position: static; width: 800px; height: 100px; background: blue;'></div><div style='display: inline-block; position: sticky; left: 0px; right: 0px; width: 100px; height: 100px; background: green;'></div><div style='display: inline-block; position: static; width: 800px; height: 100px; background: blue;'></div>
 </div>
 </body>
 </html">
index 63dea39..629808a 100644 (file)
@@ -12,7 +12,7 @@ if (window.internals) {
 This test makes sure that position-sticky obeys RTL scrollbars when positioning.
 <div id="scrolling" style="position: relative; width: 600px; height: 500px; overflow: scroll;">
 <div style="position: absolute; top: 0px; left: 0px; width: 2000px;">
-    <div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div><div style="display: inline-block; position: -webkit-sticky; left: 0px; right: 0px; width: 100px; height: 100px; background: green;"></div><div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div>
+    <div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div><div style="display: inline-block; position: sticky; left: 0px; right: 0px; width: 100px; height: 100px; background: green;"></div><div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div>
 </div>
 </div>
 <script>
index 40bd842..507af50 100644 (file)
@@ -12,7 +12,7 @@ if (window.internals) {
 This test makes sure that position-sticky obeys RTL scrollbars when positioning.
 <div style="position: relative; width: 600px; height: 500px; overflow: scroll;">
 <div style="position: absolute; top: 0px; left: 0px; width: 2000px;">
-    <div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div><div style="display: inline-block; position: -webkit-sticky; left: 0px; right: 0px; width: 100px; height: 100px; background: green;"></div><div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div>
+    <div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div><div style="display: inline-block; position: sticky; left: 0px; right: 0px; width: 100px; height: 100px; background: green;"></div><div style="display: inline-block; position: static; width: 800px; height: 100px; background: blue;"></div>
 </div>
 </div>
 </body>
index 9468d7c..9effbb8 100644 (file)
@@ -6,7 +6,7 @@ body {
     height: 2000px;
 }
 .masthead {
-    position: -webkit-sticky;
+    position: sticky;
     width: 200px;
     height: 100px;
     background-color: rgba(0, 0, 0, 0.2);
index 7158c0d..159827d 100644 (file)
@@ -18,7 +18,7 @@
     head.appendChild(style);
     style = document.createElement("style");
     style.innerHTML = "* { \n\
-        position: -webkit-sticky;\n\
+        position: sticky;\n\
         -webkit-animation-direction: alternate-reverse;";
 
     head.appendChild(style);
index 11a0712..9b4bc09 100644 (file)
@@ -23,7 +23,7 @@
             background-color: silver;
         }
         .sticky {
-            position: -webkit-sticky;
+            position: sticky;
             top: 10px;
             bottom: 10px;
         }
index 9288e1f..8f9a963 100644 (file)
@@ -3,7 +3,7 @@
 <head>
 <style>
 * {
-    position: -webkit-sticky;
+    position: sticky;
     -webkit-transform: scaleX(2);
 }
 </style>
index d4d09fa..f6864ff 100644 (file)
@@ -6,7 +6,7 @@
       }
 
       .sticky {
-        position: -webkit-sticky;
+        position: sticky;
         width: 100%;
         height: 50px;
         left: 0;
index 7030a34..b22a934 100644 (file)
@@ -24,7 +24,7 @@
     }
     
     .sticky {
-      position: -webkit-sticky;
+      position: sticky;
       display: inline-block;
       background: silver;
       margin: 4px;
index 66e6069..593423e 100644 (file)
@@ -24,7 +24,7 @@
     }
     
     .sticky {
-      position: -webkit-sticky;
+      position: sticky;
       display: inline-block;
       background: silver;
       margin: 4px;
index cdfd592..b08cf69 100644 (file)
@@ -19,7 +19,7 @@
     
     .sticky {
       float: left;
-      position: -webkit-sticky;
+      position: sticky;
       background: silver;
       margin: 5px;
       height: 300px;
index 2c6d036..9b18b3c 100644 (file)
@@ -1,3 +1,28 @@
+2019-04-16  Devin Rousso  <drousso@apple.com>
+
+        Unprefix -webkit-sticky
+        https://bugs.webkit.org/show_bug.cgi?id=196962
+        <rdar://problem/40903458>
+
+        Reviewed by Simon Fraser.
+
+        Updated existing tests.
+
+        This change doesn't modify functionality, only exposing a new unprefixed CSS value.
+
+        * css/CSSProperties.json:
+        * css/CSSValueKeywords.in:
+
+        * css/CSSPrimitiveValueMappings.h:
+        (WebCore::CSSPrimitiveValue::CSSPrimitiveValue):
+        (WebCore::CSSPrimitiveValue::operator PositionType const):
+
+        * css/parser/CSSParserFastPaths.cpp:
+        (WebCore::CSSParserFastPaths::isValidKeywordPropertyAndValue):
+
+        * editing/EditingStyle.cpp:
+        (WebCore::EditingStyle::convertPositionStyle):
+
 2019-04-16  Commit Queue  <commit-queue@webkit.org>
 
         Unreviewed, rolling out r244321.
index aa65f0d..24370cf 100644 (file)
@@ -2335,7 +2335,7 @@ template<> inline CSSPrimitiveValue::CSSPrimitiveValue(PositionType e)
         m_value.valueID = CSSValueFixed;
         break;
     case PositionType::Sticky:
-        m_value.valueID = CSSValueWebkitSticky;
+        m_value.valueID = CSSValueSticky;
         break;
     }
 }
@@ -2353,6 +2353,7 @@ template<> inline CSSPrimitiveValue::operator PositionType() const
         return PositionType::Absolute;
     case CSSValueFixed:
         return PositionType::Fixed;
+    case CSSValueSticky:
     case CSSValueWebkitSticky:
         return PositionType::Sticky;
     default:
index 0941d0e..a45a3d5 100644 (file)
                 "absolute",
                 "fixed",
                 {
-                    "value": "-webkit-sticky",
-                    "status": "experimental",
+                    "value": "sticky",
                     "url": "https://www.w3.org/TR/css-position-3/#valdef-position-sticky"
+                },
+                {
+                    "value": "-webkit-sticky",
+                    "status": "deprecated"
                 }
             ],
             "specification": {
index 2a83be4..c0cfdac 100644 (file)
@@ -1153,6 +1153,7 @@ edges
 alphabetic
 
 // position
+sticky
 -webkit-sticky
 
 // (pointer:) media feature
index 833a2b5..72c5867 100644 (file)
@@ -627,7 +627,11 @@ bool CSSParserFastPaths::isValidKeywordPropertyAndValue(CSSPropertyID propertyId
         // painted | fill | stroke | auto | all | bounding-box
         return valueID == CSSValueVisible || valueID == CSSValueNone || valueID == CSSValueAll || valueID == CSSValueAuto || (valueID >= CSSValueVisiblePainted && valueID <= CSSValueStroke);
     case CSSPropertyPosition: // static | relative | absolute | fixed | sticky
-        return valueID == CSSValueStatic || valueID == CSSValueRelative || valueID == CSSValueAbsolute || valueID == CSSValueFixed || valueID == CSSValueWebkitSticky;
+        return valueID == CSSValueStatic
+            || valueID == CSSValueRelative
+            || valueID == CSSValueAbsolute
+            || valueID == CSSValueFixed
+            || valueID == CSSValueSticky || valueID == CSSValueWebkitSticky;
     case CSSPropertyResize: // none | both | horizontal | vertical | auto
         return valueID == CSSValueNone || valueID == CSSValueBoth || valueID == CSSValueHorizontal || valueID == CSSValueVertical || valueID == CSSValueAuto;
     // FIXME-NEWPARSER: Investigate this property.
index c52dafd..692ee42 100644 (file)
@@ -1389,7 +1389,7 @@ bool EditingStyle::convertPositionStyle()
         return false;
 
     auto& cssValuePool = CSSValuePool::singleton();
-    RefPtr<CSSPrimitiveValue> sticky = cssValuePool.createIdentifierValue(CSSValueWebkitSticky);
+    RefPtr<CSSPrimitiveValue> sticky = cssValuePool.createIdentifierValue(CSSValueSticky);
     if (m_mutableStyle->propertyMatches(CSSPropertyPosition, sticky.get())) {
         m_mutableStyle->setProperty(CSSPropertyPosition, cssValuePool.createIdentifierValue(CSSValueStatic), m_mutableStyle->propertyIsImportant(CSSPropertyPosition));
         return false;
index 26f6727..7b0e4bd 100644 (file)
@@ -1,5 +1,31 @@
 2019-04-16  Devin Rousso  <drousso@apple.com>
 
+        Unprefix -webkit-sticky
+        https://bugs.webkit.org/show_bug.cgi?id=196962
+        <rdar://problem/40903458>
+
+        Reviewed by Simon Fraser.
+
+        Replace all `-webkit-sticky` with `sticky`.
+
+        * UserInterface/Models/CSSKeywordCompletions.js:
+        * UserInterface/Views/AuditTestCaseContentView.css:
+        (.content-view-container > .content-view.audit-test-case > header):
+        * UserInterface/Views/AuditTestGroupContentView.css:
+        (.content-view.audit-test-group.contains-test-case > header):
+        * UserInterface/Views/ChangesDetailsSidebarPanel.css:
+        (.changes-panel .resource-section > .header):
+        * UserInterface/Views/DetailsSection.css:
+        (.details-section > .header):
+        * UserInterface/Views/NetworkDetailView.css:
+        (.network-detail .navigation-bar):
+        * UserInterface/Views/SettingsTabContentView.css:
+        (.content-view.settings .navigation-bar):
+        * UserInterface/Views/Table.css:
+        (.table > .header):
+
+2019-04-16  Devin Rousso  <drousso@apple.com>
+
         Web Inspector: remove unused WI.DOMTreeDataGrid
         https://bugs.webkit.org/show_bug.cgi?id=196958
         <rdar://problem/49931383>
index 61a2777..6a364c6 100644 (file)
@@ -1132,7 +1132,7 @@ WI.CSSKeywordCompletions._propertyKeywordMap = {
         "none", "all", "auto", "visible", "visiblePainted", "visibleFill", "visibleStroke", "painted", "fill", "stroke",
     ],
     "position": [
-        "absolute", "fixed", "relative", "static", "-webkit-sticky",
+        "absolute", "fixed", "relative", "static", "sticky", "-webkit-sticky",
     ],
     "resize": [
         "none", "auto", "both", "horizontal", "vertical",
index 290f0ab..ea6ccdb 100644 (file)
@@ -24,7 +24,7 @@
  */
 
 .content-view-container > .content-view.audit-test-case > header {
-    position: -webkit-sticky;
+    position: sticky;
     top: -1px;
     z-index: var(--z-index-header);
     margin-top: -1px;
index c16d26a..356161c 100644 (file)
@@ -43,7 +43,7 @@
 }
 
 .content-view.audit-test-group.contains-test-case > header {
-    position: -webkit-sticky;
+    position: sticky;
     top: -1px;
     z-index: var(--z-index-header);
     background-color: var(--audit-test-header-background-color);
index afb5f3e..0a57b7f 100644 (file)
@@ -51,7 +51,7 @@
 }
 
 .changes-panel .resource-section > .header {
-    position: -webkit-sticky;
+    position: sticky;
     top: 0;
     z-index: var(--z-index-header);
     padding: 4px 8px;
index 99efee8..8bbb69b 100644 (file)
@@ -43,7 +43,7 @@
 }
 
 .details-section > .header {
-    position: -webkit-sticky;
+    position: sticky;
     top: -1px;
     height: 23px;
     padding: 4px 0;
index 4cc0f41..bea568f 100644 (file)
@@ -35,7 +35,7 @@
 }
 
 .network-detail .navigation-bar {
-    position: -webkit-sticky;
+    position: sticky;
     top: 0;
     z-index: 1;
 }
index d2425eb..c23f74e 100644 (file)
@@ -30,7 +30,7 @@
 }
 
 .content-view.settings .navigation-bar {
-    position: -webkit-sticky;
+    position: sticky;
     top: 0;
     z-index: 1;
     background-color: white;
index 8a9d0c5..93a29fa 100644 (file)
@@ -35,7 +35,7 @@
 }
 
 .table > .header {
-    position: -webkit-sticky;
+    position: sticky;
     top: 0;
     height: var(--navigation-bar-height);
     line-height: calc(var(--navigation-bar-height) - 1px);