Bug 1770866 [wpt PR 34178] - [layout] Add test for crbug.com/1062733,…

… a=testonly Automatic update from web-platform-tests [layout] Add test for crbug.com/1062733 Fixed: 1062733 Change-Id: Ia3e50303c003b57e39bf5f39a36ac3353b684939 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3662208 Auto-Submit: Ian Kilpatrick <[email protected]> Reviewed-by: David Grogan <[email protected]> Commit-Queue: David Grogan <[email protected]> Commit-Queue: Ian Kilpatrick <[email protected]> Cr-Commit-Position: refs/heads/main@{#1006680} -- wpt-commits: d52c458b77532fcdc00d93ba6b0ebbd466721d04 wpt-pr: 34178
dothq · May 25, 2022 · 4856887 · 4856887
1 parent 0b5c2de
commit 4856887
Show file tree

Hide file tree

Showing 2 changed files with 74 additions and 0 deletions.
diff --git a/testing/web-platform/tests/css/css-overflow/text-overflow-ellipsis-003-ref.html b/testing/web-platform/tests/css/css-overflow/text-overflow-ellipsis-003-ref.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<style>
+.container {
+  display: flex;
+}
+
+.cell {
+  white-space: nowrap;
+  overflow: hidden;
+  border: 1px solid red;
+  text-overflow: ellipsis;
+}
+
+span {
+  display: inline-block;
+  background: green;
+  width: 30px;
+  height: 1em;
+  padding: 4px;
+  margin: 5px;
+}
+</style>
+<div id="target" class="container" style="width: 150px;">
+  <div class="cell">
+    <span></span><span></span><span></span><span></span>
+  </div>
+  <div class="cell">
+    <span></span><span></span><span></span><span></span>
+  </div>
+</div>
diff --git a/testing/web-platform/tests/css/css-overflow/text-overflow-ellipsis-003.html b/testing/web-platform/tests/css/css-overflow/text-overflow-ellipsis-003.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html class=reftest-wait>
+<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=1062733">
+<link rel="match" href="text-overflow-ellipsis-003-ref.html">
+<script src="/common/reftest-wait.js"></script>
+<style>
+.container {
+  display: flex;
+}
+
+.cell {
+  white-space: nowrap;
+  overflow: hidden;
+  border: 1px solid red;
+  text-overflow: ellipsis;
+}
+
+span {
+  display: inline-block;
+  background: green;
+  width: 30px;
+  height: 1em;
+  padding: 4px;
+  margin: 5px;
+}
+</style>
+<div id="target" class="container" style="width: 200px;">
+  <div class="cell">
+    <span></span><span></span><span></span><span></span>
+  </div>
+  <div class="cell">
+    <span></span><span></span><span></span><span></span>
+  </div>
+</div>
+<script>
+async function runTest() {
+  await new Promise(requestAnimationFrame);
+  document.getElementById('target').style.width = '150px';
+
+  await new Promise(requestAnimationFrame);
+  takeScreenshot();
+}
+requestAnimationFrame(() => { requestAnimationFrame(() => runTest()) });
+</script>