Bug 1676565 Part 4 - Add flex item fragmentation reftests for "writing-mode: vertical-rl". r=emilio
authorTing-Yu Lin <tlin@mozilla.com>
Thu, 12 Nov 2020 12:09:30 +0000
changeset 556974 cfcf871c7731ded7a1ebcee953c92d7d953a2754
parent 556973 8843edd4832ba16ce60ef4088e96436cd38eaacb
child 556975 af9d8aa720dc11df363f8b20020668540d9edc28
push id37946
push userdluca@mozilla.com
push dateFri, 13 Nov 2020 09:59:41 +0000
treeherdermozilla-central@7bc610418605 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersemilio
bugs1676565
milestone84.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1676565 Part 4 - Add flex item fragmentation reftests for "writing-mode: vertical-rl". r=emilio First, copy the "vertical-lr" reftests added in Part 3, then running the following command to convert to `writing-mode: vertical-rl` for all the reftests. ``` rg -l "vertical-lr" flexbox-*vertical-rl* | xargs sed -i "s/vertical-lr/vertical-rl/g" ``` reftest.list are modified manually. Differential Revision: https://phabricator.services.mozilla.com/D96742
layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1-ref.html
layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1a.html
layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1b.html
layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1c.html
layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1d.html
layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1e.html
layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1f.html
layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1g.html
layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1h.html
layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1i.html
layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1j.html
layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-2-ref.html
layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-2.html
layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1-ref.html
layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1a.html
layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1b.html
layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1c.html
layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1d.html
layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1e.html
layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1f.html
layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-2-ref.html
layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-2a.html
layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-2b.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1-ref.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1a.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1b.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1c.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1d.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1e.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1f.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1g.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1h.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1i.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1j.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-2-ref.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-2.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-3-ref.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-3a.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-3b.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-4-ref.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-4.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-5-ref.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-5.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-6-ref.html
layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-6.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1-ref.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1a.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1b.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1c.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1d.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1e.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1f.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1g.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1h.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-2-ref.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-2.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-3-ref.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-3a.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-3b.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-4-ref.html
layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-4.html
layout/reftests/flexbox/pagination/reftest.list
copy from layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1-ref.html
@@ -4,17 +4,17 @@
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of multi-line column flex container</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1a.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1a.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1a.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1a.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line column flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto multi-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1b.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1b.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1b.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1b.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line column-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto multi-line column-reverse flex container, with various combinations of margin/border/padding, alignments, and row-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1c.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1c.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1c.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1c.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of fixed block-size multi-line column flex container with flexible length flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of flexible length flex items in a fixed block-size multi-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1d.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1d.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1d.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1d.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of fixed block-size multi-line column-reverse flex container with flexible length flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of flexible length flex items in a fixed block-size multi-line column-reverse flex container, with various combinations of margin/border/padding, alignments, and row-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1e.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1e.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1e.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1e.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line column flex container with block-size:auto flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of block-size:auto flex items in a block-size:auto multi-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1f.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1f.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1f.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1f.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line column-reverse flex container with block-size:auto flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of block-size:auto flex items in a block-size:auto multi-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1g.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1g.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1g.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1g.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line column flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto multi-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap. Also use a script to enlarge multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 30px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1h.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1h.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1h.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1h.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line column-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto multi-line column-reverse flex container, with various combinations of margin/border/padding, alignments, and row-gap. Also use a script to enlarge multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 30px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1i.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1i.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1i.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1i.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line column flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto multi-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap. Also use a script to shrink multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 80px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1j.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1j.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-1j.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-1j.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line column-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto multi-line column-reverse flex container, with various combinations of margin/border/padding, alignments, and row-gap. Also use a script to shrink multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 80px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-2-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-2-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-2-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-2-ref.html
@@ -4,17 +4,17 @@
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of multi-line column flex container</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 90px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-2.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-2.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-lr-2.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-column-vertical-rl-2.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of fixed block-size multi-line column flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-column-vertical-lr-2-ref.html">
+  <link rel="match" href="flexbox-multi-column-vertical-rl-2-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a fixed block-size multi-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap. The block-size of the flex container is made shorter than its flex items.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 90px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1-ref.html
@@ -4,17 +4,17 @@
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of multi-line row flex container</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 200px;
     column-width: 60px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1a.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1a.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1a.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1a.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line row flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto multi-line row flex container, with various combinations of margin/border/padding, alignments, and gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 200px;
     column-width: 60px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1b.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1b.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1b.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1b.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line row-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto multi-line row flex container, with various combinations of margin/border/padding, alignments, and gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 200px;
     column-width: 60px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1c.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1c.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1c.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1c.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line row flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto multi-line row flex container, with various combinations of margin/border/padding, alignments, and gap. Also use a script to enlarge multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 30px;
     inline-size: 200px;
     column-width: 60px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1d.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1d.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1d.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1d.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line row-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto multi-line row flex container, with various combinations of margin/border/padding, alignments, and gap. Also use a script to enlarge multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 30px;
     inline-size: 200px;
     column-width: 60px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1e.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1e.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1e.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1e.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line row flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto multi-line row flex container, with various combinations of margin/border/padding, alignments, and gap. Also use a script to shrink multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 80px;
     inline-size: 200px;
     column-width: 60px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1f.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1f.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-1f.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-1f.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto multi-line row-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-multi-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto multi-line row flex container, with various combinations of margin/border/padding, alignments, and gap. Also use a script to shrink multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 80px;
     inline-size: 200px;
     column-width: 60px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-2-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-2-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-2-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-2-ref.html
