| <!doctype html> |
| <style> |
| div { |
| top: 100px; |
| bottom: 100px; |
| left: 100px; |
| right: 100px; |
| height: auto; |
| width: auto; |
| } |
| ::backdrop { |
| background: green; |
| } |
| </style> |
| |
| <div id='element'>Test that fullscreen elements are in the top layer. The test passes if you see a green backdrop behind this box when fullscreen.</div> |
| |
| <button id='button'>Go fullscreen</button> |
| |
| <script> |
| var element = document.getElementById('element'); |
| document.getElementById('button').addEventListener('click', function() { |
| element.webkitRequestFullscreen(); |
| }); |
| |
| if (window.testRunner) { |
| testRunner.waitUntilDone(); |
| document.addEventListener('webkitfullscreenchange', function() { |
| testRunner.notifyDone(); |
| }); |
| |
| var button = document.getElementById('button'); |
| chrome.gpuBenchmarking.pointerActionSequence([ |
| { |
| source: 'mouse', |
| actions: [ |
| { name: 'pointerDown', x: button.offsetLeft + button.offsetWidth / 2, y: button.offsetTop + button.offsetHeight / 2 }, |
| { name: 'pointerUp' } |
| ] |
| } |
| ], () => {}); |
| } |
| </script> |
