Bug 1900267 [wpt PR 46578] - [text-box-trim] Add tests for atomic inl…

…ines, a=testonly Automatic update from web-platform-tests [text-box-trim] Add tests for atomic inlines This patch adds tests to ensure that the `text-box-trim` property trims the line containing atomic inlines, but it doesn't propagate into the atomic inline, and therefore the lines inside of the atomic inline isn't trimmed. This patch has no behavior changes. Bug: 40254880 Change-Id: I7ffd34238a30f0178b4070dc23452e5e59c47fd4 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5588337 Auto-Submit: Koji Ishii <[email protected]> Reviewed-by: Kent Tamura <[email protected]> Commit-Queue: Kent Tamura <[email protected]> Cr-Commit-Position: refs/heads/main@{#1309110} -- wpt-commits: b71de6ef028f53a4dfa3648533d1ed0ecf56bd1e wpt-pr: 46578
mozilla · Jun 5, 2024 · 84986c3 · 84986c3
1 parent 027be60
commit 84986c3
Show file tree

Hide file tree

Showing 2 changed files with 53 additions and 0 deletions.
diff --git a/.../web-platform/tests/css/css-inline/text-box-trim/text-box-trim-atomic-inline-001-ref.html b/.../web-platform/tests/css/css-inline/text-box-trim/text-box-trim-atomic-inline-001-ref.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
+<style>
+.spacer {
+  background: lightgray;
+  block-size: 100px;
+}
+.target {
+  font-family: Ahem;
+  font-size: 100px;
+  line-height: 2;
+  position: relative;
+  top: -50px;
+  height: 100px;
+}
+.atomic {
+  display: inline-block;
+  background: lime;
+}
+</style>
+<div class="spacer"></div>
+<div class="target">
+  <span class="atomic">X</span>
+</div>
+<div class="spacer"></div>
diff --git a/testing/web-platform/tests/css/css-inline/text-box-trim/text-box-trim-atomic-inline-001.html b/testing/web-platform/tests/css/css-inline/text-box-trim/text-box-trim-atomic-inline-001.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<title>Test the `text-box-trim` isn't propagated into atomic inlines</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-atomic-inline-001-ref.html">
+<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
+<style>
+.spacer {
+  background: lightgray;
+  block-size: 100px;
+}
+.target {
+  font-family: Ahem;
+  font-size: 100px;
+  line-height: 2;
+  text-box-trim: both;
+  text-box-edge: text;
+}
+.atomic {
+  display: inline-block;
+  background: lime;
+}
+</style>
+<div class="spacer"></div>
+<div class="target">
+  <span class="atomic">X</span>
+</div>
+<div class="spacer"></div>