@@ -4,17 +4,17 @@
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of multi-line row flex container</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 70px;
     inline-size: 200px;
     column-width: 60px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-2a.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-2a.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-2a.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-2a.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of fixed block-size multi-line row flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-row-vertical-lr-2-ref.html">
+  <link rel="match" href="flexbox-multi-row-vertical-rl-2-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a fixed block-size multi-line row flex container, with various combinations of margin/border/padding, alignments, and gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 70px;
     inline-size: 200px;
     column-width: 60px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-2b.html
copy to layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-2b.html
--- a/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-lr-2b.html
+++ b/layout/reftests/flexbox/pagination/flexbox-multi-row-vertical-rl-2b.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of fixed block-size multi-line row-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-multi-row-vertical-lr-2-ref.html">
+  <link rel="match" href="flexbox-multi-row-vertical-rl-2-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a fixed block-size multi-line row flex container, with various combinations of margin/border/padding, alignments, and gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 70px;
     inline-size: 200px;
     column-width: 60px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1-ref.html
@@ -4,17 +4,17 @@
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of single-line column flex container</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1a.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1a.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1a.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1a.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line column flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1b.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1b.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1b.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1b.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line column-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line column-reverse flex container, with various combinations of margin/border/padding, alignments, and row-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1c.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1c.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1c.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1c.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of fixed block-size single-line column flex container with flexible length flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of flexible length flex items in a fixed block-size single-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1d.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1d.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1d.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1d.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of fixed block-size single-line column-reverse flex container with flexible length flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of flexible length flex items in a fixed block-size single-line column-reverse flex container, with various combinations of margin/border/padding, alignments, and row-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1e.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1e.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1e.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1e.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line column flex container with block-size:auto flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of block-size:auto flex items in a block-size:auto single-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1f.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1f.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1f.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1f.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line column-reverse flex container with block-size:auto flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of block-size:auto flex items in a block-size:auto single-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1g.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1g.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1g.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1g.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line column flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap. Also use a script to enlarge multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 30px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1h.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1h.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1h.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1h.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line column-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line column-reverse flex container, with various combinations of margin/border/padding, alignments, and row-gap. Also use a script to enlarge multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 30px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1i.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1i.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1i.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1i.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line column flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap. Also use a script to shrink multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 80px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1j.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1j.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-1j.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-1j.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line column-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line column-reverse flex container, with various combinations of margin/border/padding, alignments, and row-gap. Also use a script to shrink multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 80px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-2-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-2-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-2-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-2-ref.html
@@ -4,17 +4,17 @@
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of single-line column flex container</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-2.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-2.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-2.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-2.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of fixed block-size single-line column flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-2-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-2-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a fixed block-size single-line column flex container, with various combinations of margin/border/padding, alignments, and row-gap. The block-size of the flex container is made shorter than its flex items.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-3-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-3-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-3-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-3-ref.html
@@ -4,17 +4,17 @@
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of single-line column flex container</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-3a.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-3a.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-3a.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-3a.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto and box-decoration-break:clone single-line column flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-3-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-3-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line column flex container, with various combinations of margin/border/padding, alignments, row-gap, and box-decoration-break:clone.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 80px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-3b.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-3b.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-3b.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-3b.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto and box-decoration-break:clone single-line column-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-3-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-3-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line column-reverse flex container, with various combinations of margin/border/padding, alignments, row-gap, and box-decoration-break:clone.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 80px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-4-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-4-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-4-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-4-ref.html
@@ -4,17 +4,17 @@
 <html class="reftest-paged">
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of single-line column flex container in print context</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   @page { size:5in 3in; margin:0.5in; }
 
   html, body {
     font-size: 12pt; margin: 0;
   }
 
   .flexContainer {
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-4.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-4.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-4.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-4.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html class="reftest-paged">
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of nested block-size:auto flex containers with a tall flex item in print context, not top-of-page</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-4-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-4-ref.html">
   <meta name="assert" content="This test verifies fragmentation of a tall flex item in nested block-size:auto single-line column flex containers in print context.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   @page { size:5in 3in; margin:0.5in; }
 
   html, body {
     font-size: 12pt; margin: 0;
   }
 
   .flexContainer {
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-5-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-5-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-5-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-5-ref.html
@@ -5,17 +5,17 @@
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of block-size:auto single-line column flex container in a zero block-size multicol</title>
   <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com">
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     column-count: 2;
     block-size: 0;
     border: 1px solid black;
     margin-block-end: 30px; /* Just to separate each sub-testcase visually. */
   }
 
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-5.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-5.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-5.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-5.html
@@ -3,22 +3,22 @@
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line column flex container in a zero block-size multicol</title>
   <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com">
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-5-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-5-ref.html">
   <meta name="assert" content="This test verifies fragmentation of flex containers can make progress in a zero block-size multicol.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     column-count: 2;
     block-size: 0;
     border: 1px solid black;
     margin-block-end: 30px; /* Just to separate each sub-testcase visually. */
   }
 
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-6-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-6-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-6-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-6-ref.html
@@ -4,17 +4,17 @@
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of a fixed block-size single-line column flex container and a fixed block-size flex item that has overflows</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-6.html
copy to layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-6.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-lr-6.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-column-vertical-rl-6.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of a fixed block-size single-line column flex container and a fixed block-size flex item that has overflows</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-column-vertical-lr-6-ref.html">
+  <link rel="match" href="flexbox-single-column-vertical-rl-6-ref.html">
   <meta name="assert" content="This test verifies fragmentation of a fixed block-size flex item that has overflows in a fixed block-size single-line column flex container.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 190px;
     column-width: 40px;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1-ref.html
