1 files changed, 49 insertions, 0 deletions
diff --git a/gfx/layers/apz/test/mochitest/helper_bug1806400-3.html b/gfx/layers/apz/test/mochitest/helper_bug1806400-3.html
new file mode 100644
index 0000000000..2e5398119c
--- /dev/null
+++ b/gfx/layers/apz/test/mochitest/helper_bug1806400-3.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html>
+<meta name="viewport" content="width=device-width; initial-scale=1.0">
+<title>Tests that :active state is changed on a scrollable container without any touch event listeners</title>
+<script src="/tests/SimpleTest/SimpleTest.js"></script>
+ <script src="/tests/SimpleTest/paint_listener.js"></script>
+<script src="apz_test_utils.js"></script>
+<script src="apz_test_native_event_utils.js"></script>
+<style>
+#scrollable {
+  height: 50vh;
+  width: 50vw;
+  background: yellow;
+  overflow: scroll;
+}
+
+#scrollabletarget {
+  height: 200vh;
+  width: 200vh;
+  background: green;
+}
+
+#scrollabletarget:active {
+  background: red;
+}
+
+</style>
+<div id="scrollable">
+  <div id="scrollabletarget">
+  </div>
+</div>
+<script>
+async function test() {
+  ok(!scrollabletarget.matches(":active"), "should not be active initially");
+
+  await synthesizeNativeTap(scrollabletarget, 50, 50);
+
+  // In JS there's no way to ensure `APZStateChange::eStartTouch` notification
+  // has been processed. So we wait for `:active` state change here.
+  await SimpleTest.promiseWaitForCondition(
+    () => scrollabletarget.matches(":active"),
+    "Waiting for :active state change");
+  ok(scrollabletarget.matches(":active"), "should be active");
+}
+waitUntilApzStable()
+.then(test)
+.then(subtestDone, subtestFailed);
+</script>
+</html>