Bug 1898670 [wpt PR 46470] - [text-box-trim] Add tests for multi-col, a=testonly

kojiishi · moz-wptsync-bot · commit 082f6101574b · 2024-06-03T07:39:37.000Z
Automatic update from web-platform-tests [text-box-trim] Add tests for multi-col The `text-box-trim` should apply only to the top of the first fragment and the bottom of the last fragment, resolved at w3c/csswg-drafts#5335. This patch adds tests for this, `001` for when the `text-box-trim` is applied to the multicol container, and `002` for when a box with `text-box-trim` is block fragmented by ancestor multicol. Bug: 40254880 Change-Id: Ice29f39cbef0c20284edd809942754176a395d23 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5564105 Reviewed-by: Kent Tamura <tkent@chromium.org> Commit-Queue: Kent Tamura <tkent@chromium.org> Auto-Submit: Koji Ishii <kojii@chromium.org> Cr-Commit-Position: refs/heads/main@{#1305545} -- wpt-commits: 592dc0a3df19c530baec9079edce72a2625b798e wpt-pr: 46470
diff --git a/testing/web-platform/tests/css/css-inline/text-box-trim/text-box-trim-multicol-001-ref.html b/testing/web-platform/tests/css/css-inline/text-box-trim/text-box-trim-multicol-001-ref.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
+<style>
+.spacer {
+  background: lightgray;
+  block-size: 100px;
+}
+.multicol {
+  column-count: 3;
+  column-fill: auto;
+  border: 1px solid;
+  height: 4lh;
+  width: 20ch;
+  font-family: Ahem;
+  font-size: 40px;
+  line-height: 2;
+}
+.up-half {
+  position: relative;
+  top: -20px;
+}
+</style>
+<div class="multicol">
+  <span class="up-half">
+    abc abc abc abc
+  </span>
+  abc abc abc abc
+  abc abc
+  <div class="spacer up-half"></div>
+</div>
diff --git a/testing/web-platform/tests/css/css-inline/text-box-trim/text-box-trim-multicol-001.html b/testing/web-platform/tests/css/css-inline/text-box-trim/text-box-trim-multicol-001.html
@@ -0,0 +1,32 @@
+<!DOCTYPE html>
+<title>Test when a box with `text-box-trim` is multi-column</title>
+<link rel="help" href="https://drafts.csswg.org/css-inline-3/#propdef-text-box-edge">
+<link rel="help" href="https://drafts.csswg.org/css-inline-3/#propdef-text-box-trim">
+<link rel="match" href="text-box-trim-multicol-001-ref.html">
+<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
+<style>
+.spacer {
+  background: lightgray;
+  block-size: 100px;
+}
+.multicol {
+  column-count: 3;
+  column-fill: auto;
+  border: 1px solid;
+  height: 4lh;
+  width: 20ch;
+  font-family: Ahem;
+  font-size: 40px;
+  line-height: 2;
+}
+.trim {
+  text-box-trim: both;
+  text-box-edge: text;
+}
+</style>
+<div class="multicol trim">
+  abc abc abc abc
+  abc abc abc abc
+  abc abc
+  <div class="spacer"></div>
+</div>
diff --git a/testing/web-platform/tests/css/css-inline/text-box-trim/text-box-trim-multicol-002.html b/testing/web-platform/tests/css/css-inline/text-box-trim/text-box-trim-multicol-002.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<title>Test when a box with `text-box-trim` is block fragmented</title>
+<link rel="help" href="https://drafts.csswg.org/css-inline-3/#propdef-text-box-edge">
+<link rel="help" href="https://drafts.csswg.org/css-inline-3/#propdef-text-box-trim">
+<link rel="match" href="text-box-trim-multicol-001-ref.html">
+<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
+<style>
+.spacer {
+  background: lightgray;
+  block-size: 100px;
+}
+.multicol {
+  column-count: 3;
+  column-fill: auto;
+  border: 1px solid;
+  height: 4lh;
+  width: 20ch;
+  font-family: Ahem;
+  font-size: 40px;
+  line-height: 2;
+}
+.trim {
+  text-box-trim: both;
+  text-box-edge: text;
+}
+</style>
+<div class="multicol">
+  <div class="trim">
+    abc abc abc abc
+    abc abc abc abc
+    abc abc
+  </div>
+  <div class="spacer"></div>
+</div>
