Bug 1552578 - Restrict properties that apply to ::marker for now. r=mats draft
authorEmilio Cobos Álvarez <emilio@crisal.io>
Fri, 17 May 2019 21:30:29 +0200
changeset 2008481 e104cbadc98d9ac33cd44567205627dcc074a100
parent 2008480 d0119439a8505e9d3016cc41ff3ed0a9d08e3b2c
child 2008482 17463e3e8292e360ddaa79b697f7a185128512ac
child 2008928 7b6192c1ee9fb3df9a3f84f1d63d616e42937432
push id363917
push useremilio@crisal.io
push dateSat, 18 May 2019 06:31:42 +0000
treeherdertry@46e3df2f90da [default view] [failures only]
reviewersmats
bugs1552578
milestone68.0a1
Bug 1552578 - Restrict properties that apply to ::marker for now. r=mats I probably need to set the pref in a bunch of tests (and maybe enable it on Nightly?). But try is running so I know what to update, and those parts should be boring :) Differential Revision: https://phabricator.services.mozilla.com/D31680
layout/reftests/css-animations/reftest.list
layout/reftests/details-summary/details-absolute-children.html
layout/reftests/details-summary/details-display-inline.html
layout/reftests/details-summary/details-in-ol.html
layout/reftests/details-summary/details-page-break-after-1.html
layout/reftests/details-summary/details-page-break-after-2.html
layout/reftests/details-summary/details-page-break-before-1.html
layout/reftests/details-summary/details-page-break-before-2.html
layout/reftests/details-summary/details-percentage-height-children.html
layout/reftests/details-summary/details-three-columns.html
layout/reftests/details-summary/details-writing-mode.html
layout/reftests/details-summary/float-in-summary.html
layout/reftests/details-summary/mouse-click-overflow-auto-details.html
layout/reftests/details-summary/mouse-click-overflow-hidden-details.html
layout/reftests/details-summary/mouse-click-twice-overflow-auto-details.html
layout/reftests/details-summary/mouse-click-twice-overflow-hidden-details.html
layout/reftests/details-summary/overflow-auto-details.html
layout/reftests/details-summary/overflow-auto-open-details.html
layout/reftests/details-summary/overflow-hidden-details.html
layout/reftests/details-summary/overflow-hidden-open-details.html
layout/reftests/details-summary/overflow-scroll-details.html
layout/reftests/details-summary/summary-three-columns.html
layout/style/test/mochitest.ini
layout/style/test/property_database.js
layout/style/test/test_marker_restrictions.html
modules/libpref/init/StaticPrefList.h
servo/components/style/gecko/pseudo_element.rs
servo/components/style/properties/longhands/color.mako.rs
servo/components/style/properties/longhands/counters.mako.rs
servo/components/style/properties/longhands/font.mako.rs
servo/components/style/properties/longhands/inherited_box.mako.rs
servo/components/style/properties/longhands/inherited_text.mako.rs
servo/components/style/properties/longhands/text.mako.rs
servo/components/style/properties/properties.mako.rs
testing/web-platform/meta/css/css-animations/__dir__.ini
testing/web-platform/meta/css/css-pseudo/marker-content-007.html.ini
testing/web-platform/meta/css/css-pseudo/marker-content-008.html.ini
testing/web-platform/meta/css/css-pseudo/marker-content-009.html.ini
testing/web-platform/meta/css/css-pseudo/marker-content-011.html.ini
testing/web-platform/meta/css/css-transitions/__dir__.ini
testing/web-platform/meta/web-animations/__dir__.ini
--- a/layout/reftests/css-animations/reftest.list
+++ b/layout/reftests/css-animations/reftest.list
@@ -3,17 +3,17 @@
 fails == print-no-animations.html print-no-animations-ref.html # reftest harness doesn't actually make pres context non-dynamic for reftest-paged tests.
 fails != print-no-animations.html print-no-animations-notref.html # reftest harness doesn't actually make pres context non-dynamic for reftest-paged tests.
 == animate-opacity.html animate-opacity-ref.html
 == animate-preserves3d.html animate-preserves3d-ref.html
 == animation-initially-out-of-view-with-delay.html animation-initially-out-of-view-with-delay-ref.html
 == animation-on-empty-height-frame.html about:blank
 == in-visibility-hidden-animation.html in-visibility-hidden-animation-ref.html
 == in-visibility-hidden-animation-pseudo-element.html in-visibility-hidden-animation-pseudo-element-ref.html
-== in-visibility-hidden-animation-marker-pseudo-element.html in-visibility-hidden-animation-marker-pseudo-element-ref.html
+pref(layout.css.marker.restricted,false) == in-visibility-hidden-animation-marker-pseudo-element.html in-visibility-hidden-animation-marker-pseudo-element-ref.html
 == partially-out-of-view-animation.html partially-out-of-view-animation-ref.html
 == animate-display-table-opacity.html animate-display-table-opacity-ref.html
 # We need to run 100% opacity test case when OMTA is disabled to check that the animation creates a stacking context even if the animation is not running on the compositor
 test-pref(layers.offmainthreadcomposition.async-animations,false) == stacking-context-opacity-1-animation.html stacking-context-animation-ref.html
 # We need to run transform:none test case when OMTA is disabled to check that the animation creates a stacking context even if the animation is not running on the compositor
 test-pref(layers.offmainthreadcomposition.async-animations,false) == stacking-context-transform-none-animation.html stacking-context-animation-ref.html
 == no-stacking-context-opacity-removing-animation-in-delay.html no-stacking-context-animation-ref.html
 == no-stacking-context-transform-removing-animation-in-delay.html no-stacking-context-animation-ref.html
@@ -53,23 +53,23 @@ fails-if(layerChecksEnabled) == backgrou
 == mask-size-after-finish-1a.html mask-anim-ref.html
 == mask-size-after-finish-1b.html mask-anim-ref.html
 == mask-size-in-delay-1a.html mask-anim-ref.html
 == mask-size-in-delay-1b.html mask-anim-ref.html
 
 == stop-animation-on-discarded-pseudo-element.html about:blank
 
 == updating-animation-on-pseudo-element.html updating-animation-on-pseudo-element-ref.html
-== updating-animation-on-marker-pseudo-element.html updating-animation-on-marker-pseudo-element-ref.html
+pref(layout.css.marker.restricted,false) == updating-animation-on-marker-pseudo-element.html updating-animation-on-marker-pseudo-element-ref.html
 == content-on-pseudo-element-at-beginning.html content-on-pseudo-element-ref.html
 == content-on-pseudo-element-at-half.html content-on-pseudo-element-ref.html
-== content-on-marker-pseudo-element-at-beginning.html content-on-marker-pseudo-element-at-beginning-ref.html
-== content-on-marker-pseudo-element-at-half.html content-on-marker-pseudo-element-at-beginning-ref.html
+pref(layout.css.marker.restricted,false) == content-on-marker-pseudo-element-at-beginning.html content-on-marker-pseudo-element-at-beginning-ref.html
+pref(layout.css.marker.restricted,false) == content-on-marker-pseudo-element-at-half.html content-on-marker-pseudo-element-at-beginning-ref.html
 == reframe-and-animation-starts-at-the-same-time.html reframe-and-animation-starts-at-the-same-time-ref.html
