test_statechange.xhtml (3771B)
1 <?xml version="1.0"?> 2 <?xml-stylesheet href="chrome://global/skin" type="text/css"?> 3 <?xml-stylesheet href="chrome://mochikit/content/tests/SimpleTest/test.css" 4 type="text/css"?> 5 6 <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" 7 title="XUL state change event tests"> 8 9 <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js" /> 10 <script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"/> 11 12 <script type="application/javascript" 13 src="../common.js" /> 14 <script type="application/javascript" 15 src="../role.js" /> 16 <script type="application/javascript" 17 src="../states.js" /> 18 <script type="application/javascript" 19 src="../promisified-events.js" /> 20 21 <script type="application/javascript"> 22 <![CDATA[ 23 function offscreenChangeEvent(acc, enabled) { 24 return [ 25 EVENT_STATE_CHANGE, 26 event => { 27 const scEvent = event.QueryInterface(nsIAccessibleStateChangeEvent); 28 return event.accessible == acc && 29 scEvent.state == STATE_OFFSCREEN && 30 scEvent.isEnabled == enabled; 31 } 32 ]; 33 } 34 35 async function testTabpanels() { 36 const tabs = getNode("tabs"); 37 is(tabs.selectedIndex, 0, "tab1 initially selected"); 38 const panel1 = getAccessible("panel1"); 39 testStates(panel1, 0, 0, STATE_OFFSCREEN); 40 const panel2 = getAccessible("panel2"); 41 testStates(panel2, STATE_OFFSCREEN); 42 const panel3 = getAccessible("panel3"); 43 testStates(panel3, STATE_OFFSCREEN); 44 45 let events = waitForEvents([ 46 offscreenChangeEvent(panel1, true), 47 offscreenChangeEvent(panel2, false) 48 ]); 49 info("Selecting tab2"); 50 tabs.selectedIndex = 1; 51 await events; 52 53 events = waitForEvents([ 54 offscreenChangeEvent(panel2, true), 55 offscreenChangeEvent(panel3, false) 56 ]); 57 info("Selecting tab3"); 58 tabs.selectedIndex = 2; 59 await events; 60 61 events = waitForEvents([ 62 offscreenChangeEvent(panel3, true), 63 offscreenChangeEvent(panel1, false) 64 ]); 65 info("Selecting tab1"); 66 tabs.selectedIndex = 0; 67 await events; 68 } 69 70 async function testPressed() { 71 const toolbarbuttonCheckbox = getNode("toolbarbuttonCheckbox"); 72 testStates(toolbarbuttonCheckbox, 0, 0, STATE_PRESSED); 73 info("Checking toolbarbuttonCheckbox"); 74 let changed = waitForStateChange(toolbarbuttonCheckbox, STATE_PRESSED, true); 75 toolbarbuttonCheckbox.setAttribute("checked", true); 76 await changed; 77 info("Unchecking toolbarbuttonCheckbox"); 78 changed = waitForStateChange(toolbarbuttonCheckbox, STATE_PRESSED, false); 79 toolbarbuttonCheckbox.removeAttribute("checked"); 80 await changed; 81 } 82 83 async function doTests() { 84 await testTabpanels(); 85 await testPressed(); 86 SimpleTest.finish(); 87 } 88 89 SimpleTest.waitForExplicitFinish(); 90 addA11yLoadEvent(doTests); 91 ]]> 92 </script> 93 94 <hbox flex="1" style="overflow: auto;"> 95 <body xmlns="http://www.w3.org/1999/xhtml"> 96 <p id="display"></p> 97 <div id="content" style="display: none"></div> 98 <pre id="test"> 99 </pre> 100 </body> 101 102 <tabbox id="tabbox" selectedIndex="0"> 103 <tabs id="tabs"> 104 <tab id="tab1" label="tab1"/> 105 <tab id="tab2" label="tab2"/> 106 <tab id="tab3" label="tab3"/> 107 </tabs> 108 <tabpanels> 109 <hbox id="panel1"><button label="b1"/></hbox> 110 <hbox id="panel2"><button label="b2"/></hbox> 111 <hbox id="panel3"><button label="b3"/></hbox> 112 </tabpanels> 113 </tabbox> 114 115 <toolbarbutton id="toolbarbuttonCheckbox" type="checkbox">toolbarbuttonCheckbox</toolbarbutton> 116 </hbox> 117 </window>