@@ -4,17 +4,17 @@
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of single-line row flex container</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1a.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1a.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1a.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1a.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line row flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line row flex container, with various combinations of margin/border/padding, alignments, and column-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1b.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1b.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1b.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1b.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line row-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line row-reverse flex container, with various combinations of margin/border/padding, alignments, and column-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1c.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1c.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1c.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1c.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line row flex container with block-size:auto flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of block-size:auto flex items in a block-size:auto single-line row flex container, with various combinations of margin/border/padding, alignments, and column-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1d.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1d.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1d.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1d.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line row-reverse flex container with block-size:auto flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of block-size:auto flex items in a block-size:auto single-line row-reverse flex container, with various combinations of margin/border/padding, alignments, and column-gap.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1e.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1e.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1e.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1e.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line row flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line row flex container, with various combinations of margin/border/padding, alignments, and column-gap.  Also use a script to enlarge multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 30px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1f.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1f.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1f.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1f.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line row-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line row-reverse flex container, with various combinations of margin/border/padding, alignments, and column-gap. Also use a script to enlarge multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 30px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1g.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1g.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1g.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1g.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line row flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line row flex container, with various combinations of margin/border/padding, alignments, and column-gap.  Also use a script to shrink multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 80px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1h.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1h.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-1h.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-1h.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line row-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-row-vertical-lr-1-ref.html">
+  <link rel="match" href="flexbox-single-row-vertical-rl-1-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line row-reverse flex container, with various combinations of margin/border/padding, alignments, and column-gap. Also use a script to shrink multicol block-size.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 80px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-2-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-2-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-2-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-2-ref.html
@@ -4,17 +4,17 @@
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of single-line row flex container</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-2.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-2.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-2.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-2.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of fixed block-size single-line row flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-row-vertical-lr-2-ref.html">
+  <link rel="match" href="flexbox-single-row-vertical-rl-2-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line row flex container, with various combinations of margin/border/padding, alignments, and column-gap. The block-size of the flex container is made shorter than <header>.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-3-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-3-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-3-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-3-ref.html
@@ -4,17 +4,17 @@
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of single-line row flex container</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 50px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-3a.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-3a.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-3a.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-3a.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto and box-decoration-break:clone single-line row flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-row-vertical-lr-3-ref.html">
+  <link rel="match" href="flexbox-single-row-vertical-rl-3-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line row flex container, with various combinations of margin/border/padding, alignments, column-gap, and box-decoration-break:clone.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 80px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-3b.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-3b.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-3b.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-3b.html
@@ -2,22 +2,22 @@
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto and box-decoration-break:clone single-line row-reverse flex container with fixed block-size flex items</title>
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-row-vertical-lr-3-ref.html">
+  <link rel="match" href="flexbox-single-row-vertical-rl-3-ref.html">
   <meta name="assert" content="This test verifies fragmentation of fixed block-size flex items in a block-size:auto single-line row-reverse flex container, with various combinations of margin/border/padding, alignments, column-gap, and box-decoration-break:clone.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     block-size: 80px;
     inline-size: 320px;
     column-count: 3;
     column-fill: auto;
     column-gap: 10px;
     border: 5px solid orange;
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-4-ref.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-4-ref.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-4-ref.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-4-ref.html
@@ -5,17 +5,17 @@
   <meta charset="utf-8">
   <title>CSS Flexbox Test Reference: Fragmentation of block-size:auto single-line row flex container in a zero block-size multicol</title>
   <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com">
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     column-count: 2;
     block-size: 0;
     border: 1px solid black;
     margin-block-end: 30px; /* Just to separate each sub-testcase visually. */
   }
 
