summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/mozilla/tests/css/css-overflow/scrollbar-gutter-reflow-counts-001.html
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
commit36d22d82aa202bb199967e9512281e9a53db42c9 (patch)
tree105e8c98ddea1c1e4784a60a5a6410fa416be2de /testing/web-platform/mozilla/tests/css/css-overflow/scrollbar-gutter-reflow-counts-001.html
parentInitial commit. (diff)
downloadfirefox-esr-upstream.tar.xz
firefox-esr-upstream.zip
Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/mozilla/tests/css/css-overflow/scrollbar-gutter-reflow-counts-001.html')
-rw-r--r--testing/web-platform/mozilla/tests/css/css-overflow/scrollbar-gutter-reflow-counts-001.html115
1 files changed, 115 insertions, 0 deletions
diff --git a/testing/web-platform/mozilla/tests/css/css-overflow/scrollbar-gutter-reflow-counts-001.html b/testing/web-platform/mozilla/tests/css/css-overflow/scrollbar-gutter-reflow-counts-001.html
new file mode 100644
index 0000000000..aa4ed4667b
--- /dev/null
+++ b/testing/web-platform/mozilla/tests/css/css-overflow/scrollbar-gutter-reflow-counts-001.html
@@ -0,0 +1,115 @@
+<!DOCTYPE html>
+<html>
+ <meta charset="utf-8">
+ <title>CSS Overflow: Test scrollbar-gutter reflow counts</title>
+ <link rel="author" title="Ting-Yu Lin" href="mailto:tlin@mozilla.com">
+ <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1746098">
+
+ <script src="/resources/testharness.js"></script>
+ <script src="/resources/testharnessreport.js"></script>
+
+ <style>
+ #target {
+ inline-size: 200px;
+ block-size: 100px;
+ background: lightgray;
+ overflow: auto;
+ }
+
+ #targetChild {
+ inline-size: 100%;
+ block-size: 100%;
+ background: orange;
+ }
+ </style>
+
+ <p>Here is a scroll contaier for testing:</p>
+ <div id="target">
+ <div id="targetChild"></div>
+ </div>
+
+ <script>
+ let gUtils = SpecialPowers.getDOMWindowUtils(window);
+ let gTarget = document.getElementById("target");
+ let gTargetChild = document.getElementById("targetChild");
+
+ function getReflowCount()
+ {
+ document.documentElement.offsetHeight; // flush layout
+ return gUtils.framesReflowed;
+ }
+
+ function cleanUp() {
+ gTarget.style.writingMode = "";
+ gTarget.style.scrollbarGutter = "";
+ gTargetChild.style.blockSize = "";
+ }
+
+ function tweakStyleAndCountReflows(aAddStyle, aAddScrollbarGutter)
+ {
+ let beforeCount = getReflowCount();
+ if (aAddScrollbarGutter) {
+ gTarget.style.scrollbarGutter = "stable";
+ }
+ aAddStyle();
+ let afterCount = getReflowCount();
+ cleanUp();
+
+ let numReflows = afterCount - beforeCount;
+ assert_greater_than(numReflows, 0, "We should've reflowed *something* after changing styles:");
+ return numReflows;
+ }
+
+ let gTestCases = [
+ {
+ name : "Enlarge the child's block-size to 200%",
+ addStyle : function () {
+ gTargetChild.style.blockSize = "200%";
+ },
+ },
+ {
+ name : "Enlarge the child's block-size to 300px",
+ addStyle : function () {
+ gTargetChild.style.blockSize = "300px";
+ },
+ },
+ {
+ name : "Enlarge the child's block-size to 200% in a vertical-lr scroll container",
+ addStyle : function () {
+ gTarget.style.writingMode = "vertical-lr";
+ gTargetChild.style.blockSize = "200%";
+ },
+ },
+ {
+ name : "Enlarge the child's block-size to 300px in a vertical-lr scroll container",
+ addStyle : function () {
+ gTarget.style.writingMode = "vertical-lr";
+ gTargetChild.style.blockSize = "300px";
+ },
+ },
+ {
+ name : "Enlarge the child's block-size to 200% in a vertical-rl scroll container",
+ addStyle : function () {
+ gTarget.style.writingMode = "vertical-rl";
+ gTargetChild.style.blockSize = "200%";
+ },
+ },
+ {
+ name : "Enlarge the child's block-size to 300px in a vertical-rl scroll container",
+ addStyle : function () {
+ gTarget.style.writingMode = "vertical-rl";
+ gTargetChild.style.blockSize = "300px";
+ },
+ },
+ ];
+
+ for (let testcase of gTestCases) {
+ test(function () {
+ let numTestReflows = tweakStyleAndCountReflows(testcase.addStyle, true);
+ let numReferenceReflows = tweakStyleAndCountReflows(testcase.addStyle, false);
+ assert_less_than(numTestReflows, numReferenceReflows,
+ "A scroll container with 'scrollbar-gutter:stable' should have less reflow counts:");
+ }, testcase.name)
+ }
+ </script>
+</html>