Base: Add test for a box placed over links with negative z-index

In this test, a set of links has a background box placed behind them via a negative z-index. The expectation is that a hit test on a link during a mouse-move event should select that link, and not the background box.
abyesilyurt · Mar 31, 2021 · 2cc10c6 · 2cc10c6
1 parent cbd62c4
commit 2cc10c6
Show file tree

Hide file tree

Showing 2 changed files with 48 additions and 0 deletions.
diff --git a/Base/res/html/misc/link-over-zindex-block.html b/Base/res/html/misc/link-over-zindex-block.html
@@ -0,0 +1,47 @@
+<style>
+ ul {
+ margin: 0;
+ padding: 0;
+ text-align: center;
+ list-style-type: none;
+ }
+ a {
+ color: black;
+ text-decoration: none;
+ }
+ a:hover {
+ text-decoration: underline;
+ }
+ #contents {
+ position: relative;
+ overflow: hidden;
+ }
+ #links {
+ width: 110px;
+ float: left;
+ padding: 5px;
+ }
+ #background {
+ width: 120px;
+ position: absolute;
+ float: left;
+ left: 0;
+ bottom: 0;
+ top: 0;
+ background: cyan;
+ border: 1px solid black;
+ z-index: -10000;
+ }
+</style>
+<body>
+ <div id=contents>
+ <div id=links>
+ <ul>
+ <li><a href="welcome.html">Home 1</a></li>
+ <li><a href="welcome.html">Home 2</a></li>
+ <li><a href="welcome.html">Home 3</a></li>
+ </ul>
+ </div>
+ <div id=background></div>
+ </div>
+</body>
diff --git a/Base/res/html/misc/welcome.html b/Base/res/html/misc/welcome.html
@@ -38,6 +38,7 @@ <h1>Welcome to the Serenity Browser!</h1>
  <p>This page loaded in <b><span id="loadtime"></span></b> ms</p>
  <p>Some small test pages:</p>
  <ul>
+ <li><a href="link-over-zindex-block.html">link elements with background box placed with z-index</a></li>
  <li><a href="contenteditable.html">contenteditable</a></li>
  <li><a href="clear-1.html">clearing floats</a></li>
  <li><a href="float-1.html">floating boxes</a></li>