copy from layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-4.html
copy to layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-4.html
--- a/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-lr-4.html
+++ b/layout/reftests/flexbox/pagination/flexbox-single-row-vertical-rl-4.html
@@ -3,22 +3,22 @@
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
   <meta charset="utf-8">
   <title>CSS Flexbox Test: Fragmentation of block-size:auto single-line row flex container in a zero block-size multicol</title>
   <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com">
   <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
   <link rel="author" title="Mozilla" href="http://www.mozilla.org/">
   <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
-  <link rel="match" href="flexbox-single-row-vertical-lr-4-ref.html">
+  <link rel="match" href="flexbox-single-row-vertical-rl-4-ref.html">
   <meta name="assert" content="This test verifies fragmentation of flex containers can make progress in a zero block-size multicol.">
 
   <style>
   html {
-    writing-mode: vertical-lr;
+    writing-mode: vertical-rl;
   }
   .multicol {
     column-count: 2;
     block-size: 0;
     border: 1px solid black;
     margin-block-end: 30px; /* Just to separate each sub-testcase visually. */
   }
 
--- a/layout/reftests/flexbox/pagination/reftest.list
+++ b/layout/reftests/flexbox/pagination/reftest.list
@@ -72,16 +72,35 @@ fuzzy-if(Android&&webrender,0-128,0-10) 
 == flexbox-single-column-vertical-lr-1j.html flexbox-single-column-vertical-lr-1-ref.html
 == flexbox-single-column-vertical-lr-2.html flexbox-single-column-vertical-lr-2-ref.html
 == flexbox-single-column-vertical-lr-3a.html flexbox-single-column-vertical-lr-3-ref.html
 == flexbox-single-column-vertical-lr-3b.html flexbox-single-column-vertical-lr-3-ref.html
 == flexbox-single-column-vertical-lr-4.html flexbox-single-column-vertical-lr-4-ref.html
 == flexbox-single-column-vertical-lr-5.html flexbox-single-column-vertical-lr-5-ref.html
 == flexbox-single-column-vertical-lr-6.html flexbox-single-column-vertical-lr-6-ref.html
 
