| <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> |
| <html> |
| <head> |
| <script src="../../resources/js-test-pre.js"></script> |
| </head> |
| <body> |
| <script> |
| description("Test that when image map areas have their shape or coordinate dynamically altered, the clickable region changes."); |
| |
| if (!window.eventSender) |
| debug("This test will only work properly inside DRT."); |
| |
| var image = document.createElement('img'); |
| image.setAttribute('usemap', '#m'); |
| image.style.width = '400px'; |
| image.style.height = '400px'; |
| image.style.border = '1px solid red'; |
| image.style.position = 'absolute'; |
| image.style.left = '0'; |
| image.style.top = '0'; |
| |
| area = document.createElement('area'); |
| area.setAttribute('href', '#'); |
| area.setAttribute('onclick', 'areaClicked = true; return false;'); |
| |
| areaClicked = false; |
| |
| var map = document.createElement('map'); |
| map.setAttribute('name', 'm'); |
| map.appendChild(area); |
| |
| document.body.appendChild(image); |
| document.body.appendChild(map); |
| |
| function setArea(shape, coords) |
| { |
| area.setAttribute('shape', shape); |
| area.setAttribute('coords', coords); |
| } |
| |
| function checkForArea(x, y) |
| { |
| if (!window.eventSender) |
| return false; |
| |
| areaClicked = false; |
| |
| eventSender.mouseMoveTo(x, y); |
| eventSender.mouseDown(); |
| eventSender.mouseUp(); |
| |
| return areaClicked; |
| } |
| |
| shouldBe("setArea('default', ''); checkForArea(50, 50)", "true"); |
| |
| shouldBe("setArea('rect', '0, 0, 100, 100'); checkForArea(50, 50)", "true"); |
| shouldBe("setArea('rect', '0, 0, 100, 100'); checkForArea(150, 150)", "false"); |
| |
| shouldBe("setArea('rect', '200, 200, 300, 300'); checkForArea(50, 50)", "false"); |
| shouldBe("setArea('rect', '200, 200, 300, 300'); checkForArea(250, 250)", "true"); |
| |
| shouldBe("setArea('circle', '100, 100, 50'); checkForArea(100, 100)", "true"); |
| shouldBe("setArea('circle', '100, 100, 50'); checkForArea(120, 100)", "true"); |
| shouldBe("setArea('circle', '100, 100, 50'); checkForArea(200, 100)", "false"); |
| |
| shouldBe("setArea('circle', '300, 300, 50'); checkForArea(100, 100)", "false"); |
| shouldBe("setArea('circle', '300, 300, 50'); checkForArea(300, 300)", "true"); |
| shouldBe("setArea('circle', '300, 300, 50'); checkForArea(320, 300)", "true"); |
| |
| shouldBe("setArea('poly', '100, 100, 200, 100, 200, 200'); checkForArea(150, 150)", "true"); |
| shouldBe("setArea('poly', '100, 100, 200, 100, 200, 200'); checkForArea(100, 150)", "false"); |
| shouldBe("setArea('poly', '100, 100, 200, 100, 200, 200'); checkForArea(300, 300)", "false"); |
| |
| shouldBe("setArea('default', ''); checkForArea(300, 300)", "true"); |
| |
| document.body.removeChild(image); |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| </body> |
| </html> |
