Bug 1283222 - add WPT tests for empty out-of-flow elements. draft
authorJeremy Chen <jeremychen@mozilla.com>
Mon, 15 Jan 2018 00:20:09 +0800
changeset 720167 93d32aa98190ff6a4e5bb53a6c435bec7695bf3a
parent 719533 6838315b5b0111d7ad93c3de928cac4b6120182a
child 745990 4d2736ebdc85f7d25e91d423891f06e834405780
push id95462
push userbmo:jeremychen@mozilla.com
push dateSun, 14 Jan 2018 16:25:24 +0000
bugs1283222
milestone59.0a1
Bug 1283222 - add WPT tests for empty out-of-flow elements. According to CSS Text 3 Specification, out-of-flow elements do not introduce a forced line break or soft wrap opportunity in the flow. So, empty out-of-flow elements should be treated/rendered like empty in-flow elements. In this patch, we add tests to ensure this. MozReview-Commit-ID: 5WmVcTzBXMu
testing/web-platform/meta/MANIFEST.json
testing/web-platform/tests/css/css-text/line-breaking/line-breaking-out-of-flow-001.html
testing/web-platform/tests/css/css-text/line-breaking/reference/line-breaking-out-of-flow-001-ref.html
--- a/testing/web-platform/meta/MANIFEST.json
+++ b/testing/web-platform/meta/MANIFEST.json
@@ -130498,16 +130498,28 @@
       [
        "/css/css-text/line-breaking/reference/line-breaking-ic-001-ref.html",
        "=="
       ]
      ],
      {}
     ]
    ],
+   "css/css-text/line-breaking/line-breaking-out-of-flow-001.html": [
+    [
+     "/css/css-text/line-breaking/line-breaking-out-of-flow-001.html",
+     [
+      [
+       "/css/css-text/line-breaking/reference/line-breaking-out-of-flow-001-ref.html",
+       "=="
+      ]
+     ],
+     {}
+    ]
+   ],
    "css/css-text/overflow-wrap/overflow-wrap-001.html": [
     [
      "/css/css-text/overflow-wrap/overflow-wrap-001.html",
      [
       [
        "/css/css-text/overflow-wrap/overflow-wrap-001-ref.html",
        "=="
       ]
@@ -249641,16 +249653,21 @@
      {}
     ]
    ],
    "css/css-text/line-breaking/reference/line-breaking-ic-001-ref.html": [
     [
      {}
     ]
    ],
+   "css/css-text/line-breaking/reference/line-breaking-out-of-flow-001-ref.html": [
+    [
+     {}
+    ]
+   ],
    "css/css-text/overflow-wrap/overflow-wrap-001-ref.html": [
     [
      {}
     ]
    ],
    "css/css-text/overflow-wrap/overflow-wrap-002-ref.html": [
     [
      {}
@@ -499927,24 +499944,32 @@
   "css/css-text/line-breaking/line-breaking-ic-002.html": [
    "595b8383b62a15bea1ab55f1c8d9376122cea9f9",
    "reftest"
   ],
   "css/css-text/line-breaking/line-breaking-ic-003.html": [
    "0fca11a308fafb818f4f1c22126dccc07f7b0094",
    "reftest"
   ],
+  "css/css-text/line-breaking/line-breaking-out-of-flow-001.html": [
+   "0ece372352a1f15b09e5ea009091ab2a5952599d",
+   "reftest"
+  ],
   "css/css-text/line-breaking/reference/line-breaking-001-ref.html": [
    "18e2a575cd64974e588c87c48ea046691c488b68",
    "support"
   ],
   "css/css-text/line-breaking/reference/line-breaking-ic-001-ref.html": [
    "7757ffc4116743ff6f98649310bf8b1bdc7027c9",
    "support"
   ],
+  "css/css-text/line-breaking/reference/line-breaking-out-of-flow-001-ref.html": [
+   "4e5930b30a21a49366ade1cbded56955b2e5b997",
+   "support"
+  ],
   "css/css-text/overflow-wrap/overflow-wrap-001-ref.html": [
    "b45227d3e2f35056471a1bb1ecf8e8cb794e0d97",
    "support"
   ],
   "css/css-text/overflow-wrap/overflow-wrap-001.html": [
    "092230baa23f6bff371f222eacd446d47adae64d",
    "reftest"
   ],
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/line-breaking/line-breaking-out-of-flow-001.html
@@ -0,0 +1,36 @@
+<!doctype html>
+<html>
+<meta charset="utf-8">
+<title>CSS Text — line breaking around out-of-flow elements</title>
+<link rel="help" href="https://www.w3.org/TR/css-text-3/#line-break-details">
+<link rel="author" title="Chun-Min (Jeremy) Chen" href="mailto:jeremychen@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<link rel="match" href="reference/line-breaking-out-of-flow-001-ref.html">
+<meta name="assert" content="Out-of-flow empty elements do not introduce a forced line break or soft wrap opportunity in the flow.">
+<style>
+body { font: 12px monospace; }
+ol { width: 40ch; float: left; }
+li { border: 1px solid silver; margin: 1em 4ch; }
+.out_of_flow li span { position: absolute; }
+</style>
+<body>
+<ol class="out_of_flow">
+<li style="width: 3ch">
+hello<span></span>, cruel<span></span>, line<span></span>breaking<span></span>, world<span></span>!
+</li>
+<li style="width: 4ch">
+hello<span></span>, cruel<span></span>, line<span></span>breaking<span></span>, world<span></span>!
+</li>
+<li style="width: 5ch">
+hello<span></span>, cruel<span></span>, line<span></span>breaking<span></span>, world<span></span>!
+</li>
+<li style="width: 6ch">
+hello<span></span>, cruel<span></span>, line<span></span>breaking<span></span>, world<span></span>!
+</li>
+<li style="width: 12ch">
+hello<span></span>, cruel<span></span>, line<span></span>breaking<span></span>, world<span></span>!
+</li>
+</ol>
+</body>
+</html>
+
new file mode 100644
--- /dev/null
+++ b/testing/web-platform/tests/css/css-text/line-breaking/reference/line-breaking-out-of-flow-001-ref.html
@@ -0,0 +1,32 @@
+<!doctype html>
+<html>
+<meta charset="utf-8">
+<title>CSS Text — Reference File for line breaking around out-of-flow elements</title>
+<link rel="author" title="Chun-Min (Jeremy) Chen" href="mailto:jeremychen@mozilla.com">
+<link rel="author" title="Mozilla" href="https://www.mozilla.org">
+<style>
+body { font: 12px monospace; }
+ol { width: 40ch; float: left; }
+li { border: 1px solid silver; margin: 1em 4ch; }
+</style>
+<body>
+<ol>
+<li style="width: 3ch">
+hello<span></span>, cruel<span></span>, line<span></span>breaking<span></span>, world<span></span>!
+</li>
+<li style="width: 4ch">
+hello<span></span>, cruel<span></span>, line<span></span>breaking<span></span>, world<span></span>!
+</li>
+<li style="width: 5ch">
+hello<span></span>, cruel<span></span>, line<span></span>breaking<span></span>, world<span></span>!
+</li>
+<li style="width: 6ch">
+hello<span></span>, cruel<span></span>, line<span></span>breaking<span></span>, world<span></span>!
+</li>
+<li style="width: 12ch">
+hello<span></span>, cruel<span></span>, line<span></span>breaking<span></span>, world<span></span>!
+</li>
+</ol>
+</body>
+</html>
+