reconnectToMultiplePresentations_success-manual.https.html (5163B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>Reconnecting presentations on two distinct displays</title> 4 <link rel="author" title="Tomoyuki Shimizu" href="https://github.com/tomoyukilabs"> 5 <link rel="help" href="http://w3c.github.io/presentation-api/#dom-presentationrequest-reconnect"> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 <script src="common.js"></script> 9 <style> 10 #second-step { 11 display: none; 12 } 13 </style> 14 15 <p id="first-step">Click the button below and select the available presentation display, to start the manual test.</p> 16 <p id="second-step">Click the button below and select the other available presentation display, to continue the manual test.</p> 17 <p>This test asks you to click the button twice, unless the test fails.<br> 18 <em>This test requires two or more available displays.<em></p> 19 <button id="presentBtn">Start Presentation Test</button> 20 21 22 <script> 23 promise_test(async t => { 24 const presentBtn = document.getElementById("presentBtn"); 25 26 const request1 = new PresentationRequest(presentationUrls); 27 const request2 = new PresentationRequest(presentationUrls); 28 const clickWatcher = new EventWatcher(t, presentBtn, 'click'); 29 let connection1, connection2, eventWatcher1, eventWatcher2, timer; 30 31 t.add_cleanup(() => { 32 [ 33 { connection: connection1, request: request1 }, 34 { connection: connection2, request: request2 } 35 ].forEach(p => { 36 if (p.connection) { 37 p.connection.onconnect = () => { p.connection.terminate(); }; 38 if (p.connection.state == 'closed') 39 p.request.reconnect(p.connection.id); 40 else 41 p.connection.terminate(); 42 } 43 }); 44 }); 45 46 const disableTimeout = () => { 47 setup({explicit_timeout: true}); 48 if (timer) { 49 clearTimeout(timer); 50 timer = null; 51 } 52 }; 53 54 const enableTimeout = () => { 55 timer = t.step_timeout(() => { 56 t.force_timeout(); 57 t.done(); 58 }, 5000); 59 } 60 61 disableTimeout(); 62 63 await clickWatcher.wait_for('click'); 64 presentBtn.disabled = true; 65 connection1 = await request1.start(); 66 67 presentBtn.disabled = false; 68 document.getElementById('first-step').style.display = 'none'; 69 document.getElementById('second-step').style.display = 'block'; 70 presentBtn.innerText = 'Continue Presentation Test'; 71 eventWatcher1 = new EventWatcher(t, connection1, ['connect', 'close', 'terminate']); 72 73 await Promise.all([ 74 eventWatcher1.wait_for('connect'), 75 (async () => { 76 await clickWatcher.wait_for('click'); 77 presentBtn.disabled = true; 78 79 connection2 = await request2.start(); 80 enableTimeout(); 81 eventWatcher2 = new EventWatcher(t, connection2, ['connect', 'close', 'terminate']); 82 await eventWatcher2.wait_for('connect'); 83 })() 84 ]); 85 86 connection1.close(); 87 assert_equals(connection2.state, 'connected', 88 'Closing one presentation connection does not affect the state of the other.'); 89 90 await eventWatcher1.wait_for('close'); 91 assert_equals(connection1.state, 'closed', 'The presentation connection is successfully closed.'); 92 93 connection2.close(); 94 await eventWatcher2.wait_for('close'); 95 assert_equals(connection2.state, 'closed', 'The presentation connection is successfully closed.'); 96 97 const c11 = await request1.reconnect(connection1.id); 98 assert_equals(c11, connection1, 'The promise is resolved with the existing presentation connection.'); 99 100 const c22 = await request2.reconnect(connection2.id); 101 assert_equals(c22, connection2, 'The promise is resolved with the existing presentation connection.'); 102 103 await Promise.all([ 104 eventWatcher1.wait_for('connect'), 105 eventWatcher2.wait_for('connect') 106 ]); 107 108 assert_equals(connection1.state, 'connected', 'The presentation connection is successfully reconnected.'); 109 assert_equals(connection2.state, 'connected', 'The presentation connection is successfully reconnected.'); 110 111 // Reconnecting a presentation via a different presentation request with the same presentation 112 // URLs will succeed 113 connection2.close(); 114 await eventWatcher2.wait_for('close'); 115 const c12 = await request1.reconnect(connection2.id); 116 assert_equals(c12, connection2, 'The promise is resolved with the existing presentation connection.'); 117 118 connection1.close(); 119 await eventWatcher1.wait_for('close'); 120 const c21 = await request2.reconnect(connection1.id); 121 assert_equals(c21, connection1, 'The promise is resolved with the existing presentation connection.'); 122 123 await Promise.all([ 124 eventWatcher1.wait_for('connect'), 125 eventWatcher2.wait_for('connect') 126 ]); 127 128 assert_equals(connection1.state, 'connected', 'The presentation connection is successfully reconnected.'); 129 assert_equals(connection2.state, 'connected', 'The presentation connection is successfully reconnected.'); 130 connection1.terminate(); 131 connection2.terminate(); 132 133 await Promise.all([ 134 eventWatcher1.wait_for('terminate'), 135 eventWatcher2.wait_for('terminate') 136 ]); 137 }); 138 </script>