| Chris Harrelson | 92d9bd4 | 2020-11-25 00:00:42 | [diff] [blame] | 1 | <!DOCTYPE html> |
| 2 | <title>Layout Instability: content-visibility:hidden content</title> |
| 3 | <link rel="help" href="https://wicg.github.io/layout-instability/" /> |
| Xianzhu Wang | 85a49cb | 2020-12-16 18:18:45 | [diff] [blame^] | 4 | <script src="/resources/testharness.js"></script> |
| 5 | <script src="/resources/testharnessreport.js"></script> |
| 6 | <script src="resources/util.js"></script> |
| 7 | <script> |
| 8 | // These scripts need to be before the contents because we need to ensure no |
| 9 | // layout shifts during page load. |
| 10 | promise_test(async () => { |
| 11 | const watcher = new ScoreWatcher; |
| 12 | |
| 13 | // Wait for the initial render to complete. |
| 14 | await waitForAnimationFrames(2); |
| 15 | assert_equals(watcher.score, 0); |
| 16 | }, 'on-screen content-visibility:auto'); |
| 17 | </script> |
| Chris Harrelson | 92d9bd4 | 2020-11-25 00:00:42 | [diff] [blame] | 18 | <style> |
| 19 | #target { |
| 20 | content-visibility: hidden; |
| 21 | contain-intrinsic-size: 1px; |
| 22 | width: 100px; |
| 23 | } |
| 24 | </style> |
| 25 | <div id=target> |
| 26 | <div style="width: 100px; height: 100px"></div> |
| 27 | </div> |
