| <!DOCTYPE html> |
| <title>select as flex item with overflowing content</title> |
| <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/" /> |
| <link rel="stylesheet" href="/fonts/ahem.css"> |
| |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| |
| <style> |
| .flexBox { |
| display: flex; |
| flex-direction: column; |
| width: 100px; |
| overflow: scroll; |
| } |
| |
| select { |
| font-family: Ahem; |
| } |
| </style> |
| <p>Test passes if the flex box is not scrollable.</p> |
| |
| <div class=flexBox> |
| <select> |
| <option>this is a long long long long text</option> |
| </select> |
| </div> |
| <script> |
| test(function(t) |
| { |
| const flexBox = document.querySelector('.flexBox'); |
| assert_less_than_equal(flexBox.scrollWidth, 100); |
| }, "select content (option) should not trigger scrollable overflow."); |
| </script> |