-== marker-reframe-and-animation-starts-at-the-same-time.html marker-reframe-and-animation-starts-at-the-same-time-ref.html
+pref(layout.css.marker.restricted,false) == marker-reframe-and-animation-starts-at-the-same-time.html marker-reframe-and-animation-starts-at-the-same-time-ref.html
 == change-animation-name-to-none-in-rule.html change-animation-name-in-rule-ref.html
 == change-animation-name-to-other-in-rule.html change-animation-name-in-rule-ref.html
 == change-animation-name-to-non-existent-in-rule.html change-animation-name-in-rule-ref.html
 == no-style-sharing-with-animations.html no-style-sharing-with-animations-ref.html
 
 == continuation-opacity.html continuation-opacity-ref.html
 == ib-split-sibling-opacity.html about:blank
 
--- a/layout/reftests/details-summary/details-absolute-children.html
+++ b/layout/reftests/details-summary/details-absolute-children.html
@@ -4,21 +4,19 @@
 
 <html>
   <style>
   details {
     background-color: orange;
     width: 500px;
     height: 200px;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
-  }
-  summary {
     background-color: green;
     width: 50%;
   }
   div#in_summary {
     position: absolute;
     background-color: green;
     top: 60px;
     left: 100px;
--- a/layout/reftests/details-summary/details-display-inline.html
+++ b/layout/reftests/details-summary/details-display-inline.html
@@ -2,17 +2,17 @@
 <!-- Any copyright is dedicated to the Public Domain.
    - http://creativecommons.org/publicdomain/zero/1.0/ -->
 
 <html>
   <style>
   details {
     display: inline;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
   }
   </style>
   <body>
     Details element:
     <details open>
       <summary>Summary</summary>
--- a/layout/reftests/details-summary/details-in-ol.html
+++ b/layout/reftests/details-summary/details-in-ol.html
@@ -1,15 +1,15 @@
 <!DOCTYPE html>
 <!-- Any copyright is dedicated to the Public Domain.
    - http://creativecommons.org/publicdomain/zero/1.0/ -->
 
 <html>
   <style>
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
   }
   </style>
   <body>
     <!-- Test <ol> numbering is not affected by <details>. -->
     <ol>
       <li>First item
--- a/layout/reftests/details-summary/details-page-break-after-1.html
+++ b/layout/reftests/details-summary/details-page-break-after-1.html
@@ -1,15 +1,15 @@
 <!DOCTYPE html>
 <!-- Any copyright is dedicated to the Public Domain.
    - http://creativecommons.org/publicdomain/zero/1.0/ -->
 
 <html class="reftest-paged">
   <style>
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
   }
   </style>
   <body>
     <details open>
       <summary style="page-break-after: always;">Summary</summary>
       <p>This is the details.</p>
--- a/layout/reftests/details-summary/details-page-break-after-2.html
+++ b/layout/reftests/details-summary/details-page-break-after-2.html
@@ -1,15 +1,15 @@
 <!DOCTYPE html>
 <!-- Any copyright is dedicated to the Public Domain.
    - http://creativecommons.org/publicdomain/zero/1.0/ -->
 
 <html class="reftest-paged">
   <style>
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
   }
   </style>
   <body>
     <details open>
       <summary>Summary<div style="page-break-before: always;"></div></summary>
       <p>This is the details.</p>
--- a/layout/reftests/details-summary/details-page-break-before-1.html
+++ b/layout/reftests/details-summary/details-page-break-before-1.html
@@ -1,15 +1,15 @@
 <!DOCTYPE html>
 <!-- Any copyright is dedicated to the Public Domain.
    - http://creativecommons.org/publicdomain/zero/1.0/ -->
 
 <html class="reftest-paged">
   <style>
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
   }
   </style>
   <body>
     <details open>
       <summary>Summary</summary>
       <p style="page-break-before: always;">This is the details.</p>
--- a/layout/reftests/details-summary/details-page-break-before-2.html
+++ b/layout/reftests/details-summary/details-page-break-before-2.html
@@ -1,15 +1,15 @@
 <!DOCTYPE html>
 <!-- Any copyright is dedicated to the Public Domain.
    - http://creativecommons.org/publicdomain/zero/1.0/ -->
 
 <html class="reftest-paged">
   <style>
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
   }
   </style>
   <body>
     <details open>
       <summary>Summary<div style="page-break-before: always;"></div></summary>
       <p>This is the details.</p>
--- a/layout/reftests/details-summary/details-percentage-height-children.html
+++ b/layout/reftests/details-summary/details-percentage-height-children.html
@@ -4,17 +4,17 @@
 
 <html>
   <style>
   details {
     background-color: orange;
     width: 500px;
     height: 300px;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
   }
   summary {
     background-color: green;
     width: 50%;
     height: 40%;
   }
--- a/layout/reftests/details-summary/details-three-columns.html
+++ b/layout/reftests/details-summary/details-three-columns.html
@@ -6,17 +6,17 @@
   <style>
   details {
     -moz-column-count: 3;
     -moz-column-rule: 1px solid lightgray;
     -webkit-column-count: 3;
     -webkit-column-rule: 1px solid lightgray;
     border: 1px solid lightblue;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
   }
   summary {
     background-color: lightgreen;
   }
   </style>
   <body>
--- a/layout/reftests/details-summary/details-writing-mode.html
+++ b/layout/reftests/details-summary/details-writing-mode.html
@@ -4,17 +4,17 @@
 
 <html>
   <style>
   body {
     display: grid;
     grid-template-rows: auto;
     grid-template-columns: repeat(3, 150px);
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
   }
   details {
     border: 1px solid lightblue;
   }
   </style>
   <body>
