mouse-cursor-imagemap.html (1003B)
1 <!doctype html> 2 <img usemap="#map" src="data:image/gif;base64,R0lGODlhAQABAIAAAOTm7AAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" width="1000" height="1000" style="border: 1px solid black;"> 3 <map name="map"> 4 <area id="clickable-area" shape="rect" coords="0,0,500,500" href="#" role="img"> 5 <area id="nonclickable-area" shape="rect" coords="500,500,1000,1000" role="img"><!-- No href attribute.--> 6 </map> 7 8 <p>An unclickable (non-link) area should not show the link cursor when hovered.</p> 9 10 <script src="/resources/testharness.js"></script> 11 <script src="/resources/testharnessreport.js"></script> 12 <script> 13 test(function() { 14 let clickable = window.getComputedStyle(document.getElementById('clickable-area')); 15 let nonclickable = window.getComputedStyle(document.getElementById('nonclickable-area')); 16 assert_equals(clickable.getPropertyValue('cursor'), 'pointer'); 17 assert_not_equals(nonclickable.getPropertyValue('cursor'), 'pointer'); 18 }, 'Only clickable areas should show the link cursor.'); 19 </script>