<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>Page Visibility API Operation While Minimizing Browser Window</title> <meta name="flags" content="interact" /> <script type="text/javascript" src="/resources/testharness.js"></script> <script type="text/javascript" src="/resources/testharnessreport.js"></script> <script type="text/javascript" src="resources/pagevistestharness.js"></script> </head> <body> <h1>Description</h1> <p>This test validates that the page properly becomes hidden and visible due to minimizing, maximizing, and restoring the browser window.</p> <h1>Manual Test Steps:</h1> <p> <ol> <li> Ensure this page is the foreground and click the "Start Test"</li> <li> Minimize the browser</li> <li> Restore or maximize the browser</li> </ol> Note: This test will automatically timeout and fail if not completed within 60 seconds. </p> <button onclick="start_test();">Start Test</button> <div id="log"></div> <br /> IFrame with default style: <br /> <iframe id="childDocShown" src="resources/blank_page_green.html"> iframes unsupported </iframe> <hr /> IFrame with "display:none" style: <br /> <iframe id="childDocHidden" src="resources/blank_page_green.html" style="display:none"> iframes unsupported </iframe> <script type="text/javascript" > var child_doc_shown = null; var child_doc_hidden = null; var transition_mode; var manual_test = null; var expected_notification_count = 2; var notification_count = new Array(); var page_docs = new Array(); var notification_handlers = new Array(); var two_notifications = false; var PAGE_HIDDEN_VAL = "hidden"; var PAGE_VISIBLE_VAL = "visible"; setup({ explicit_done: true }); function test_transition_init() { child_doc_shown = document.getElementById("childDocShown").contentDocument; child_doc_hidden = document.getElementById("childDocHidden").contentDocument; // fill in data for page documents page_docs.push([document, "document"]); page_docs.push([child_doc_shown, "document.getElementById(\"childDocShown\").contentDocument"]); page_docs.push([child_doc_hidden, "document.getElementById(\"childDocHidden\").contentDocument"]); notification_handlers[0] = function(){ VerifyNotification(0); }; notification_handlers[1] = function(){ VerifyNotification(1); }; notification_handlers[2] = function(){ VerifyNotification(2); }; for (var i in page_docs) { notification_count[i] = 0; page_docs[i][0].addEventListener("visibilitychange", notification_handlers[i]); } test_true(!document.hidden, "Page is visible on load."); test_true((!child_doc_shown.hidden) && (!child_doc_hidden.hidden), "All IFrame child documents are visible on load."); document.addEventListener("visibilitychange", notification_handlers[0]); document.addEventListener("visibilitychange", VerifyTwoNotifications); manual_test = AddManual("Browser minimization has occurred."); } function VerifyNotification(doc_index) { doc = page_docs[doc_index][0]; docName = page_docs[doc_index][1]; notification_count[doc_index]++; switch (notification_count[doc_index]) { case 1: // First step, check page visibility after tab deselection / minimization. // hidden should change to true; visibilityState should change to "hidden" test_true(doc.hidden, docName + ".hidden == true (after browser frame minimization)"); test_true(doc.visibilityState == PAGE_HIDDEN_VAL, docName + ".visibilityState == \"hidden\" (after browser frame minimization)"); break; case 2: //Second step, check page visibility after tab reselection / maximization / restoration. // hidden should change to false; visibilityState should change to "visible" test_true(!doc.hidden, docName + ".hidden == false (after browser frame maximization / restoration)"); test_true(doc.visibilityState == PAGE_VISIBLE_VAL, docName + ".visibilityState == \"visible\" (after browser frame maximization / " + "restoration)"); // perform tests specific to the main document if (doc == document) { //Verify that a second registration to a different callback also occurred test_true(two_notifications, "Two registrations (different callbacks) occurred."); //Verify that a second registration to the same callback did not occur test_equals(notification_count[doc_index], expected_notification_count, "Two registrations (same callback) did not occur."); // pass the manual item associated with these tests AddManualResult(manual_test, true); document.removeEventListener("visibilitychange", VerifyTwoNotifications); // schedule the rollup setTimeout(VerifyAllNotifications, 200); } //Remove all event listeners and verify that the event does not fire doc.removeEventListener("visibilitychange", notification_handlers[doc_index]); break; case 3: //This step should not have occurred since the event handlers were cleared test_true(false, "Event did not fire when event listener is removed."); //On final step, schedule the rollup setTimeout(done, 2000); break; default: break; } } function VerifyAllNotifications() { //On final step, schedule the rollup setTimeout(done, 1000); } function VerifyTwoNotifications() { //This is a duplicate registration on visibilitychange and //should never get fired. Check that duplicate_notification //is false to verify that this never occurred. two_notifications = true; } // Manual Test helper functions function AddManual(test) { // add asynchronous test for manual tests return async_test(test); } function AddManualResult(oManualTest, passState) { // add assertion to manual test for the pass state oManualTest.step(function() {assert_true(passState)}); // end manual test oManualTest.done(); } function start_test() { test_transition_init(); } </script> </body> </html>