--- a/layout/reftests/details-summary/float-in-summary.html
+++ b/layout/reftests/details-summary/float-in-summary.html
@@ -4,21 +4,19 @@
 
 <html>
   <style>
   details {
     background-color: orange;
     overflow: auto;
     width: 500px;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
-  }
-  summary {
     background-color: green;
     width: 400px;
   }
   h4 {
     background-color: cyan;
     width: 100px;
     height: 100px;
     float: right;
--- a/layout/reftests/details-summary/mouse-click-overflow-auto-details.html
+++ b/layout/reftests/details-summary/mouse-click-overflow-auto-details.html
@@ -5,17 +5,17 @@
 <html class="reftest-wait">
   <style>
   details {
     background-color: orange;
     overflow: auto;
     width: 300px;
     height: 200px;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
   }
   summary {
     background-color: green;
     overflow: auto;
     width: 200px;
     height: 100px;
--- a/layout/reftests/details-summary/mouse-click-overflow-hidden-details.html
+++ b/layout/reftests/details-summary/mouse-click-overflow-hidden-details.html
@@ -5,17 +5,17 @@
 <html class="reftest-wait">
   <style>
   details {
     background-color: orange;
     overflow: hidden;
     width: 300px;
     height: 200px;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
   }
   summary {
     background-color: green;
     overflow: hidden;
     width: 200px;
     height: 100px;
--- a/layout/reftests/details-summary/mouse-click-twice-overflow-auto-details.html
+++ b/layout/reftests/details-summary/mouse-click-twice-overflow-auto-details.html
@@ -5,21 +5,19 @@
 <html class="reftest-wait">
   <style>
   details {
     background-color: orange;
     overflow: auto;
     width: 300px;
     height: 200px;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
-  }
-  summary {
     background-color: green;
     overflow: auto;
     width: 200px;
     height: 100px;
   }
   </style>
   <script>
   function runTest() {
--- a/layout/reftests/details-summary/mouse-click-twice-overflow-hidden-details.html
+++ b/layout/reftests/details-summary/mouse-click-twice-overflow-hidden-details.html
@@ -5,21 +5,19 @@
 <html class="reftest-wait">
   <style>
   details {
     background-color: orange;
     overflow: hidden;
     width: 300px;
     height: 200px;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
-  }
-  summary {
     background-color: green;
     overflow: hidden;
     width: 200px;
     height: 100px;
   }
   </style>
   <script>
   function runTest() {
--- a/layout/reftests/details-summary/overflow-auto-details.html
+++ b/layout/reftests/details-summary/overflow-auto-details.html
@@ -5,21 +5,19 @@
 <html>
   <style>
   details {
     background-color: orange;
     overflow: auto;
     width: 300px;
     height: 200px;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
-  }
-  summary {
     background-color: green;
     overflow: auto;
     width: 200px;
     height: 100px;
   }
   </style>
   <body>
     <details>
--- a/layout/reftests/details-summary/overflow-auto-open-details.html
+++ b/layout/reftests/details-summary/overflow-auto-open-details.html
@@ -5,21 +5,19 @@
 <html>
   <style>
   details {
     background-color: orange;
     overflow: auto;
     width: 300px;
     height: 200px;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
-  }
-  summary {
     background-color: green;
     overflow: auto;
     width: 200px;
     height: 100px;
   }
   div.tall {
     background-color: blue;
     border: 1px dotted purple;
--- a/layout/reftests/details-summary/overflow-hidden-details.html
+++ b/layout/reftests/details-summary/overflow-hidden-details.html
@@ -5,21 +5,19 @@
 <html>
   <style>
   details {
     background-color: orange;
     overflow: hidden;
     width: 300px;
     height: 200px;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
-  }
-  summary {
     background-color: green;
     overflow: hidden;
     width: 200px;
     height: 100px;
   }
   </style>
   <body>
     <details>
--- a/layout/reftests/details-summary/overflow-hidden-open-details.html
+++ b/layout/reftests/details-summary/overflow-hidden-open-details.html
@@ -5,21 +5,19 @@
 <html>
   <style>
   details {
     background-color: orange;
     overflow: hidden;
     width: 300px;
     height: 200px;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
-  }
-  summary {
     background-color: green;
     overflow: hidden;
     width: 200px;
     height: 100px;
   }
   </style>
   <body>
     <details open>
--- a/layout/reftests/details-summary/overflow-scroll-details.html
+++ b/layout/reftests/details-summary/overflow-scroll-details.html
@@ -5,21 +5,19 @@
 <html>
   <style>
   details {
     background-color: orange;
     overflow: scroll;
     width: 300px;
     height: 200px;
   }
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
-  }
-  summary {
     background-color: green;
     width: 200px;
     height: 100px;
   }
   </style>
   <body>
     <details>
       <summary>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
--- a/layout/reftests/details-summary/summary-three-columns.html
+++ b/layout/reftests/details-summary/summary-three-columns.html
@@ -1,19 +1,17 @@
 <!DOCTYPE html>
 <!-- Any copyright is dedicated to the Public Domain.
    - http://creativecommons.org/publicdomain/zero/1.0/ -->
 
 <html>
   <style>
-  summary::marker {
+  summary {
     /* Hide the triangle for comparing with div in reftest. */
     list-style-type: none;
-  }
-  summary {
     -moz-column-count: 3;
     -moz-column-rule: 1px solid lightgray;
     -webkit-column-count: 3;
     -webkit-column-rule: 1px solid lightgray;
     border: 1px solid lightblue;
     background-color: lightgreen;
   }
   </style>
--- a/layout/style/test/mochitest.ini
+++ b/layout/style/test/mochitest.ini
@@ -376,13 +376,14 @@ skip-if = toolkit == 'android' # TIMED_O
 skip-if = toolkit == 'android' # TIMED_OUT for android
 [test_visited_reftests.html]
 skip-if = toolkit == 'android' # TIMED_OUT for android
 [test_webkit_appearance_basic.html]
 [test_webkit_device_pixel_ratio.html]
 [test_webkit_flex_display.html]
 [test_first_letter_restrictions.html]
 [test_first_line_restrictions.html]
+[test_marker_restrictions.html]
 [test_placeholder_restrictions.html]
 [test_mql_event_listener_leaks.html]
 [test_non_matching_sheet_media.html]
 [test_use_counters.html]
 skip-if = !nightly_build
--- a/layout/style/test/property_database.js
+++ b/layout/style/test/property_database.js
@@ -3504,16 +3504,17 @@ var gCSSProperties = {
     quirks_values: { "rect(1, 2, 3, 4)": "rect(1px, 2px, 3px, 4px)" },
   },
   "color": {
     domProp: "color",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     /* XXX should test currentColor, but may or may not be initial */
     initial_values: [ "black", "#000", "#000f", "#000000ff", "-moz-default-color", "rgb(0, 0, 0)", "rgb(0%, 0%, 0%)",
       /* css-color-4: */
       /* rgb() and rgba() are aliases of each other. */
       "rgb(0, 0, 0)", "rgba(0, 0, 0)", "rgb(0, 0, 0, 1)", "rgba(0, 0, 0, 1)",
       /* hsl() and hsla() are aliases of each other. */
       "hsl(0, 0%, 0%)", "hsla(0, 0%, 0%)", "hsl(0, 0%, 0%, 1)", "hsla(0, 0%, 0%, 1)",
@@ -3547,16 +3548,17 @@ var gCSSProperties = {
       "hsl(0 0% 0% /)", "hsl(0, 0%, 0% /)",
     ],
     quirks_values: { "000000": "#000000", "96ed2a": "#96ed2a", "fff": "#ffffff", "ffffff": "#ffffff", },
   },
   "content": {
     domProp: "content",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
+    applies_to_marker: true,
     /* XXX needs to be on pseudo-elements */
     initial_values: [ "normal", "none" ],
     other_values: [ '""', "''", '"hello"', "url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==)", "url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==')", 'url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAIAAAD8GO2jAAAAKElEQVR42u3NQQ0AAAgEoNP+nTWFDzcoQE1udQQCgUAgEAgEAsGTYAGjxAE/G/Q2tQAAAABJRU5ErkJggg==")', 'counter(foo)', 'counter(bar, upper-roman)', 'counters(foo, ".")', "counters(bar, '-', lower-greek)", "'-' counter(foo) '.'", "attr(title)", "open-quote", "close-quote", "no-open-quote", "no-close-quote", "close-quote attr(title) counters(foo, '.', upper-alpha)", "counter(foo, none)", "counters(bar, '.', none)", "attr(\\32)", "attr(\\2)", "attr(-\\2)", "attr(-\\32)", "counter(\\2)", "counters(\\32, '.')", "counter(-\\32, upper-roman)", "counters(-\\2, '-', lower-greek)", "counter(\\()", "counters(a\\+b, '.')", "counter(\\}, upper-alpha)", "-moz-alt-content", "counter(foo, symbols('*'))", "counter(foo, symbols(numeric '0' '1'))", "counters(foo, '.', symbols('*'))", "counters(foo, '.', symbols(numeric '0' '1'))" ],
     invalid_values: [ 'counters(foo)', 'counter(foo, ".")', 'attr("title")', "attr('title')", "attr(2)", "attr(-2)", "counter(2)", "counters(-2, '.')", "-moz-alt-content 'foo'", "'foo' -moz-alt-content", "counter(one, two, three) 'foo'" ]
   },
   "counter-increment": {
     domProp: "counterIncrement",
     inherited: false,
@@ -3602,16 +3604,17 @@ var gCSSProperties = {
       "url(foo.png) 3 2, url(bar.png) 7 9, pointer",
       "url(foo.png) calc(1 + 2) calc(3), pointer" ],
     invalid_values: [ "url(foo.png)", "url(foo.png) 5 5" ]
   },
   "direction": {
     domProp: "direction",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
+    applies_to_marker: true,
     initial_values: [ "ltr" ],
     other_values: [ "rtl" ],
     invalid_values: []
   },
   "display": {
     domProp: "display",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
@@ -3692,27 +3695,29 @@ var gCSSProperties = {
     ]
   },
   "font-family": {
     domProp: "fontFamily",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ (gInitialFontFamilyIsSansSerif ? "sans-serif" : "serif") ],
     other_values: [ (gInitialFontFamilyIsSansSerif ? "serif" : "sans-serif"), "Times New Roman, serif", "'Times New Roman', serif", "cursive", "fantasy", "\\\"Times New Roman", "\"Times New Roman\"", "Times, \\\"Times New Roman", "Times, \"Times New Roman\"", "-no-such-font-installed", "inherit roman", "roman inherit", "Times, inherit roman", "inherit roman, Times", "roman inherit, Times", "Times, roman inherit" ],
     invalid_values: [ "\"Times New\" Roman", "\"Times New Roman\n", "Times, \"Times New Roman\n" ]
   },
   "font-feature-settings": {
     domProp: "fontFeatureSettings",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "normal" ],
     other_values: [
       "'liga' on", "'liga'", "\"liga\" 1", "'liga', 'clig' 1",
       "\"liga\" off", "\"liga\" 0", '"cv01" 3, "cv02" 4',
       '"cswh", "smcp" off, "salt" 4', '"cswh" 1, "smcp" off, "salt" 4',
       '"cswh" 0, \'blah\', "liga", "smcp" off, "salt" 4',
       '"liga"        ,"smcp" 0         , "blah"',
@@ -3726,38 +3731,41 @@ var gCSSProperties = {
     ]
   },
   "font-kerning": {
     domProp: "fontKerning",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "auto" ],
     other_values: [ "normal", "none" ],
     invalid_values: [ "on" ]
   },
   "font-language-override": {
     domProp: "fontLanguageOverride",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "normal" ],
     other_values: [ "'ENG'", "'TRK'", "\"TRK\"", "'N\\'Ko'" ],
     invalid_values: [ "TRK", "ja" ]
   },
   "font-size": {
     domProp: "fontSize",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "medium",
       "1rem",
       "calc(1rem)",
       "calc(0.75rem + 200% - 125% + 0.25rem - 75%)"
     ],
     other_values: [ "large", "2em", "50%", "xx-small", "36pt", "8px", "larger", "smaller",
       "0px",
@@ -3772,49 +3780,53 @@ var gCSSProperties = {
     quirks_values: { "5": "5px" },
   },
   "font-size-adjust": {
     domProp: "fontSizeAdjust",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "none" ],
     other_values: [ "0.3", "0.5", "0.7", "0.0", "0", "3" ],
     invalid_values: [ "-0.3", "-1" ]
   },
   "font-stretch": {
     domProp: "fontStretch",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "normal" ],
     other_values: [ "ultra-condensed", "extra-condensed", "condensed", "semi-condensed", "semi-expanded", "expanded", "extra-expanded", "ultra-expanded" ],
     invalid_values: [ "narrower", "wider" ]
   },
   "font-style": {
     domProp: "fontStyle",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "normal" ],
     other_values: [ "italic", "oblique" ],
     invalid_values: []
   },
   "font-synthesis": {
     domProp: "fontSynthesis",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "weight style" ],
     other_values: [ "none", "weight", "style" ],
     invalid_values: [ "weight none", "style none", "none style", "weight 10px", "weight weight", "style style" ]
   },
   "font-variant": {
     domProp: "fontVariant",
     inherited: true,
@@ -3831,55 +3843,59 @@ var gCSSProperties = {
                       "historical-forms styleset(ok-alt-a, ok-alt-b) traditional styleset(potato)", "annotation(a,b,c)" ]
   },
   "font-variant-alternates": {
     domProp: "fontVariantAlternates",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "normal" ],
     other_values: [ "historical-forms",
                         "styleset(alt-a, alt-b)", "character-variant(a, b, c)", "annotation(circled)",
                         "swash(squishy)", "styleset(complex\\ blob, a)", "annotation(\\62 lah)" ],
     invalid_values: [ "historical-forms normal", "historical-forms historical-forms",
                           "swash", "swash(3)", "annotation(a, b)", "ornaments(a,b)",
                           "styleset(1234blah)", "annotation(a), annotation(b)", "annotation(a) normal" ]
   },
    "font-variant-caps": {
     domProp: "fontVariantCaps",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "normal" ],
     other_values: [ "small-caps", "all-small-caps", "petite-caps", "all-petite-caps", "titling-caps", "unicase" ],
     invalid_values: [ "normal small-caps", "petite-caps normal", "unicase unicase" ]
   },
   "font-variant-east-asian": {
     domProp: "fontVariantEastAsian",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "normal" ],
     other_values: [ "jis78", "jis83", "jis90", "jis04", "simplified", "traditional", "full-width", "proportional-width", "ruby",
                     "jis78 full-width", "jis78 full-width ruby", "simplified proportional-width", "ruby simplified" ],
     invalid_values: [ "jis78 normal", "jis90 jis04", "simplified traditional", "full-width proportional-width",
                           "ruby simplified ruby", "jis78 ruby simplified" ]
   },
   "font-variant-ligatures": {
     domProp: "fontVariantLigatures",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "normal" ],
     other_values: [ "none", "common-ligatures", "no-common-ligatures", "discretionary-ligatures", "no-discretionary-ligatures",
                     "historical-ligatures", "no-historical-ligatures", "contextual", "no-contextual",
                     "common-ligatures no-discretionary-ligatures", "contextual no-discretionary-ligatures",
                     "historical-ligatures no-common-ligatures", "no-historical-ligatures discretionary-ligatures",
                     "common-ligatures no-discretionary-ligatures historical-ligatures no-contextual" ],
     invalid_values: [ "common-ligatures normal", "common-ligatures no-common-ligatures", "common-ligatures common-ligatures",
@@ -3888,43 +3904,46 @@ var gCSSProperties = {
                       "common-ligatures none", "no-discretionary-ligatures none", "none common-ligatures" ]
   },
   "font-variant-numeric": {
     domProp: "fontVariantNumeric",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "normal" ],
     other_values: [ "lining-nums", "oldstyle-nums", "proportional-nums", "tabular-nums", "diagonal-fractions",
                     "stacked-fractions", "slashed-zero", "ordinal", "lining-nums diagonal-fractions",
                     "tabular-nums stacked-fractions", "tabular-nums slashed-zero stacked-fractions",
                     "proportional-nums slashed-zero diagonal-fractions oldstyle-nums ordinal" ],
     invalid_values: [ "lining-nums normal", "lining-nums oldstyle-nums", "lining-nums normal slashed-zero ordinal",
                       "proportional-nums tabular-nums", "diagonal-fractions stacked-fractions", "slashed-zero diagonal-fractions slashed-zero",
                       "lining-nums slashed-zero diagonal-fractions oldstyle-nums", "diagonal-fractions diagonal-fractions" ]
   },
   "font-variant-position": {
     domProp: "fontVariantPosition",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "normal" ],
     other_values: [ "super", "sub" ],
     invalid_values: [ "normal sub", "super sub" ]
   },
   "font-weight": {
     domProp: "fontWeight",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "normal", "400" ],
     other_values: [ "bold", "100", "200", "300", "500", "600", "700", "800",
                     "900", "bolder", "lighter", "10.5", "calc(10 + 10)",
                     "calc(10 - 99)", "100.0", "107", "399", "401", "699",
                     "710", "1000" ],
     invalid_values: [ "0", "1001", "calc(10%)" ]
   },
