browser_treeupdate_imagemap.js (5866B)
1 /* This Source Code Form is subject to the terms of the Mozilla Public 2 * License, v. 2.0. If a copy of the MPL was not distributed with this 3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ 4 5 "use strict"; 6 7 /* import-globals-from ../../mochitest/role.js */ 8 loadScripts({ name: "role.js", dir: MOCHITESTS_DIR }); 9 10 async function testImageMap(browser, accDoc) { 11 const id = "imgmap"; 12 const acc = findAccessibleChildByID(accDoc, id); 13 14 /* ================= Initial tree test ==================================== */ 15 let tree = { 16 IMAGE_MAP: [{ role: ROLE_LINK, name: "b", children: [] }], 17 }; 18 testAccessibleTree(acc, tree); 19 20 /* ================= Insert area ========================================== */ 21 let onReorder = waitForEvent(EVENT_REORDER, id); 22 await invokeContentTask(browser, [], () => { 23 let areaElm = content.document.createElement("area"); 24 let mapNode = content.document.getElementById("map"); 25 areaElm.setAttribute( 26 "href", 27 // eslint-disable-next-line @microsoft/sdl/no-insecure-url 28 "http://www.bbc.co.uk/radio4/atoz/index.shtml#a" 29 ); 30 areaElm.setAttribute("coords", "0,0,13,14"); 31 areaElm.setAttribute("alt", "a"); 32 areaElm.setAttribute("shape", "rect"); 33 mapNode.insertBefore(areaElm, mapNode.firstChild); 34 }); 35 await onReorder; 36 37 tree = { 38 IMAGE_MAP: [ 39 { role: ROLE_LINK, name: "a", children: [] }, 40 { role: ROLE_LINK, name: "b", children: [] }, 41 ], 42 }; 43 testAccessibleTree(acc, tree); 44 45 /* ================= Append area ========================================== */ 46 onReorder = waitForEvent(EVENT_REORDER, id); 47 await invokeContentTask(browser, [], () => { 48 let areaElm = content.document.createElement("area"); 49 let mapNode = content.document.getElementById("map"); 50 areaElm.setAttribute( 51 "href", 52 // eslint-disable-next-line @microsoft/sdl/no-insecure-url 53 "http://www.bbc.co.uk/radio4/atoz/index.shtml#c" 54 ); 55 areaElm.setAttribute("coords", "34,0,47,14"); 56 areaElm.setAttribute("alt", "c"); 57 areaElm.setAttribute("shape", "rect"); 58 mapNode.appendChild(areaElm); 59 }); 60 await onReorder; 61 62 tree = { 63 IMAGE_MAP: [ 64 { role: ROLE_LINK, name: "a", children: [] }, 65 { role: ROLE_LINK, name: "b", children: [] }, 66 { role: ROLE_LINK, name: "c", children: [] }, 67 ], 68 }; 69 testAccessibleTree(acc, tree); 70 71 /* ================= Remove area ========================================== */ 72 onReorder = waitForEvent(EVENT_REORDER, id); 73 await invokeContentTask(browser, [], () => { 74 let mapNode = content.document.getElementById("map"); 75 mapNode.removeChild(mapNode.firstElementChild); 76 }); 77 await onReorder; 78 79 tree = { 80 IMAGE_MAP: [ 81 { role: ROLE_LINK, name: "b", children: [] }, 82 { role: ROLE_LINK, name: "c", children: [] }, 83 ], 84 }; 85 testAccessibleTree(acc, tree); 86 } 87 88 async function testContainer(browser) { 89 const id = "container"; 90 /* ================= Remove name on map =================================== */ 91 let onReorder = waitForEvent(EVENT_REORDER, id); 92 await invokeSetAttribute(browser, "map", "name"); 93 let event = await onReorder; 94 const acc = event.accessible; 95 96 let tree = { 97 SECTION: [{ GRAPHIC: [] }], 98 }; 99 testAccessibleTree(acc, tree); 100 101 /* ================= Restore name on map ================================== */ 102 onReorder = waitForEvent(EVENT_REORDER, id); 103 await invokeSetAttribute(browser, "map", "name", "atoz_map"); 104 // XXX: force repainting of the image (see bug 745788 for details). 105 await invokeContentTask(browser, [], () => { 106 const { ContentTaskUtils } = ChromeUtils.importESModule( 107 "resource://testing-common/ContentTaskUtils.sys.mjs" 108 ); 109 const EventUtils = ContentTaskUtils.getEventUtils(content); 110 EventUtils.synthesizeMouse( 111 content.document.getElementById("imgmap"), 112 10, 113 10, 114 { type: "mousemove" }, 115 content 116 ); 117 }); 118 await onReorder; 119 120 tree = { 121 SECTION: [ 122 { 123 IMAGE_MAP: [{ LINK: [] }, { LINK: [] }], 124 }, 125 ], 126 }; 127 testAccessibleTree(acc, tree); 128 129 /* ================= Remove map =========================================== */ 130 onReorder = waitForEvent(EVENT_REORDER, id); 131 await invokeContentTask(browser, [], () => { 132 let mapNode = content.document.getElementById("map"); 133 mapNode.remove(); 134 }); 135 await onReorder; 136 137 tree = { 138 SECTION: [{ GRAPHIC: [] }], 139 }; 140 testAccessibleTree(acc, tree); 141 142 /* ================= Insert map =========================================== */ 143 onReorder = waitForEvent(EVENT_REORDER, id); 144 await invokeContentTask(browser, [id], contentId => { 145 let map = content.document.createElement("map"); 146 let area = content.document.createElement("area"); 147 148 map.setAttribute("name", "atoz_map"); 149 map.setAttribute("id", "map"); 150 151 // eslint-disable-next-line @microsoft/sdl/no-insecure-url 152 area.setAttribute("href", "http://www.bbc.co.uk/radio4/atoz/index.shtml#b"); 153 area.setAttribute("coords", "17,0,30,14"); 154 area.setAttribute("alt", "b"); 155 area.setAttribute("shape", "rect"); 156 157 map.appendChild(area); 158 content.document.getElementById(contentId).appendChild(map); 159 }); 160 await onReorder; 161 162 tree = { 163 SECTION: [ 164 { 165 IMAGE_MAP: [{ LINK: [] }], 166 }, 167 ], 168 }; 169 testAccessibleTree(acc, tree); 170 171 /* ================= Hide image map ======================================= */ 172 onReorder = waitForEvent(EVENT_REORDER, id); 173 await invokeSetStyle(browser, "imgmap", "display", "none"); 174 await onReorder; 175 176 tree = { 177 SECTION: [], 178 }; 179 testAccessibleTree(acc, tree); 180 } 181 182 addAccessibleTask( 183 "e10s/doc_treeupdate_imagemap.html", 184 async function (browser, accDoc) { 185 await waitForImageMap(browser, accDoc); 186 await testImageMap(browser, accDoc); 187 await testContainer(browser); 188 }, 189 { iframe: true, remoteIframe: true } 190 );