+# Tests for how we fragment flex items in a single-line column flex container
+# under "writing-mode: vertical-rl".
+fails == flexbox-single-column-vertical-rl-1a.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-column-vertical-rl-1b.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-column-vertical-rl-1c.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-column-vertical-rl-1d.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-column-vertical-rl-1e.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-column-vertical-rl-1f.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-column-vertical-rl-1g.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-column-vertical-rl-1h.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-column-vertical-rl-1i.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-column-vertical-rl-1j.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-column-vertical-rl-2.html flexbox-single-column-vertical-rl-2-ref.html # Bug 1674774
+fails == flexbox-single-column-vertical-rl-3a.html flexbox-single-column-vertical-rl-3-ref.html # Bug 1674774
+fails == flexbox-single-column-vertical-rl-3b.html flexbox-single-column-vertical-rl-3-ref.html # Bug 1674774
+== flexbox-single-column-vertical-rl-4.html flexbox-single-column-vertical-rl-4-ref.html
+fails == flexbox-single-column-vertical-rl-5.html flexbox-single-column-vertical-rl-5-ref.html # Bug 1674774
+fails == flexbox-single-column-vertical-rl-6.html flexbox-single-column-vertical-rl-6-ref.html # Bug 1674774
+
 # Tests for how we fragment flex items in a multi-line column flex container.
 == flexbox-multi-column-1a.html flexbox-multi-column-1-ref.html
 == flexbox-multi-column-1b.html flexbox-multi-column-1-ref.html
 == flexbox-multi-column-1c.html flexbox-multi-column-1-ref.html
 == flexbox-multi-column-1d.html flexbox-multi-column-1-ref.html
 == flexbox-multi-column-1e.html flexbox-multi-column-1-ref.html
 == flexbox-multi-column-1f.html flexbox-multi-column-1-ref.html
 == flexbox-multi-column-1g.html flexbox-multi-column-1-ref.html
@@ -99,16 +118,30 @@ fuzzy-if(Android&&webrender,0-128,0-10) 
 == flexbox-multi-column-vertical-lr-1e.html flexbox-multi-column-vertical-lr-1-ref.html
 == flexbox-multi-column-vertical-lr-1f.html flexbox-multi-column-vertical-lr-1-ref.html
 == flexbox-multi-column-vertical-lr-1g.html flexbox-multi-column-vertical-lr-1-ref.html
 == flexbox-multi-column-vertical-lr-1h.html flexbox-multi-column-vertical-lr-1-ref.html
 == flexbox-multi-column-vertical-lr-1i.html flexbox-multi-column-vertical-lr-1-ref.html
 == flexbox-multi-column-vertical-lr-1j.html flexbox-multi-column-vertical-lr-1-ref.html
 == flexbox-multi-column-vertical-lr-2.html flexbox-multi-column-vertical-lr-2-ref.html
 
+# Tests for how we fragment flex items in a multi-line column flex container
+# under "writing-mode: vertical-rl".
+fails == flexbox-multi-column-vertical-rl-1a.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-column-vertical-rl-1b.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-column-vertical-rl-1c.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-column-vertical-rl-1d.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-column-vertical-rl-1e.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-column-vertical-rl-1f.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-column-vertical-rl-1g.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-column-vertical-rl-1h.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-column-vertical-rl-1i.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-column-vertical-rl-1j.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-column-vertical-rl-2.html flexbox-multi-column-vertical-rl-2-ref.html # Bug 1674774
+
 # Tests for how we fragment flex items in a single-line row flex container.
 == flexbox-single-row-1a.html flexbox-single-row-1-ref.html
 == flexbox-single-row-1b.html flexbox-single-row-1-ref.html
 == flexbox-single-row-1c.html flexbox-single-row-1-ref.html
 == flexbox-single-row-1d.html flexbox-single-row-1-ref.html
 == flexbox-single-row-1e.html flexbox-single-row-1-ref.html
 == flexbox-single-row-1f.html flexbox-single-row-1-ref.html
 == flexbox-single-row-1g.html flexbox-single-row-1-ref.html