@@ -4696,16 +4715,17 @@ var gCSSProperties = {
     initial_values: [ "auto" ],
     other_values: [ "center", "justify", "start", "end", "left", "right" ],
     invalid_values: []
   },
   "text-combine-upright": {
     domProp: "textCombineUpright",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
+    applies_to_marker: true,
     initial_values: [ "none" ],
     other_values: [ "all" ],
     invalid_values: [ "auto", "all 2", "none all", "digits -3", "digits 0",
                       "digits 12", "none 3", "digits 3.1415", "digits3", "digits 1",
                       "digits 3 all", "digits foo", "digits all", "digits 3.0" ]
   },
   "text-decoration": {
     domProp: "textDecoration",
@@ -4916,16 +4936,17 @@ var gCSSProperties = {
     initial_values: [ "ease" ],
     other_values: [ "cubic-bezier(0.25, 0.1, 0.25, 1.0)", "linear", "ease-in", "ease-out", "ease-in-out", "linear, ease-in, cubic-bezier(0.1, 0.2, 0.8, 0.9)", "cubic-bezier(0.5, 0.5, 0.5, 0.5)", "cubic-bezier(0.25, 1.5, 0.75, -0.5)", "step-start", "step-end", "steps(1)", "steps(2, start)", "steps(386)", "steps(3, end)" ],
     invalid_values: [ "none", "auto", "cubic-bezier(0.25, 0.1, 0.25)", "cubic-bezier(0.25, 0.1, 0.25, 0.25, 1.0)", "cubic-bezier(-0.5, 0.5, 0.5, 0.5)", "cubic-bezier(1.5, 0.5, 0.5, 0.5)", "cubic-bezier(0.5, 0.5, -0.5, 0.5)", "cubic-bezier(0.5, 0.5, 1.5, 0.5)", "steps(2, step-end)", "steps(0)", "steps(-2)", "steps(0, step-end, 1)" ]
   },
   "unicode-bidi": {
     domProp: "unicodeBidi",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
+    applies_to_marker: true,
     initial_values: [ "normal" ],
     other_values: [ "embed", "bidi-override", "isolate", "plaintext", "isolate-override" ],
     invalid_values: [ "auto", "none", "-moz-isolate", "-moz-plaintext", "-moz-isolate-override" ]
   },
   "vertical-align": {
     domProp: "verticalAlign",
     inherited: false,
     type: CSS_TYPE_LONGHAND,
@@ -6130,26 +6151,28 @@ var gCSSProperties = {
     subproperties: [ "animation-timing-function" ],
   },
   "-moz-font-feature-settings": {
     domProp: "MozFontFeatureSettings",
     inherited: true,
     type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     alias_for: "font-feature-settings",
     subproperties: [ "font-feature-settings" ],
   },
   "-moz-font-language-override": {
     domProp: "MozFontLanguageOverride",
     inherited: true,
     type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     alias_for: "font-language-override",
     subproperties: [ "font-language-override" ],
   },
   "-moz-hyphens": {
     domProp: "MozHyphens",
     inherited: true,
     type: CSS_TYPE_SHORTHAND_AND_LONGHAND,
@@ -6874,16 +6897,17 @@ if (IsCSSPropertyPrefEnabled("layout.css
 
 if (IsCSSPropertyPrefEnabled("layout.css.font-variations.enabled")) {
   gCSSProperties["font-variation-settings"] = {
     domProp: "fontVariationSettings",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "normal" ],
     other_values: [
       "'wdth' 0", "'wdth' -.1", "\"wdth\" 1", "'wdth' 2, 'wght' 3", "\"XXXX\" 0"
     ],
     invalid_values: [
       "wdth", "wdth 1", // unquoted tags
       "'wdth'", "'wdth' 'wght'", "'wdth', 'wght'", // missing values
@@ -6900,16 +6924,17 @@ if (IsCSSPropertyPrefEnabled("layout.css
   };
   gCSSProperties["font"].subproperties.push("font-variation-settings");
   gCSSProperties["font-optical-sizing"] = {
     domProp: "fontOpticalSizing",
     inherited: true,
     type: CSS_TYPE_LONGHAND,
     applies_to_first_letter: true,
     applies_to_first_line: true,
+    applies_to_marker: true,
     applies_to_placeholder: true,
     initial_values: [ "auto" ],
     other_values: [ "none" ],
     invalid_values: [ "on" ]
   };
   gCSSProperties["font"].subproperties.push("font-optical-sizing");
   gCSSProperties["font-variation-settings"].other_values
     .push("'vert' calc(2.5)");
new file mode 100644
--- /dev/null
+++ b/layout/style/test/test_marker_restrictions.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>Test for ::marker property restrictions.</title>
+<script src="/tests/SimpleTest/SimpleTest.js"></script>
+<script src="property_database.js"></script>
+<link rel="stylesheet" href="/tests/SimpleTest/test.css"/>
+<style id="s"></style>
+<div id="test"></div>
+<div id="control"></div>
+<script>
+const test = getComputedStyle($("test"), "::marker");
+const control = getComputedStyle($("control"), "::marker");
+
+for (const prop in gCSSProperties) {
+  const info = gCSSProperties[prop];
+  if (info.type == CSS_TYPE_TRUE_SHORTHAND)
+    continue;
+
+  let prereqs = "";
+  if (info.prerequisites)
+    for (let name in info.prerequisites)
+      prereqs += `${name}: ${info.prerequisites[name]}; `;
+
+  $("s").textContent = `
+    #control::marker { ${prop}: ${info.initial_values[0]}; ${prereqs} }
+    #test::marker { ${prop}: ${info.other_values[0]}; ${prereqs} }
+  `;
+
+  (info.applies_to_marker ? isnot : is)(
+    get_computed_value(test, prop),
+    get_computed_value(control, prop),
+    `${prop} should ${info.applies_to_marker ? "" : " not"} apply to ::marker`);
+}
+
+</script>
--- a/modules/libpref/init/StaticPrefList.h
+++ b/modules/libpref/init/StaticPrefList.h
@@ -1180,16 +1180,26 @@ VARCACHE_PREF(
 
 // Pref to control whether line-height: -moz-block-height is exposed to content.
 VARCACHE_PREF(
   "layout.css.line-height-moz-block-height.content.enabled",
    layout_css_line_height_moz_block_height_content_enabled,
   bool, false
 )
 
+// Pref to control whether the ::marker property restrictions defined in [1]
+// apply.
+//
+// [1]: https://drafts.csswg.org/css-pseudo-4/#selectordef-marker
+VARCACHE_PREF(
+  "layout.css.marker.restricted",
+   layout_css_marker_restricted,
+  bool, true
+)
+
 // Is support for variation fonts enabled?
 VARCACHE_PREF(
   "layout.css.font-variations.enabled",
    layout_css_font_variations_enabled,
   RelaxedAtomicBool, true
 )
 
 // Are we emulating -moz-{inline}-box layout using CSS flexbox?
--- a/servo/components/style/gecko/pseudo_element.rs
+++ b/servo/components/style/gecko/pseudo_element.rs
@@ -171,22 +171,27 @@ impl PseudoElement {
     #[inline]
     pub fn is_precomputed(&self) -> bool {
         self.is_anon_box() && !self.is_tree_pseudo_element()
     }
 
     /// Property flag that properties must have to apply to this pseudo-element.
     #[inline]
     pub fn property_restriction(&self) -> Option<PropertyFlags> {
-        match *self {
-            PseudoElement::FirstLetter => Some(PropertyFlags::APPLIES_TO_FIRST_LETTER),
-            PseudoElement::FirstLine => Some(PropertyFlags::APPLIES_TO_FIRST_LINE),
-            PseudoElement::Placeholder => Some(PropertyFlags::APPLIES_TO_PLACEHOLDER),
-            _ => None,
-        }
+        Some(match *self {
+            PseudoElement::FirstLetter => PropertyFlags::APPLIES_TO_FIRST_LETTER,
+            PseudoElement::FirstLine => PropertyFlags::APPLIES_TO_FIRST_LINE,
+            PseudoElement::Placeholder => PropertyFlags::APPLIES_TO_PLACEHOLDER,
+            PseudoElement::Marker
+                if unsafe { structs::StaticPrefs_sVarCache_layout_css_marker_restricted } =>
+            {
+                PropertyFlags::APPLIES_TO_MARKER
+            },
+            _ => return None,
+        })
     }
 
     /// Whether this pseudo-element should actually exist if it has
     /// the given styles.
     pub fn should_exist(&self, style: &ComputedValues) -> bool {
         debug_assert!(self.is_eager());
 
         if style.get_box().clone_display() == Display::None {
--- a/servo/components/style/properties/longhands/color.mako.rs
+++ b/servo/components/style/properties/longhands/color.mako.rs
@@ -8,17 +8,17 @@
 
 <% from data import to_rust_ident %>
 
 ${helpers.predefined_type(
     "color",
     "ColorPropertyValue",
     "::cssparser::RGBA::new(0, 0, 0, 255)",
     animation_value_type="AnimatedRGBA",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     ignored_when_colors_disabled="True",
     spec="https://drafts.csswg.org/css-color/#color",
 )}
 
 // FIXME(#15973): Add servo support for system colors
 //
 // FIXME(emilio): Move outside of mako.
 % if product == "gecko":
--- a/servo/components/style/properties/longhands/counters.mako.rs
+++ b/servo/components/style/properties/longhands/counters.mako.rs
@@ -8,16 +8,17 @@
 
 ${helpers.predefined_type(
     "content",
     "Content",
     "computed::Content::normal()",
     initial_specified_value="specified::Content::normal()",
     animation_value_type="discrete",
     spec="https://drafts.csswg.org/css-content/#propdef-content",
+    flags="APPLIES_TO_MARKER",
     servo_restyle_damage="rebuild_and_reflow",
 )}
 
 ${helpers.predefined_type(
     "counter-increment",
     "CounterIncrement",
     initial_value="Default::default()",
     animation_value_type="discrete",
--- a/servo/components/style/properties/longhands/font.mako.rs
+++ b/servo/components/style/properties/longhands/font.mako.rs
@@ -7,28 +7,28 @@
 
 <% data.new_style_struct("Font", inherited=True) %>
 
 ${helpers.predefined_type(
     "font-family",
     "FontFamily",
     initial_value="computed::FontFamily::serif()",
     animation_value_type="discrete",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-family",
     servo_restyle_damage="rebuild_and_reflow",
 )}
 
 ${helpers.predefined_type(
     "font-style",
     "FontStyle",
     initial_value="computed::FontStyle::normal()",
     initial_specified_value="specified::FontStyle::normal()",
     animation_value_type="FontStyle",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-style",
     servo_restyle_damage="rebuild_and_reflow",
 )}
 
 <% font_variant_caps_custom_consts= { "small-caps": "SMALLCAPS",
                                       "all-small-caps": "ALLSMALL",
                                       "petite-caps": "PETITECAPS",
                                       "all-petite-caps": "ALLPETITE",
@@ -37,151 +37,151 @@
 ${helpers.single_keyword_system(
     "font-variant-caps",
     "normal small-caps",
     extra_gecko_values="all-small-caps petite-caps all-petite-caps unicase titling-caps",
     gecko_constant_prefix="NS_FONT_VARIANT_CAPS",
     gecko_ffi_name="mFont.variantCaps",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-variant-caps",
     custom_consts=font_variant_caps_custom_consts,
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     animation_value_type="discrete",
     servo_restyle_damage="rebuild_and_reflow",
 )}
 
 ${helpers.predefined_type(
     "font-weight",
     "FontWeight",
     initial_value="computed::FontWeight::normal()",
     initial_specified_value="specified::FontWeight::normal()",
     animation_value_type="Number",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-weight",
     servo_restyle_damage="rebuild_and_reflow",
 )}
 
 ${helpers.predefined_type(
     "font-size",
     "FontSize",
     initial_value="computed::FontSize::medium()",
     initial_specified_value="specified::FontSize::medium()",
     animation_value_type="NonNegativeLength",
     allow_quirks=True,
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-size",
     servo_restyle_damage="rebuild_and_reflow",
 )}
 
 ${helpers.predefined_type(
     "font-size-adjust",
     "FontSizeAdjust",
     products="gecko",
     initial_value="computed::FontSizeAdjust::none()",
     initial_specified_value="specified::FontSizeAdjust::none()",
     animation_value_type="ComputedValue",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-size-adjust",
 )}
 
 ${helpers.predefined_type(
     "font-synthesis",
     "FontSynthesis",
     products="gecko",
     initial_value="specified::FontSynthesis::get_initial_value()",
     animation_value_type="discrete",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-synthesis",
 )}
 
 ${helpers.predefined_type(
     "font-stretch",
     "FontStretch",
     initial_value="computed::FontStretch::hundred()",
     initial_specified_value="specified::FontStretch::normal()",
     animation_value_type="Percentage",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-stretch",
     servo_restyle_damage="rebuild_and_reflow",
 )}
 
 ${helpers.single_keyword_system(
     "font-kerning",
     "auto none normal",
     products="gecko",
     gecko_ffi_name="mFont.kerning",
     gecko_constant_prefix="NS_FONT_KERNING",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-kerning",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     animation_value_type="discrete",
 )}
 
 ${helpers.predefined_type(
     "font-variant-alternates",
     "FontVariantAlternates",
     products="gecko",
     initial_value="computed::FontVariantAlternates::get_initial_value()",
     initial_specified_value="specified::FontVariantAlternates::get_initial_specified_value()",
     animation_value_type="discrete",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-variant-alternates",
 )}
 
 ${helpers.predefined_type(
     "font-variant-east-asian",
     "FontVariantEastAsian",
     products="gecko",
     initial_value="computed::FontVariantEastAsian::empty()",
     initial_specified_value="specified::FontVariantEastAsian::empty()",
     animation_value_type="discrete",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-variant-east-asian",
 )}
 
 ${helpers.predefined_type(
     "font-variant-ligatures",
     "FontVariantLigatures",
     products="gecko",
     initial_value="computed::FontVariantLigatures::empty()",
     initial_specified_value="specified::FontVariantLigatures::empty()",
     animation_value_type="discrete",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-variant-ligatures",
 )}
 
 ${helpers.predefined_type(
     "font-variant-numeric",
     "FontVariantNumeric",
     products="gecko",
     initial_value="computed::FontVariantNumeric::empty()",
     initial_specified_value="specified::FontVariantNumeric::empty()",
     animation_value_type="discrete",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-variant-numeric",
 )}
 
 ${helpers.single_keyword_system(
     "font-variant-position",
     "normal sub super",
     products="gecko",
     gecko_ffi_name="mFont.variantPosition",
     gecko_constant_prefix="NS_FONT_VARIANT_POSITION",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-variant-position",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     animation_value_type="discrete",
 )}
 
 ${helpers.predefined_type(
     "font-feature-settings",
     "FontFeatureSettings",
     products="gecko",
     initial_value="computed::FontFeatureSettings::normal()",
     initial_specified_value="specified::FontFeatureSettings::normal()",
     extra_prefixes="moz:layout.css.prefixes.font-features",
     animation_value_type="discrete",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-fonts/#propdef-font-feature-settings",
 )}
 
 <%
 # This spec link is too long to fit elsewhere
 variation_spec = """\
 https://drafts.csswg.org/css-fonts-4/#low-level-font-variation-settings-control-the-font-variation-settings-property\
 """
@@ -190,41 +190,41 @@ https://drafts.csswg.org/css-fonts-4/#lo
 ${helpers.predefined_type(
     "font-variation-settings",
     "FontVariationSettings",
     products="gecko",
     gecko_pref="layout.css.font-variations.enabled",
     initial_value="computed::FontVariationSettings::normal()",
     initial_specified_value="specified::FontVariationSettings::normal()",
     animation_value_type="ComputedValue",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="${variation_spec}",
 )}
 
 ${helpers.predefined_type(
     "font-language-override",
     "FontLanguageOverride",
     products="gecko",
     initial_value="computed::FontLanguageOverride::zero()",
     initial_specified_value="specified::FontLanguageOverride::normal()",
     animation_value_type="discrete",
     extra_prefixes="moz:layout.css.prefixes.font-features",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-fonts-3/#propdef-font-language-override",
 )}
 
 ${helpers.single_keyword_system(
     "font-optical-sizing",
     "auto none",
     products="gecko",
     gecko_pref="layout.css.font-variations.enabled",
     gecko_ffi_name="mFont.opticalSizing",
     gecko_constant_prefix="NS_FONT_OPTICAL_SIZING",
     animation_value_type="discrete",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     spec="https://www.w3.org/TR/css-fonts-4/#font-optical-sizing-def",
 )}
 
 ${helpers.predefined_type(
     "-x-lang",
     "XLang",
     products="gecko",
     initial_value="computed::XLang::get_initial_value()",
@@ -509,17 +509,17 @@ https://drafts.csswg.org/css-fonts-4/#lo
 ${helpers.single_keyword(
     "-moz-osx-font-smoothing",
     "auto grayscale",
     gecko_constant_prefix="NS_FONT_SMOOTHING",
     gecko_ffi_name="mFont.smoothing",
     gecko_pref="layout.css.osx-font-smoothing.enabled",
     products="gecko",
     spec="Nonstandard (https://developer.mozilla.org/en-US/docs/Web/CSS/font-smooth)",
-    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER",
+    flags="APPLIES_TO_FIRST_LETTER APPLIES_TO_FIRST_LINE APPLIES_TO_PLACEHOLDER APPLIES_TO_MARKER",
     animation_value_type="discrete",
 )}
 
 ${helpers.predefined_type(
     "-moz-font-smoothing-background-color",
     "color::MozFontSmoothingBackgroundColor",
     "computed::color::MozFontSmoothingBackgroundColor::transparent()",
     animation_value_type="none",
--- a/servo/components/style/properties/longhands/inherited_box.mako.rs
+++ b/servo/components/style/properties/longhands/inherited_box.mako.rs
@@ -32,16 +32,17 @@
 )}
 
 ${helpers.single_keyword(
     "direction",
     "ltr rtl",
     animation_value_type="none",
     spec="https://drafts.csswg.org/css-writing-modes/#propdef-direction",
     needs_conversion=True,
+    flags="APPLIES_TO_MARKER",
     servo_restyle_damage="rebuild_and_reflow",
 )}
 
 ${helpers.single_keyword(
     "text-orientation",
     "mixed upright sideways",
     extra_gecko_aliases="sideways-right=sideways",
     products="gecko",
--- a/servo/components/style/properties/longhands/inherited_text.mako.rs
+++ b/servo/components/style/properties/longhands/inherited_text.mako.rs
@@ -325,16 +325,17 @@
 // CSS Writing Modes Module Level 3
 // https://drafts.csswg.org/css-writing-modes-3/
 
 ${helpers.single_keyword(
     "text-combine-upright",
     "none all",
     products="gecko",
     animation_value_type="discrete",
+    flags="APPLIES_TO_MARKER",
     spec="https://drafts.csswg.org/css-writing-modes-3/#text-combine-upright",
 )}
 
 // SVG 1.1: Section 11 - Painting: Filling, Stroking and Marker Symbols
 ${helpers.single_keyword(
     "text-rendering",
     "auto optimizespeed optimizelegibility geometricprecision",
     gecko_enum_prefix="StyleTextRendering",
--- a/servo/components/style/properties/longhands/text.mako.rs
+++ b/servo/components/style/properties/longhands/text.mako.rs
@@ -18,16 +18,17 @@
     servo_restyle_damage="rebuild_and_reflow",
 )}
 
 ${helpers.single_keyword(
     "unicode-bidi",
     "normal embed isolate bidi-override isolate-override plaintext",
     animation_value_type="none",
     spec="https://drafts.csswg.org/css-writing-modes/#propdef-unicode-bidi",
+    flags="APPLIES_TO_MARKER",
     servo_restyle_damage="rebuild_and_reflow",
 )}
 
 ${helpers.predefined_type(
     "text-decoration-line",
     "TextDecorationLine",
     "specified::TextDecorationLine::none()",
     initial_specified_value="specified::TextDecorationLine::none()",
--- a/servo/components/style/properties/properties.mako.rs
+++ b/servo/components/style/properties/properties.mako.rs
@@ -934,38 +934,40 @@ impl CSSWideKeyword {
         };
         input.expect_exhausted().map_err(|_| ())?;
         Ok(keyword)
     }
 }
 
 bitflags! {
     /// A set of flags for properties.
-    pub struct PropertyFlags: u8 {
+    pub struct PropertyFlags: u16 {
         /// This property requires a stacking context.
         const CREATES_STACKING_CONTEXT = 1 << 0;
         /// This property has values that can establish a containing block for
         /// fixed positioned and absolutely positioned elements.
         const FIXPOS_CB = 1 << 1;
         /// This property has values that can establish a containing block for
         /// absolutely positioned elements.
         const ABSPOS_CB = 1 << 2;
         /// This longhand property applies to ::first-letter.
         const APPLIES_TO_FIRST_LETTER = 1 << 3;
         /// This longhand property applies to ::first-line.
         const APPLIES_TO_FIRST_LINE = 1 << 4;
         /// This longhand property applies to ::placeholder.
         const APPLIES_TO_PLACEHOLDER = 1 << 5;
+        /// This longhand property applies to ::marker.
+        const APPLIES_TO_MARKER = 1 << 6;
         /// This property's getComputedStyle implementation requires layout
         /// to be flushed.
-        const GETCS_NEEDS_LAYOUT_FLUSH = 1 << 6;
+        const GETCS_NEEDS_LAYOUT_FLUSH = 1 << 7;
         /// This property is a legacy shorthand.
         ///
         /// https://drafts.csswg.org/css-cascade/#legacy-shorthand
-        const IS_LEGACY_SHORTHAND = 1 << 7;
+        const IS_LEGACY_SHORTHAND = 1 << 8;
 
         /* The following flags are currently not used in Rust code, they
          * only need to be listed in corresponding properties so that
          * they can be checked in the C++ side via ServoCSSPropList.h. */
         /// This property can be animated on the compositor.
         const CAN_ANIMATE_ON_COMPOSITOR = 0;
         /// This shorthand property is accessible from getComputedStyle.
         const SHORTHAND_IN_GETCS = 0;
@@ -1179,17 +1181,17 @@ impl LonghandId {
         LOGICAL_GROUPS[*self as usize]
     }
 
     /// Returns PropertyFlags for given longhand property.
     #[inline(always)]
     pub fn flags(self) -> PropertyFlags {
         // TODO(emilio): This can be simplified further as Rust gains more
         // constant expression support.
-        const FLAGS: [u8; ${len(data.longhands)}] = [
+        const FLAGS: [u16; ${len(data.longhands)}] = [
             % for property in data.longhands:
                 % for flag in property.flags:
                     PropertyFlags::${flag}.bits |
                 % endfor
                 0,
             % endfor
         ];
         PropertyFlags::from_bits_truncate(FLAGS[self as usize])
@@ -1441,17 +1443,17 @@ impl ShorthandId {
         }
 
         None
     }
 
     /// Returns PropertyFlags for the given shorthand property.
     #[inline]
     pub fn flags(self) -> PropertyFlags {
-        const FLAGS: [u8; ${len(data.shorthands)}] = [
+        const FLAGS: [u16; ${len(data.shorthands)}] = [
             % for property in data.shorthands:
                 % for flag in property.flags:
                     PropertyFlags::${flag}.bits |
                 % endfor
                 0,
             % endfor
         ];
         PropertyFlags::from_bits_truncate(FLAGS[self as usize])
--- a/testing/web-platform/meta/css/css-animations/__dir__.ini
+++ b/testing/web-platform/meta/css/css-animations/__dir__.ini
@@ -1,1 +1,1 @@
-prefs: [dom.animations-api.compositing.enabled:true, dom.animations-api.core.enabled:true, dom.animations-api.getAnimations.enabled:true, dom.animations-api.implicit-keyframes.enabled:true, dom.animations-api.timelines.enabled:true, layout.css.step-position-jump.enabled:true]
+prefs: [dom.animations-api.compositing.enabled:true, dom.animations-api.core.enabled:true, dom.animations-api.getAnimations.enabled:true, dom.animations-api.implicit-keyframes.enabled:true, dom.animations-api.timelines.enabled:true, layout.css.step-position-jump.enabled:true, layout.css.marker.restricted:false]
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/meta/css/css-pseudo/marker-content-007.html.ini
@@ -0,0 +1,2 @@
+[marker-content-007.html]
+  prefs: [layout.css.marker.restricted:false]
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/meta/css/css-pseudo/marker-content-008.html.ini
@@ -0,0 +1,2 @@
+[marker-content-008.html]
+  prefs: [layout.css.marker.restricted:false]
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/meta/css/css-pseudo/marker-content-009.html.ini
@@ -0,0 +1,2 @@
+[marker-content-009.html]
+  prefs: [layout.css.marker.restricted:false]
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/meta/css/css-pseudo/marker-content-011.html.ini
@@ -0,0 +1,2 @@
+[marker-content-011.html]
+  prefs: [layout.css.marker.restricted:false]
--- a/testing/web-platform/meta/css/css-transitions/__dir__.ini
+++ b/testing/web-platform/meta/css/css-transitions/__dir__.ini
@@ -1,1 +1,1 @@
-prefs: [dom.animations-api.compositing.enabled:true, dom.animations-api.core.enabled:true, dom.animations-api.getAnimations.enabled:true, dom.animations-api.implicit-keyframes.enabled:true, dom.animations-api.timelines.enabled:true, layout.css.step-position-jump.enabled:true]
+prefs: [dom.animations-api.compositing.enabled:true, dom.animations-api.core.enabled:true, dom.animations-api.getAnimations.enabled:true, dom.animations-api.implicit-keyframes.enabled:true, dom.animations-api.timelines.enabled:true, layout.css.step-position-jump.enabled:true, layout.css.marker.restricted:false]
--- a/testing/web-platform/meta/web-animations/__dir__.ini
+++ b/testing/web-platform/meta/web-animations/__dir__.ini
@@ -1,1 +1,1 @@
-prefs: [dom.animations-api.compositing.enabled:true, dom.animations-api.core.enabled:true, dom.animations-api.getAnimations.enabled:true, dom.animations-api.implicit-keyframes.enabled:true, dom.animations-api.timelines.enabled:true, layout.css.step-position-jump.enabled:true]
+prefs: [dom.animations-api.compositing.enabled:true, dom.animations-api.core.enabled:true, dom.animations-api.getAnimations.enabled:true, dom.animations-api.implicit-keyframes.enabled:true, dom.animations-api.timelines.enabled:true, layout.css.step-position-jump.enabled:true, layout.css.marker.restricted:false]