viewport-attribute-event-handlers-manual.html (2658B)
1 <!doctype html> 2 <html> 3 <head> 4 <title>Viewport: Attribute event handlers test</title> 5 <meta charset="utf-8"> 6 <meta name="viewport" content="width=device-width"> 7 <script src="/resources/testharness.js"></script> 8 <script src="/resources/testharnessreport.js"></script> 9 <script src="viewport_support.js"></script> 10 <script> 11 setup({explicit_timeout: true, explicit_done: true}) 12 </script> 13 </head> 14 <body> 15 <h1>Viewport: Attribute event handlers test</h1> 16 <h4> 17 Test Description: This test checks that attribute event handlers function correctly. 18 </h4> 19 <h2 style="color: red">THIS IS A MANUAL TEST</h2> 20 <p id="skip"> 21 <button id="skipbtn" onclick="skipManualTest();">Skip Test</button> 22 </p> 23 <p id="instruction"></p> 24 <button id="continue">Start Test</button> 25 <div id="log"></div> 26 </body> 27 <script> 28 var continueBtn = document.getElementById("continue"); 29 30 function continueTest() { 31 nextStep(function(instructionText) { 32 var instruction = document.getElementById("instruction"); 33 continueBtn.innerText = "Continue"; 34 instruction.innerText = instructionText; 35 }); 36 } 37 38 continueBtn.addEventListener('click', continueTest); 39 40 var didFireResize = false; 41 var didFireScroll = false; 42 43 addManualTestStep( 44 function() { 45 test(() => { 46 assert_not_equals(typeof(window.visualViewport.onresize), 47 'undefined', 48 'onresize is defined'); 49 assert_not_equals(typeof(window.visualViewport.onscroll), 50 'undefined', 51 'onscroll is defined'); 52 }, 'Attribute event handlers defined'); 53 54 window.visualViewport.onresize = function(e) { 55 didFireResize = true; 56 }; 57 window.visualViewport.onscroll = function(e) { 58 didFireScroll = true; 59 }; 60 }, 61 null, 62 '1. Pinch-zoom into the screen anywhere by any amount.'); 63 64 addManualTestStep( 65 function() { 66 test(() => { 67 assert_true(didFireResize, 'Resize event fired'); 68 assert_true(didFireScroll, 'Scroll event fired'); 69 }, 'Event handler functionality'); 70 continueBtn.remove(); 71 }, 72 null, 73 'Test Complete'); 74 </script> 75 </html>