| <!DOCTYPE html> |
| <html> |
| <meta charset="utf-8"> |
| <title>CSS Basic User Interface Test: interacting with the ellipsis</title> |
| <link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/"> |
| <link rel="help" href="http://www.w3.org/TR/css3-ui/#text-overflow"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="/resources/testdriver.js"></script> |
| <script src="/resources/testdriver-vendor.js"></script> |
| <meta name="assert" content="Ellipsing must not prevent dispatching of pointer events."> |
| <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" /> |
| <style> |
| #test { |
| overflow: hidden; |
| text-overflow: ellipsis; |
| margin-left: -100px; |
| width: 2.5em; |
| height: 1em; |
| white-space: pre; |
| font: 100px/1 Ahem; |
| color: blue; |
| } |
| #desc { |
| float: left; |
| } |
| </style> |
| |
| <div id="desc">First, click the blue box. </div> |
| <div id="test"> </div> |
| <script> |
| |
| let test = document.getElementById("test"); |
| |
| promise_test(async t => { |
| await document.fonts.ready; |
| |
| let clicked = false; |
| test.addEventListener("click", () => { |
| clicked = true; |
| }); |
| |
| await test_driver.click(test); |
| |
| assert_true(clicked); |
| }); |
| |
| </script> |
