pip-size.optional.https.html (5368B)
1 <!DOCTYPE html> 2 <title>Optional: Test modifying document picture-in-picture window's width and height</title> 3 <script src="/resources/testharness.js"></script> 4 <script src="/resources/testharnessreport.js"></script> 5 <script src="/resources/testdriver.js"></script> 6 <script src="/resources/testdriver-vendor.js"></script> 7 <body> 8 <script> 9 promise_test(async (t) => { 10 await test_driver.bless('request PiP window from top window'); 11 let pipWindow = await documentPictureInPicture.requestWindow({ 12 preferInitialWindowPlacement: true 13 }); 14 15 const iniWidth = pipWindow.innerWidth, iniHeight = pipWindow.innerHeight; 16 assert_true(true, `PIP has default inner width ${iniWidth}, height ${iniHeight}`); 17 18 await test_driver.bless('request PiP window from top window'); 19 pipWindow = await documentPictureInPicture.requestWindow({ 20 preferInitialWindowPlacement: true, width: iniWidth + 100, height: iniHeight 21 }); 22 assert_equals(pipWindow.innerWidth, iniWidth + 100, 'Got the requested width'); 23 }, 'Requesting PIP with width and height'); 24 25 // Restricting max size is mandatory, but depends on optional size parameters 26 promise_test(async (t) => { 27 const { availWidth, availHeight } = window.screen; 28 29 await test_driver.bless('request PiP window from top window'); 30 // We request them as inner size, so the outer size would be even larger 31 // but it only matters that we would cover the screen. 32 const pipWindow = await documentPictureInPicture.requestWindow({ 33 preferInitialWindowPlacement: true, width: availWidth, height: availHeight 34 }); 35 36 assert_less_than(pipWindow.outerWidth, availWidth, "PIP window width smaller than screen (initial)"); 37 assert_less_than(pipWindow.outerHeight, availHeight, "PIP window height smaller than screen"); 38 39 // shrink and test resizeTo is restricted 40 await test_driver.bless('resize window'); 41 let resized = new Promise(res => pipWindow.addEventListener("resize", res, { once: true })); 42 pipWindow.resizeTo(100, 100); 43 await resized; 44 45 await test_driver.bless('resize window'); 46 resized = new Promise(res => pipWindow.addEventListener("resize", res, { once: true })); 47 pipWindow.resizeTo(availWidth, availHeight); 48 await resized; 49 50 assert_less_than(pipWindow.outerWidth, availWidth, "PIP window width smaller than screen (resizeTo)"); 51 assert_less_than(pipWindow.outerHeight, availHeight, "PIP window height smaller than screen (resizeTo)"); 52 53 // shrink and test resizeBy is restricted 54 await test_driver.bless('resize window'); 55 resized = new Promise(res => pipWindow.addEventListener("resize", res, { once: true })); 56 pipWindow.resizeTo(100, 100); 57 await resized; 58 59 await test_driver.bless('resize window'); 60 resized = new Promise(res => pipWindow.addEventListener("resize", res, { once: true })); 61 pipWindow.resizeBy(availWidth, availHeight); 62 await resized; 63 64 assert_less_than(pipWindow.outerWidth, availWidth, "PIP window width smaller than screen (resizyBy)"); 65 assert_less_than(pipWindow.outerHeight, availHeight, "PIP window height smaller than screen (resizeBy)"); 66 }, 'Test maximum size is restricted'); 67 68 promise_test(async (t) => { 69 await test_driver.bless('request PiP window from top window'); 70 let pipWindow = await documentPictureInPicture.requestWindow({ 71 preferInitialWindowPlacement: true 72 }); 73 74 const iniWidth = pipWindow.innerWidth; 75 assert_true(true, `PIP has default inner width ${iniWidth}`); 76 77 // First, test that preferInitialWindowPlacement forces initial non-remembered position 78 await test_driver.bless('resize window'); 79 let resized = new Promise(res => pipWindow.addEventListener("resize", res, { once: true })); 80 pipWindow.resizeBy(100, 0); 81 await resized; 82 assert_equals(pipWindow.innerWidth, iniWidth + 100, 'PiP was resized'); 83 pipWindow.close(); 84 85 await test_driver.bless('request PiP window from top window'); 86 pipWindow = await documentPictureInPicture.requestWindow({ 87 preferInitialWindowPlacement: true 88 }); 89 assert_equals(pipWindow.innerWidth, iniWidth, 90 'preferInitialWindowPlacement causes PiP to open at initial, non-remembered size'); 91 92 // Now, test that the API does remember the position when explicitly closing the PiP 93 await test_driver.bless('resize window'); 94 resized = new Promise(res => pipWindow.addEventListener("resize", res, { once: true })); 95 pipWindow.resizeBy(100, 0); 96 await resized; 97 assert_equals(pipWindow.innerWidth, iniWidth + 100, 'PiP was resized'); 98 pipWindow.close(); 99 100 await test_driver.bless('request PiP window from top window'); 101 pipWindow = await documentPictureInPicture.requestWindow({ 102 preferInitialWindowPlacement: false 103 }); 104 assert_equals(pipWindow.innerWidth, iniWidth + 100, 'PiP was restored at previous size'); 105 106 // Now, test that the API does remember the position when requesting a PiP while one is still open 107 await test_driver.bless('resize window'); 108 resized = new Promise(res => pipWindow.addEventListener("resize", res, { once: true })); 109 pipWindow.resizeBy(-50, 0); 110 await resized; 111 assert_equals(pipWindow.innerWidth, iniWidth + 50, 'PiP was resized'); 112 113 await test_driver.bless('request PiP window from top window'); 114 pipWindow = await documentPictureInPicture.requestWindow({ 115 preferInitialWindowPlacement: false 116 }); 117 assert_equals(pipWindow.innerWidth, iniWidth + 50, 'PiP was restored at previous size'); 118 }, `PiP remembers size`); 119 </script> 120 </body>