@@ -128,16 +161,31 @@ fuzzy-if(Android&&webrender,0-128,0-10) 
 == flexbox-single-row-vertical-lr-1f.html flexbox-single-row-vertical-lr-1-ref.html
 == flexbox-single-row-vertical-lr-1g.html flexbox-single-row-vertical-lr-1-ref.html
 == flexbox-single-row-vertical-lr-1h.html flexbox-single-row-vertical-lr-1-ref.html
 == flexbox-single-row-vertical-lr-2.html flexbox-single-row-vertical-lr-2-ref.html
 == flexbox-single-row-vertical-lr-3a.html flexbox-single-row-vertical-lr-3-ref.html
 == flexbox-single-row-vertical-lr-3b.html flexbox-single-row-vertical-lr-3-ref.html
 == flexbox-single-row-vertical-lr-4.html flexbox-single-row-vertical-lr-4-ref.html
 
+# Tests for how we fragment flex items in a single-line row flex container
+# under "writing-mode: vertical-rl".
+fails == flexbox-single-row-vertical-rl-1a.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-row-vertical-rl-1b.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-row-vertical-rl-1c.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-row-vertical-rl-1d.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-row-vertical-rl-1e.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-row-vertical-rl-1f.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-row-vertical-rl-1g.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-row-vertical-rl-1h.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-single-row-vertical-rl-2.html flexbox-single-row-vertical-rl-2-ref.html # Bug 1674774
+fails == flexbox-single-row-vertical-rl-3a.html flexbox-single-row-vertical-rl-3-ref.html # Bug 1674774
+fails == flexbox-single-row-vertical-rl-3b.html flexbox-single-row-vertical-rl-3-ref.html # Bug 1674774
+fails == flexbox-single-row-vertical-rl-4.html flexbox-single-row-vertical-rl-4-ref.html # Bug 1674774
+
 # Tests for how we fragment flex items in a multi-line row flex container.
 == flexbox-multi-row-1a.html flexbox-multi-row-1-ref.html
 == flexbox-multi-row-1b.html flexbox-multi-row-1-ref.html
 == flexbox-multi-row-1c.html flexbox-multi-row-1-ref.html
 == flexbox-multi-row-1d.html flexbox-multi-row-1-ref.html
 == flexbox-multi-row-1e.html flexbox-multi-row-1-ref.html
 == flexbox-multi-row-1f.html flexbox-multi-row-1-ref.html
 == flexbox-multi-row-2a.html flexbox-multi-row-2-ref.html
@@ -148,8 +196,19 @@ fuzzy-if(Android&&webrender,0-128,0-10) 
 == flexbox-multi-row-vertical-lr-1a.html flexbox-multi-row-vertical-lr-1-ref.html
 == flexbox-multi-row-vertical-lr-1b.html flexbox-multi-row-vertical-lr-1-ref.html
 == flexbox-multi-row-vertical-lr-1c.html flexbox-multi-row-vertical-lr-1-ref.html
 == flexbox-multi-row-vertical-lr-1d.html flexbox-multi-row-vertical-lr-1-ref.html
 == flexbox-multi-row-vertical-lr-1e.html flexbox-multi-row-vertical-lr-1-ref.html
 == flexbox-multi-row-vertical-lr-1f.html flexbox-multi-row-vertical-lr-1-ref.html
 == flexbox-multi-row-vertical-lr-2a.html flexbox-multi-row-vertical-lr-2-ref.html
 == flexbox-multi-row-vertical-lr-2b.html flexbox-multi-row-vertical-lr-2-ref.html
+
+# Tests for how we fragment flex items in a multi-line row flex container.
+# under "writing-mode: vertical-rl".
+fails == flexbox-multi-row-vertical-rl-1a.html flexbox-multi-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-row-vertical-rl-1b.html flexbox-multi-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-row-vertical-rl-1c.html flexbox-multi-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-row-vertical-rl-1d.html flexbox-multi-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-row-vertical-rl-1e.html flexbox-multi-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-row-vertical-rl-1f.html flexbox-multi-row-vertical-rl-1-ref.html # Bug 1674774
+fails == flexbox-multi-row-vertical-rl-2a.html flexbox-multi-row-vertical-rl-2-ref.html # Bug 1674774
+fails == flexbox-multi-row-vertical-rl-2b.html flexbox-multi-row-vertical-rl-2-ref.html # Bug 1674774